hn_cloud_web/czl-web/pages/user/systemNotifications.html

223 lines
9.2 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>系统通知</title>
<link rel="stylesheet" href="../../layui-v2.8.18/layui/css/layui.css" media="all"/>
</head>
<body>
<form class="layui-form" action="" onsubmit="return false" style="margin-top: 3%;margin-left: 2%;">
<div class="layui-form-item" style="margin-bottom: 0;">
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
<button id="allBt" class="layui-btn layui-btn-sm layui-btn-normal" onclick="toggleButton('allBt')">全部消息</button>
</div>
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
<button id="announcementBt" class="layui-btn layui-btn-sm" onclick="toggleButton('announcementBt')">系统公告</button>
</div>
<div class="layui-input-inline" style="width: 70px;margin-top: 2px">
<button id="notificationBt" class="layui-btn layui-btn-sm" onclick="toggleButton('notificationBt')">系统通知</button>
</div>
<div>
<span id="readAlready" style="color: rgb(153, 153, 153);margin-left: 65%;">全部标记为已读</span>
</div>
</div>
</form>
<table id="demo" lay-filter="test"></table>
</body>
</html>
<script src="../../js/jquery/jquery-3.6.0.js"></script>
<script src="../../layui-v2.8.18/layui/layui.js"></script>
<script type="text/javascript" src="../../js/jq.js"></script>
<script src="../../js/common_methon.js"></script>
<script type="text/javascript" src="../../../public/public.js"></script>
<script type="text/javascript" src="../../js/publicJs.js"></script>
<script type="text/javascript" src="../../js/select.js"></script>
<script type="text/javascript" src="../../js/my/permission.js"></script>
<script type="text/javascript">
layui.config({
base: '../../js/layuiModules/', // 第三方模块所在目录
version: 'v1.6.4' // 插件版本号
}).extend({
soulTable: 'notice,layNotify', // 模块
});
let form;
var tree;
var table;
var notice;
var layNotify;
var type;
let userId = sessionStorage.getItem("userId");
console.log('userId:', userId);
$("#allBt").click(function(){
table.reload('menuTable', {
url: czl_ht_url + '/users/getSystemNotification'
, method: 'post' //方式默认是get
, page: true
, where: {
type:'',
} //设定异步数据接口的额外参数
});
})
$("#announcementBt").click(function(){
table.reload('menuTable', {
url: czl_ht_url + '/users/getSystemNotification'
, method: 'post' //方式默认是get
, page: true
, where: {
type:'2',
} //设定异步数据接口的额外参数
});
})
$("#notificationBt").click(function(){
table.reload('menuTable', {
url: czl_ht_url + '/users/getSystemNotification'
, method: 'post' //方式默认是get
, page: true
, where: {
type:'3',
} //设定异步数据接口的额外参数
});
})
$("#readAlready").click(function(){
var index = layer.confirm('全部标记为已读?', {
btn : [ '确定', '取消' ]
}, function() {
$.ajax({
type: 'POST',
async: false,
url: czl_ht_url + '/users/delReadAlready',// 请求地址
contentType: "application/x-www-form-urlencoded",
dataType: 'json', // 服务器返回数据类型
success: function (data) {
var resMsg = data.resMsg;
layer.close(index);
if ("数据获取成功" === resMsg) {
layer.msg('状态修改成功', {icon: 1, time: 2000}, function() {
location.reload();
});
}else {
layer.msg('状态修改失败',{icon:2,timeout:2000});
}
}
});
});
})
layui.use(['table', 'form','notice', 'layNotify'], function () {
table = layui.table;
form = layui.form;
tree = layui.tree;
notice = layui.notice;
layNotify = layui.layNotify;
//渲染表格
table.render({
elem: '#demo'
, url: czl_ht_url + '/users/getSystemNotification' //数据接口
, method: 'post' //方式默认是get
, toolbar: 'default' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
, where: {} //post请求必须加where post请求需要的参数
, cellMinWidth: 80
, cols: [[ //表头
// {
// field: 'number', width:80,title: '序号', align: 'center', type: 'numbers'
// }
{field: 'noticeName', align: 'center', title: '通知标题', event: 'noticeDetail', templet: d => {
let text = '';
if (d.isRead === "0")
{
text = "<span class='layui-badge-dot'></span>" + d.noticeName;
}else {
text = d.noticeName;
}
return text;
}}
, {
field: 'isRead', title: '状态', align: 'center', templet: d => {
let text = "";
if (d.isRead === "0") {
text = "<span class='layui-badge-dot'></span>未读";
} else if (d.isRead === "1") {
text = "<span class='layui-badge-dot layui-bg-green'></span>已读";
}
return text;
}
}
, {field: 'noticeType', align: 'center', title: '类型'}
, {field: 'createTimed', align: 'center', title: '发布时间'}
]]
, id: 'menuTable'
, page: true //开启分页
, loading: true //数据加载中。。。
, limits: [5, 10, 20] //一页选择显示3,5或10条数据
, limit: 10 //一页显示5条数据
, response: {
statusCode: 200 //规定成功的状态码默认0
}, parseData: function (res) { //将原始数据解析成 table 组件所规定的数据res为从url中get到的数据
let result;
if (res.data !== '' && res.data != null && res.data !== "null") {
if (this.page.curr) {
result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
} else {
result = res.data.slice(0, this.limit);
}
}
return {
"code": res.code, //解析接口状态
"msg": res.msg, //解析提示文本
"count": res.count, //解析数据长度
"data": result, //解析数据列表
};
}
,toolbar: "#toolbar"
, done: function(res, curr, count) {
for (var i = 0; i < res.data.length; i++) {
console.log('res.data[i]:', res.data[i])
var data = res.data[i];
data.planTime = data.startTime + ' ~ ' + data.endTime;
console.log('planTime:', data.planTime); // 打印 planTime 的值
}
}
});
table.on('tool(test)', function(obj){
var data = obj.data;
console.log('data:', data)
if(obj.event === 'noticeDetail'){
$.ajax({
type : 'post',
url : czl_ht_url + '/users/upLoginLog',
async : false,
data: {
id: data.id,
},
success : function(data) {
localStorage.setItem("announcementId", obj.data.noticeId);
console.log('announcementId:', obj.data.noticeId)
var index = layer.open({
title: ['公告详情', 'color:#3B70A1;background-color:#E8ECEB;font-size:20px'],
type: 2,
content: '../announcement/AnnouncementView.html',
area: ["90%", "95%"],
maxmin: false,
btn: ['关闭'],
});
}
});
}
});
});
function toggleButton(buttonId) {
var buttons = document.getElementsByTagName("button");
for (var i = 0; i < buttons.length; i++) {
var button = buttons[i];
if (button.id === buttonId) {
button.classList.add("layui-btn-normal");
} else {
button.classList.remove("layui-btn-normal");
}
}
}
</script>