boot-security/src/main/resources/static/pages/notice/noticeList.html

179 lines
6.5 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" media="screen" href="../../css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" media="screen" href="../../css/dataTables.bootstrap.min.css">
<link rel="stylesheet" type="text/css" media="screen" href="../../layui/css/layui.css">
</head>
<body>
<div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<header style="height: 100%">
<div align="left">
<table style="width: 100%">
<tr>
<td>
<form class="form-inline" onsubmit="return false">
<div class="form-group">
title
<input id="title" type="text" class="form-control" placeholder="title">
时间:
<input type="text" class="form-control" placeholder="开始时间" id="beginTime">
<input type="text" class="form-control" placeholder="结束时间" id="endTime">
状态:
<select class="form-control input-sm" id="status">
<option value="">全部</option>
<option value="0">草稿</option>
<option value="1">发布</option>
</select>
<button id="searchBt" class="layui-btn layui-btn-sm" permission="notice:query"><i class="layui-icon">&#xe615;</i>搜索</button>
</div>
</form>
</td>
<td align="right">
<button class="layui-btn layui-btn-sm" onclick="location.href='addNotice.html'" permission="notice:add">
<i class="layui-icon">&#xe608;</i> 添加
</button>
</td>
</tr>
</table>
</div>
</header>
<div>
<div class="widget-body no-padding">
<table id="dt-table" class="table table-striped table-bordered table-hover" style="width:100%">
<thead>
<tr>
</tr>
<tr>
<th style="width: 10%">id</th>
<th>title</th>
<th style="width: 20%">修改时间</th>
<th style="width: 10%">状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript" src="../../js/libs/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="../../js/jq.js"></script>
<script type="text/javascript" src="../../layui/layui.js"></script>
<script type="text/javascript" src="../../js/plugin/datatables/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="../../js/plugin/datatables/dataTables.bootstrap.min.js"></script>
<script type="text/javascript" src="../../js/my/permission.js"></script>
<script type="text/javascript" src="../../js/dict.js"></script>
<script type="text/javascript">
var pers = checkPermission();
layui.use(['layer','laydate'], function(){
var layer = layui.layer;
var laydate = layui.laydate;
laydate.render({
elem: '#beginTime'
});
laydate.render({
elem: '#endTime'
});
});
var noticeStatus = showDictSelect("status", "noticeStatus", true);
var example;
function init(){
example =
$('#dt-table').DataTable({
"searching": false,
"processing": false,
"serverSide" : true,
"language": {
"url": "/js/plugin/datatables/Chinese.lang"
},
"ajax": {
"url" : "/notices",
"type":"get",
"data":function(d){
d.title = $('#title').val();
d.status = $('#status').val();
d.beginTime = $('#beginTime').val();
d.endTime = $('#endTime').val();
},
"error":function(xhr, textStatus, errorThrown){
var msg = xhr.responseText;
console.log(msg)
}
},
"dom": "<'dt-toolbar'r>t<'dt-toolbar-footer'<'col-sm-10 col-xs-12 hidden-xs'i><'col-xs-12 col-sm-10' p v>>",
"columns": [
{ "data": "id", "defaultContent": ""},
{ "data": "title", "defaultContent": ""},
{ "data": "updateTime", "defaultContent": ""},
{
"data": "status",
"defaultContent": "",
"render": function (data, type, row) {
return noticeStatus[data];
}
},
{
"data": "",
"defaultContent": "",
"render": function (data, type, row) {
var id = row['id'];
var status = row['status'];
var href = "updateNotice.html?id=" + id;
var edit = buttonEdit(href, "notice:add", pers);
if(status == 1){
edit = "<button class='layui-btn layui-btn-xs' style='background-color:#c2c2c2;' title='不可编辑'><i class='layui-icon' style='color: #F0F0F0;'>&#xe642;</i></button>";
}
var del = buttonDel(id, "notice:del", pers);
return edit + del + "<button class='layui-btn layui-btn-xs' title='详情' onclick='showDetail(\"" + id +"\")'><i class='layui-icon'>&#xe65f;</i></button>";
}
},
],
"order": [[ 2, "desc" ],[1, "desc"]]
} );
}
function showDetail(id){
layer.open({
type: 2,
title: false,
area: ['800px', '400px'],
shadeClose: true,
content: ['detail.html?id='+id]
});
}
function del(id){
layer.confirm('确定要删除吗?', {
btn : [ '确定', '取消' ]
}, function() {
$.ajax({
type : 'delete',
url : '/notices/'+id,
success : function(data) {
example.ajax.reload();
layer.msg("删除成功");
}
});
layer.close(1);
});
}
$("#searchBt").click(function(){
example.ajax.reload();
});
init();
</script>