后端数据表结构
- 学生表 :
ID 、 学生名字 、 家长名字 、 购买课时 、 购买金额 、 date
- 老师表 :
ID 、 老师名字 、 老师手机号(唯一的) 、 学生ID 、 date
- 余额表 :
ID 、 剩余课时 、 剩余金额 、 学生ID、 date
- 消耗明细表 :
ID 、 学生名字 、 家长名字 、 单次消耗课时 、 单次消耗金额 、 当前剩余课时 、 当前剩余金额 、 上课老师
后台管理逻辑思维:
- 超级管理员登录后台,首先输入学生信息(
学生名字 家长名字 购买课时 购买金额
) 。点击提交,跳转到学生列表页。ps:列表页请求 三个表聚合查询后的json数据 ,默认 剩余课时、剩余金额 是没有填写的,默认显示未填写(判断条件 v-if=”xxx.length == 0“),默认 上课老师 页是没有指派的,默认显示未指派(判断条件 v-if=”xxx.length == 0“)
- 点击学生列表后面的指派老师,提示先完善余额表。
2-1 点击 剩余金额,弹出弹窗(`该弹窗为子组件,学生ID由父组件传入`)
完善一下余额表(`请求余额表的添加接口`)点击确定收回弹窗。
- 如果余额表已完善则不提示弹窗直接跳转到指派老师页面,学生列表页会带过来学生ID,根据学生ID指派老师完善老师表。点击确定跳转到学生列表页。ps:这个时候,第 1 步中提到的默认显示未填写和未指派的地方,正常显示其内容。
- 再次点击指派老师,可实现不同老师教一个学生。也可以在学生列表页,点击老师取消指派。teacher数组长度就会减1,后台设置最少指派一位老师,只剩一个老师的时候不可取消。(
这时候就实现了动态控制前端老师看到学生信息的权限
)
数据结构为 :
接口写法:
router.get("/teacher/over", (req, res) => {
Order.aggregate([{
$lookup: {
from: "overs",
localField: "_id",
foreignField: "order_id",
as: "over"
}
},
{
$lookup: {
from: "teachers",
localField: "_id",
foreignField: "order_id",
as: "teacher"
}
},
{
$project: {
"_id": 1,
"bodyName": 1,
"parentName": 1,
"buyTime": 1,
"buyPrice": 1,
"date": 1,
"over": {
"_id": 1,
"overTime": 1,
"overPrice": 1,
"date": 1,
"order_id":1
},
"teacher":{
"_id":1,
"teacher":1,
"phone":1,
"date": 1,
"order_id":1
}
}
}
], (err, allmsg) => {
res.json(allmsg)
})
})
前端(老师端)逻辑思维:
- 老师根据自己唯一手机号登录,后端返回老师唯一手机号(
指派老师的时候后台预设了老师的手机号
)。
- 前端根据后端返回的手机号作为参数请求接口,接口格式为:[
http://localhost:5000/api/teachers/${phone}
]
- 后端返回数据格式为:(
三个表聚合查询并用到 $match
)
接口写法:
//前端用于区分孩子信息的接口
router.post("/teachers/:phone", (req, res) => {
Teacher.aggregate([{
$lookup: {
from: "orders",
localField: "order_id",
foreignField: "_id",
as: "order"
}
},
{
$lookup: {
from: "overs",
localField: "order_id",
foreignField: "order_id",
as: "over"
}
},
{
$match:{
phone: req.params.phone
}
},
{
$project: {
"_id": 1,
"teacher": 1,
"order_id": 1,
"phone": 1,
"date": 1,
"over": {
"_id": 1,
"overTime": 1,
"overPrice": 1,
"date": 1,
},
"order":{
"_id":1,
"bodyName":1,
"parentName":1,
"buyTime":1,
"buyPrice":1,
"date": 1,
}
}
}
], (err, allmsg) => {
res.json(allmsg)
})
});
- 这样就可以实现不同老师看到自己上课的学生,其他学生信息看不到。
- 把学生信息渲染到页面,点击学生进入学生详情页面,前端设置两个input选择框,每次上完课老师选择消耗课时和消耗金额,自动计算出当前剩余课时和当前剩余金额。然后把 当前剩余课时、当前剩余金额 当作参数传入到后端,去更新余额表。(
与此同时,后台学生列表页 就实现了动态的余额信息
)
- 把拿到的消耗课时、消耗金额、当前剩余课时、当前剩余金额、学生姓名、家长姓名 当作参数传入到后端,插入到数据库,消耗明细表就可以多一条数据。(
这时候后台就可以渲染出来消耗明细,加一个导出功能就可以实现表格导出
)