前言
一个功能写了大半天，主要是数据表设计的有点复杂，且这个项目是10月份就写的放那的，里面有些东西都忘记了……先看数据库结构，然后理思路，最后实现功能。
效果如下：
其实现在看看，也不是很难。
实现思路
- 项目背景：大致就是给教练用的系统，这个消息功能就是XXX运动员完成了XX方案时，该系统就会实时通知（对了，忘记加定时了，，，发完文章之后就去加…）。
- 方案表有一个方案的完成状态，通过该字段做判断，在前台展示消息。
- 方案表新加了个更改时间字段，为了在前台展示完成该方案的时间。
- 实现思路是将完成了的方案，封装成消息公告对象，最后添加在消息表中，展示在前台。每次去查询方案表中已完成了的方案时，都会执行添加消息的方法，这样就会造成添加重复，不管完成了的方案有没有被添加过，都会重新添加一次，所以又在方案表中新加了个作为区分的字段。
- 在前台实现遍历消息公告表，遍历展示在指定位置。
代码实现
项目中用的是avue，HTML中的代码如下：
<avue-notice @click="handleClick" :data="noticeList" :option="option" @page-change="pageChange"> </avue-notice>
methods中的代码如下：（主要是用来遍历消息）
getNoticeList(){ getNoticeStsteByDeptId().then(res => { const data = res.data.data; for (let i = 0; i < data.length; i++) { let listInfo = { title: '', subtitle: '', tag: '', status: 0, id:0, }; listInfo.subtitle = data[i].createTime; listInfo.tag = "查看"; listInfo.title = data[i].title+"已经完成了"+data[i].content+"训练方案"; listInfo.status = data[i].status; listInfo.id = data[i].id; if(data[i].status===1) { this.weiduNoticeCount += 1; } this.noticeList.push(listInfo); } this.xiaoxiLabel = "消息("+this.weiduNoticeCount+")"; }); },
声明的变量：
data () { return { activeName: 'second', option: { props: { img: 'img', title: 'title', subtitle: 'subtitle', tag: 'tag', status: 'status', id:'id' }, }, //公告信息 noticeList: [], //未读的公告 weiduNoticeCount:0, //消息的文本 xiaoxiLabel:"", } },
单击公告时，将状态修改为已读：
//单击时，修改状态为已完成 handleClick(item){ var id = item.id; //根据编号修改信息 updateNew(id).then(() => { this.$message({ type: "success", message: "已读!" }); done(); this.getNoticeList(); }, error => { window.console.log(error); loading(); }); },
notice.js中的方法如下：
/** * 获取消息（已完成的，根据机构编号） * @param id * @returns {*} */ export const getNoticeStsteByDeptId = () => { return request({ url: '/api/blade-desk/notice/getNoticeStsteByDeptId', method: 'get', }) } /** * 修改状态，原来的那个看不懂…… * @returns {*} * @param id */ export const updateNew = (id) => { return request({ url: '/api/blade-desk/notice/updateNew', method: 'get', params: { id } }) }
最后就是后台控制器中的代码：
/** * 获取已完成的消息 */ @GetMapping("/getNoticeStsteByDeptId") @ApiOperationSupport(order = 1) @ApiOperation(value = "详情", notes = "传入notice") public R<List<Notice>> getNoticeStsteByDeptId() { //获取当前用户所在的部门 Long deptId = Long.parseLong(WebUtil.getCookieVal("dept_id")); //根据部门和状态查询信息 List<Programme> programmeList = programmeService.getPaogramStateBydeptId(2,deptId,0); //遍历方案集合，得到方案的修改时间、方案名称，完成方案的人，添加到公告表中 for(Programme programme : programmeList){ //方案民称 String programName = programme.getPnme(); //时间 Date updatetime = programme.getUpdateTime(); Athletes athletes = new Athletes(); athletes.setId(programme.getPaid()); Athletes detail = athletesService.getOne(Condition.getQueryWrapper(athletes)); String athName = detail.getAname(); //调用添加公告的方法 Notice notice = new Notice(); notice.setContent(programName); notice.setCreateTime(updatetime); notice.setTitle(athName); //公告状态，4已读.1未读， notice.setStatus(1); //添加 noticeService.save(notice); } //查询公告里面的信息 List<Notice> noticeList = noticeService.list(); return R.data(noticeList); } /** * 修改信息 */ @GetMapping("/updateNew") @ApiOperation(value = "修改", notes = "传入notice") public R updateNew(Long id) { Notice notice = noticeService.getById(id); notice.setStatus(4); return R.status(noticeService.updateById(notice)); }
OK，今天记录完毕！
