今天完成的事：
前台、个人中心
实现方案：
个人中心：
1、页面布局用flex
2、把登陆时获取到用户名称和头像渲染在头部。
3、两个模块已购课程和收藏，点击相应功能模块、路由跳转到相应页面
禅道：
一、个人中心
1、写页面HTML代码——2小时
2、写页面——2小时
3、写ajax请求——2小时
4、写路由跳转——2小时
收藏：
1、跳转到收藏页面后、 axios请求到收藏的课程数据，for循环把所有课程数据循环渲染展示出来。
2、点击课程路由跳转到详情页并把课程唯一id，传给课程详情页面
3、通过touchstart（手指按下）获取用户第一次点击的y轴坐标点并记录，通过touchmove （手指移动）判断向上滑动还是向下
4、判断列表的滚动条是否在最底部 、当列表滚动条在最底部时并且touchend（手指离开）启动reload()方法刷新。
禅道：
1、写页面HTML代码——2小时
2、写页面css代码——2小时
3、写ajax请求——2小时
4、写for循环渲染返回数据——2小时
5、写点击router跳转事件——2小时
6、写下拉刷新——2小时
已购：
1、跳转到已购页面后、 axios请求到已购的课程数据，for循环把所有课程数据循环渲染展示出来。
2、点击课程路由跳转到详情页并把课程唯一id，传给课程详情页面
3、通过touchstart（手指按下）获取用户第一次点击的y轴坐标点并记录，通过touchmove （手指移动）判断向上滑动还是向下
4、判断列表的滚动条是否在最底部 、当列表滚动条在最底部时并且touchend（手指离开）启动reload()方法刷新。
禅道：
1、写页面HTML代码——2小时
2、写页面css代码——2小时
3、写ajax请求——2小时
4、写for循环渲染返回数据——2小时
5、写点击router跳转事件——2小时
6、写下拉刷新——2小时
后台-登录
实现方案：
1、两个输入框用element ui的input组件，设置prefix-icon属性给输入框前插入图标。
2、密码框添加一个 show-password属性即可得到一个可切换显示隐藏的密码框。
3、 输入框使用v-model双向绑定数据，进行一个简单的表单验证。
4、验证成功后点击登录post请求发送数据给后端，返回成功则跳转到后台首页。
禅道：
1、写页面HTML代码——2小时
2、写css代码——2小时
3、写input组件、表单验证——2小时
4、写v-model绑定数据——2小时
5、写ajax请求跳转——2小时
后台-欢迎页
实现方案：
1、登陆后从服务器返回用户权限数据，把用户有权限的模块渲染在左侧导航栏和头部用户名信息。
2、退出按钮设一个点击事件，点击发送退出请求。
3、导航栏使用element-ui导航栏组件制作，路由路径根据后端传来的权限使用过滤器写入路由路径。
4、点击相应导航栏按钮把子路由页面渲染在右侧
禅道：
1、写页面HTML代码——2小时
2、写页面css代码——2小时
3、写导航栏NavMenu 组件——2小时
4、写this.$router.push方法退出按钮——2小时
5、写router导航栏路由——2小时
后台、轮播列表
实现方案：
1、侧边导航栏点击轮播管理，路由跳转到轮播管理页，发送ajax请求，返回数据v-for渲染列表到页面
2、 上下架按钮点击、发送ajax上下架请求改变状态
3、删除按钮点击、发送ajax删除请求、删除。
3、新增按钮点击，跳转到轮播图新增页面
4、编辑按钮点击，携带id跳转到编辑页面
禅道：
1、写页面html代码——2小时
2、写页面CSS代码——2小时
3、写for循环列表——2小时
4、写ajax请求实现上下架——2小时
编辑、新增：
1、路由跳转到当前页面、判断是否携带id数据，改变头部编辑新增标题、渲染数据到输入框
2、给输入框设置表单验证，输入框无值头部显示小红点，v-if控制保存按钮为灰不可点击
3、图片片利用input标签type= ‘file’属性上传，用accept属性限制上传格式，用change事件查看返回的FileList对象判断大小，超过这提示并把文件清空(设置input的值为’’空值)，用fileReader.readAsDataURL(file)方法 获取file对象、再 将file对象转base64放到img标签的src属性实现本地预览
4、表单判断成功点击保存按钮，发送上传请求、上传数据、路由跳转回轮播管理页面。
禅道：
1、写页面html代码——2小时
2、写页面CSS代码——2小时
3、写change事件方法——2小时
4、写fileReader.readAsDataURL（）方法——2小时
5、写ajax请求——2小时
后台、后台账号管理
实现方案：
1、点击侧边后台管理下的后台账号管理按钮，路由到后台账号管理页面、发送ajax请求，返回数据v-for渲染列表到页面
2、头部用element-ui组件实现5个搜索条件输入框和下拉菜单、日期组件
3、点击搜索按钮、发送搜索框相应字段请求数据渲染到列表
4、点击重置按钮、清空输入框搜索条件刷新页面
5、点击新增路由到新增、编辑页面
6、点击编辑携带id路由到新增、编辑页面
7、点击删除，发送删除请求
8、底部根据请求返回的数据显示相应分页按钮、v-if判断超出5个按钮隐藏、点击相应页数按钮发送请求获取返回数据渲染到列
禅道：
1、写页面HTML代码——2小时
2、写页面css代码——2小时
3、写v-for循环列表——2小时
4、写date（）方法获取时间戳——2小时
5、写ajax请求数据——2小时
6、写location.reload()方法——2小时
新增、编辑:
1、路由跳转到当前页面、判断是否携带id数据，改变头部编辑新增标题、渲染数据到输入框
2、输入框用element-ui实现，v-model双向绑定数据、v-if设置表单验证
3、验证成功点击保存按钮发送请求，上传数据到服务器。
禅道：
1、写页面HTML代码——2小时
2、写页面css代码——2小时
3、写v-if表单验证——2小时
4、写ajax请求——2小时
后台、修改密码
实现方案：
1、点击侧边后台管理下的修改密码按钮，路由到修改密码页面
2、输入框用element-ui组件实现，v-model双向绑定数据
3、输入框设置表单验证v-if判断输入框数据、数据比对
4、比对不成功v-if控制修改按钮为灰不能点击，比对成功点击按钮发送修改密码请求
禅道：
1、写页面HTML代码——2小时
2、写页面css代码——2小时
3、写v-if表单验证——2小时
4、写ajax请求——2小时
明天计划的事：
写轮播模块代码，开始项目
遇到的问题：
暂无
收获：
和后端确定好接口返回数据，理清各模块思路要点，通过了方案评审
返回列表
评论