“大家好,我是雄雄,欢迎关注微信公众号:雄雄的小课堂。
”
前言
一个功能写了大半天,主要是数据表设计的有点复杂,且这个项目是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,今天记录完毕!