发表于: 2020-01-14 14:27:09
0 1383
后台-课程管理-视频列表
需求描述:
作为一个平台运营者我需要一个课程列表,以便于添加更多课程
验收标准:
处于下架状态的课程有编辑和删除功能,,点击上架提示,是否上架此课程,点击编辑进入课程编辑,点击删除提示是否删除该课程
上架状态只有下架课程,点击下架提示是否下架此课程
课程列表展示列表数据,筛选数据展示数据列表,重置返回默认的数据列表,增删改查正常使用,新增课程正常填写数据,
必填项不填写,保存按钮置灰不可点击,
视频上传后展示封面,上传成功后再次点击视频模块,变为重新上传
视频上传后展示封面
logo上传好展示封面
标题限制,10位数
详情限制200字必填项
推送年级必填项,选择年级之后,下边推送课程变成相对应年级的科目
实现方案:
1、 进入管理页面获取数据,使用get 请求获取到数据渲染到页面。
需求描述:
作为一个平台运营者我需要一个课程列表,以便于添加更多课程
验收标准:
处于下架状态的课程有编辑和删除功能,,点击上架提示,是否上架此课程,点击编辑进入课程编辑,点击删除提示是否删除该课程
上架状态只有下架课程,点击下架提示是否下架此课程
课程列表展示列表数据,筛选数据展示数据列表,重置返回默认的数据列表,增删改查正常使用,新增课程正常填写数据,
必填项不填写,保存按钮置灰不可点击,
视频上传后展示封面,上传成功后再次点击视频模块,变为重新上传
视频上传后展示封面
logo上传好展示封面
标题限制,10位数
详情限制200字必填项
推送年级必填项,选择年级之后,下边推送课程变成相对应年级的科目
实现方案:
1、 进入管理页面获取数据,使用get 请求获取到数据渲染到页面。
2、可以通过年级,课程名称,类型,创建时间,状态筛选数据,实现搜索功能,使用element uI 框架实现下拉菜单跟日期组件,然后用v-model渲染后台数据。
3,上下架用switch语句控制,用axios发put请求更新数据。
4,进入编辑页面,通过id获取相应的信息,然后更改完成之后,点击保存,发送put请求,更改数据
5,点击新增,进入新增页面,填写相应信息,用event.target获取图片,使用Vue+Element UI中的el-upload组件实现视频上传
,保存这条数据并且返回之前页面
后台-后台管理-后台账号管理
需求描述:
作为一个后台高级管理员,我需要一个后台账户管理以便于管理后台账户
验收标准:
1.用户ID限制只能输入数字
2.两边选择时间前边的时间必须早于后边的时间
3.搜索按照顺序筛选,如果任意选项没有这个歌选择的话,下边用户列表空白显示,没有该条数据
4.点击重置按钮,清除所有筛选
5.ID自动生成,iD自增长
6.名称显示该条用户的账号名
7.角色用户在创建此用户时选择的角色权限
8.显示创建该用户的创建人的账号名称
9.显示最新改动此用户的账号名称,以及刚刚创建的新用户那这里显示创建人的账号名称
10.这里显示过该条数据最新保存更改的时间
11.点击新增用户,进入新增用户页面
12.点击删除按钮,弹窗提示:确认删除此用户
13.点击编辑按钮进入该条用户编辑信息页面
实现方案:
1、点击侧边后台管理下的后台账号管理按钮,路由到后台账号管理页面、发送ajax请求,返回数据v-for渲染列表到页面
2、头部用element-ui组件实现5个搜索条件输入框和下拉菜单、日期组件
3、点击搜索按钮、发送搜索框相应字段请求数据渲染到列表
4、点击重置按钮、清空输入框搜索条件刷新页面
5、点击新增路由到新增、编辑页面
6、点击编辑携带id路由到新增、编辑页面
7、点击删除,发送删除请求
8、底部根据请求返回的数据显示相应分页按钮、v-if判断超出5个按钮隐藏、点击相应页数按钮发送请求获取返回数据渲染到列
新增、编辑:
1、路由跳转到当前页面、判断是否携带id数据,改变头部编辑新增标题、渲染数据到输入框
2、输入框用element-ui实现,v-model双向绑定数据、v-if设置表单验证
3、验证成功点击保存按钮发送请求,上传数据到服务器。
3、验证成功点击保存按钮发送请求,上传数据到服务器。
角色管理
需求描述
作为后台管理员,我想要一个角色管理的功能,以便于对角色进行增删改查权限的操作
作为后台管理员,我想要一个角色管理的功能,以便于对角色进行增删改查权限的操作
验收标准
1.ID自动生成,,ID自增长
2.名称里面显示该角色的登录名称
3.更新时间,最新改动这个角色的账号的名称
4.根据最新编辑过的时间显示
5.点击删除按钮,如果该条角色有绑定的额用户,跳出弹窗提示:请先解绑与角色绑定的用户,前几确认弹窗消失如果没有绑定用户的角色点击删除跳出弹窗提示:是否删除该角色
6.点击新增角色按钮进入新增页面
实现方案
1,刚开始名称和角色权限用逻辑与来实现禁点,当标题和角色权限都选中,保存按钮禁点事件取消可以保存新增角色。:
2.名称里面显示该角色的登录名称
3.更新时间,最新改动这个角色的账号的名称
4.根据最新编辑过的时间显示
5.点击删除按钮,如果该条角色有绑定的额用户,跳出弹窗提示:请先解绑与角色绑定的用户,前几确认弹窗消失如果没有绑定用户的角色点击删除跳出弹窗提示:是否删除该角色
6.点击新增角色按钮进入新增页面
实现方案
1,刚开始名称和角色权限用逻辑与来实现禁点,当标题和角色权限都选中,保存按钮禁点事件取消可以保存新增角色。:
2,新增角色,点击对号赋予角色权限,这个模块的权限由后端返回一个数字给我,然后我用这个数字的集合来代表这个模块的权限,可以赋予这个角色相应的权限, 可以用element中
的Checkbox 多选框来实现多选,不选的话就保存按钮就会显示灰色,设置禁点事件。点击选中模块禁点事件取消,保存用post请求添加角色。
新增角色:
1.角色名限制8位字,
2.必填项必须填写,否则按钮置灰不可点击
3.选择子模块,父模块亮起,但不会选择全部的子模块,只有你选择的那个才会显示已选择,再次点击就可以取消选择,选择父模块的话子模块全部选择,也可以取消不需要的,
4.点击取消,退出角色新增功能跳转到角色管理页
5.必填项选择完之后,按钮亮起可以点击
5、4修改密码
需求描述:
作为一个后台用户,我想要通过后台对密码进行修改,以便于保障账号的安全
验收标准:
旧密码必须是原密码,如果输入错误提示:请输入正确的原密码
新密码输入框输入6~16位的密码,禁止输入符号和汉字如果输入不合理提示,请输入合理的新密码
两次密码必须输入一致,不一致提示:两次密码必须输入一致
上面的不输入完,按钮置灰,输入完按钮可以点击,提示语从上到下提示
实现方案:
1、点击侧边后台管理下的修改密码按钮,路由到修改密码页面
2、输入框用element-ui组件实现,v-model双向绑定数据
3、输入框设置表单验证v-if判断输入框数据、数据比对
4、比对不成功v-if控制修改按钮为灰不能点击,比对成功点击按钮发送修改密码请求
1.角色名限制8位字,
2.必填项必须填写,否则按钮置灰不可点击
3.选择子模块,父模块亮起,但不会选择全部的子模块,只有你选择的那个才会显示已选择,再次点击就可以取消选择,选择父模块的话子模块全部选择,也可以取消不需要的,
4.点击取消,退出角色新增功能跳转到角色管理页
5.必填项选择完之后,按钮亮起可以点击
5、4修改密码
需求描述:
作为一个后台用户,我想要通过后台对密码进行修改,以便于保障账号的安全
验收标准:
旧密码必须是原密码,如果输入错误提示:请输入正确的原密码
新密码输入框输入6~16位的密码,禁止输入符号和汉字如果输入不合理提示,请输入合理的新密码
两次密码必须输入一致,不一致提示:两次密码必须输入一致
上面的不输入完,按钮置灰,输入完按钮可以点击,提示语从上到下提示
实现方案:
1、点击侧边后台管理下的修改密码按钮,路由到修改密码页面
2、输入框用element-ui组件实现,v-model双向绑定数据
3、输入框设置表单验证v-if判断输入框数据、数据比对
4、比对不成功v-if控制修改按钮为灰不能点击,比对成功点击按钮发送修改密码请求
评论