家校通小程序实战教程04教师管理

1 创建数据源

打开编辑器，切换到云数据库，点击+号创建数据源

保持默认，点击下一步

输入模型名称教师表

点击添加字段，输入教师名称，类型选择文本

将教师名称设置为主列字段

添加第二个字段，教师性别，类型选择枚举，枚举项可以复用学生性别

添加第三个字段，联系电话，类型选择电话

添加第四个字段，所教科目，类型选择枚举，选择设置为多选

科目的话可以根据学校开展的科目不同进行具体的设置

添加第五个字段，是否班主任，类型选择布尔值

添加第六个字段，班级，选择关联关系，类型选择多对一

这里可能涉及到一个教师带多个班级的情况，这就需要设计多对多的关系，我们这个版本先不考虑，因为多对多一个是比较复杂，再一个功能上也需要有很多考虑

字段设置完毕了之后，我们设置一下权限，选择所有用户可读，创建者和管理员可以修改

2 搭建管理后台

数据源创建好之后，就需要搭建后台功能，打开我们的管理后台，点击页面创建的图标

选择教师表，左侧导航布局

切换到布局模式，选择左侧导航布局，在右侧点击添加平级菜单

选择我们的教师列表页面

修改菜单的名称，选择图标

回到设计界面，点击实时预览，可以看到我们设置的菜单已经生效

3 搭建查询条件

我们这里因为有了班级这种关联关系的字段，所以查询条件也需要自己设置一下。低代码的好处可以复制粘贴复用已经设置好的成果，切换到学生列表页面，选中我们的网格布局，复制一下，按ctrl+c就可以

切换到教师列表页面，选择布局内容组件，按ctr+v进行粘贴

点击网格布局组件，点击鼠标的右键，选择移动到最前

我们要重新设置一下变量，首先添加一个数据表查询变量，查询班级表的信息

选择班级表，方法选择查询多条，查询200条数据

将第二个字段改为教师姓名

第三个字段改为教师性别

第二行的第一列添加下拉单选组件，设置为所教科目，选项设置为语文、数学、英语、体育、音乐

第二行的第二列添加单行输入组件，修改为联系电话

然后我们按照字段一一建立自定义变量，对应我们每个查询条件的输入值

创建一个自定义方法用来绑定我们的查询按钮的点击事件

bash 复制代码

export default function ({ event, data }) {

  $w.page.dataset.state.className = $w.select1.value
  $w.page.dataset.state.teacherName = $w.input1.value
  $w.page.dataset.state.sex = $w.select2.value
  $w.page.dataset.state.subject = $w.select3.value
  $w.page.dataset.state.phone = $w.input2.value
}

再添加一个方法，用来和重置按钮绑定

bash 复制代码

export default function({event, data}) {
    $w.page.dataset.state.className = undefined
    $w.page.dataset.state.sex = undefined
    $w.page.dataset.state.teacherName = undefined
    $w.page.dataset.state.subject = undefined
    $w.page.dataset.state.phone = undefined
}