hn_cloud_web/smz-web/pages/role/roleList.html

288 lines
11 KiB
HTML
Raw 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>
<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">
<!--<link rel="stylesheet" type="text/css" media="screen" href="../../css/work/basic/basic.css">-->
<style type="text/css">
/* dataTables列内容居中 */
.table>tbody>tr>td{
text-align:center;
vertical-align: middle;
}
/* dataTables表头居中 */
.table>thead:first-child>tr:first-child>th{
text-align:center;
vertical-align: middle;
}
</style>
</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">
<div class="layui-inline">
<input id="keyWord" type="text" class="layui-input" placeholder="请输入关键字">
</div>
<button id="searchBt" class="layui-btn layui-btn-sm" permission="sys:role:query">搜索</button>
</div>
</form>
<div class="layui-inline" style="margin-top: 5px;">
<button class="layui-btn layui-btn-sm" onclick="addRole()" permission="sys:role:add">
添加
</button>
</div>
</td>
</tr>
</table>
</div>
</header>
<div>
<div class="widget-body no-padding">
<div id="dt-table-length"></div>
<table id="dt-table" class="table table-striped table-bordered table-hover" style="width:100%">
<thead style="background-color: #FAFAFA !important;">
<tr>
<th style="width: 15%">公司名称</th>
<th style="width: 15%">角色名称</th>
<th style="width: 10%">角色描述</th>
<th style="width: 10%">权限类型</th>
<th style="width: 10%">角色级别</th>
<th style="width: 15%">注册启用<br/>(用户注册只可以选择启用的角色)</th>
<th style="width: 10%">修改时间</th>
<th style="width: 10%">操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript" src="../../js/libs/jquery-3.7.1.min.js"></script>
<script type="text/javascript" src="../../js/jq.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="../../layui/layui.js"></script>
<script type="text/javascript" src="../../js/my/permission.js"></script>
<script type="text/javascript" src="../../../public/public.js"></script>
<script type="text/javascript" src="../../js/publicJs.js"></script>
<script type="text/javascript">
var pers = checkPermission();
var example;
function init(){
example =
$('#dt-table').DataTable({
"searching": false,
"processing": false,
"serverSide" : true,
"language": {
"url": contentPath + "/smz-web/js/plugin/datatables/Chinese.lang"
},
"ajax": {
"url" : smz_ht_url + "/roles",
"type":"get",
"data":function(d){
d.keyWord = $('#keyWord').val();
},
"error":function(xhr, textStatus, errorThrown){
var msg = xhr.responseText;
console.log(msg);
var response = JSON.parse(msg);
var code = response.code;
var message = response.message;
if (code == 400) {
layer.msg(message);
} else if (code == 401) {
localStorage.removeItem("public_token");
localStorage.removeItem("smz_token");
layer.msg("token过期请先登录", {shift: -1, time: 1000}, function () {
top.location.href= contentPath + '/login.html';
});
} else if (code == 403) {
console.log("未授权:" + message);
layer.msg('未授权');
} else if (code == 500) {
layer.msg('系统错误:' + message);
}
}
},
"lengthMenu": [ [10, 20, 50], [10, 20, 50] ], // 设置每页显示数据量选项
"drawCallback": function() {
// alert( '表格重绘了' );
var thisDataTable = $('#dt-table').DataTable();
$(".pagination").append("<li>" +
"<a class='paginate_button' style='padding:4px;' href='#' tabindex='0'>到 <input style='margin:0px;width:40px;' id='changePage'> 页</a>" +
"<a class='paginate_button' style='margin-bottom:1px' href='#' tabindex='0' id='dataTable-btn'>确认</a></li>");
//点击按钮跳转指定页数
$('#dataTable-btn').click(function (e) {
if ($("#changePage").val() && $("#changePage").val() > 0) {
var redirectpage = $("#changePage").val() - 1;
} else {
var redirectpage = 0;
}
thisDataTable.page(redirectpage).draw( 'page' );
});
//敲击回车键跳转指定页数
$("#changePage").keypress(function (e) {
if(event.keyCode==13){
if ($("#changePage").val() && $("#changePage").val() > 0) {
var redirectpage = $("#changePage").val() - 1;
} else {
var redirectpage = 0;
}
thisDataTable.page(redirectpage).draw( 'page' );
}
});
},
"createdRow": function (row, data, dataIndex) {
var measures = data.registerCapital;
if (measures != null) {
if (measures.length > remarkShowLength) {//只有超长才有td点击事件
$(row).children('td').eq(3).attr('onclick', 'javascript:changeShowRemarks(this);');
$(row).children('td').eq(3).css('cursor', 'pointer');
}
$(row).children('td').eq(3).attr('content', data.registerCapital);
}
},
"dom": "<'dt-toolbar'r>t<'dt-toolbar-footer'<'col-sm-4 col-xs-4 hidden-xs'i><'col-xs-8 col-sm-8' p v>><'dt-table-length'l>",
"columns": [
{ "data": "companyName", "orderable": false, "defaultContent": ""},
{ "data": "name", "orderable": false, "defaultContent": "" },
{ "data": "description", "orderable": false, "defaultContent": ""},
{ "data": "type", "orderable": false, "defaultContent": ""},
{ "data": "","orderable": false, "defaultContent": "","render":function (data, type, row) {
var roleLevel = row['roleLevel'];
var html = '';
if (roleLevel == '1') {
html += '公司级';
} else if (roleLevel == '2') {
html += '分公司';
} else if (roleLevel == '3') {
html += '项目部级';
}else if (roleLevel == '4') {
html += '分包商级';
}else if (roleLevel == '5') {
html += '施工人员级';
}else if (roleLevel == '6') {
html += '总部';
}else{
html += '';
}
return html;
}
},
{ "data": "status", "orderable": false, "defaultContent": ""},
{ "data": "updateTime", "defaultContent": ""},
{
"data": "",
"defaultContent": "",
"orderable":false,
"render": function (data, type, row) {
var id = row['id'];
// var href = smz_ht_url + "/pages/role/addRole.html?id=" + id;
var edit = buttonEdit(id, "sys:role:add", pers);
var del = buttonDel(id, "sys:role:del", pers);
return edit + del;
}
},
],
"order": [[ 6, "desc" ]]
} );
}
layui.use('layer', function(){
var layer = layui.layer;
});
function buttonDel(data, permission, pers){
if(permission != ""){
if ($.inArray(permission, pers) < 0) {
return "";
}
}
var btn = $("<button class='layui-btn layui-btn-xs' title='删除' onclick='del(\"" + data +"\")' style='background-color: transparent;color: #ff4d4f;'>删除</button>");
return btn.prop("outerHTML");
}
function buttonEdit(id, permission, pers){
if(permission != ""){
if ($.inArray(permission, pers) < 0) {
return "";
}
}
var btn = $("<button class='layui-btn layui-btn-xs' title='编辑' onclick='edit(\"" +id+ "\")' style='background-color: transparent;color: #009688;'>编辑</button>");
return btn.prop("outerHTML");
}
function del(id){
layer.confirm('确定要删除吗?', {
btn : [ '确定', '取消' ]
}, function() {
$.ajax({
type : 'delete',
url : smz_ht_url + '/roles/'+id,
success : function(data) {
example.ajax.reload();
layer.msg("删除成功");
}
});
layer.close(1);
});
}
$("#searchBt").click(function(){
example.ajax.reload();
});
function edit(id){
localStorage.setItem("roleId", id)
var height = '97.5%';
var width = '97.5%';
var index = layer.open({
title: ['编辑', 'color:#3B70A1;background-color:#E8ECEB;font-size:20px'],
type: 2,
content: 'addRole.html',
area: [width, height],
maxmin: false,
});
}
function addRole(){
localStorage.setItem("roleId", "")
var height = '97.5%';
var width = '97.5%';
var index = layer.open({
title: ['新增', 'color:#3B70A1;background-color:#E8ECEB;font-size:20px'],
type: 2,
content: 'addRole.html',
area: [width, height],
maxmin: false,
});
}
init();
</script>