445 lines
20 KiB
HTML
445 lines
20 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<base href="/servicecity/">
|
||
<meta charset="UTF-8"/>
|
||
<meta http-equiv="X-UA-Compatible" content="IE=11,chrome=1"/>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||
|
||
<link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
|
||
<link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
|
||
<link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
|
||
<style>
|
||
.un-pass-class .layui-layer-btn .layui-layer-btn0{
|
||
background-color: #FF5722;
|
||
color: #ffffff;
|
||
border: 1px solid #dedede;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="layui-fluid layui-anim layui-anim-fadein">
|
||
<div class="layui-row">
|
||
<div class="layui-col-md12">
|
||
<div class="layui-card">
|
||
<div class="layui-card-body">
|
||
<div class="test-table-reload-btn layui-form" style="margin-bottom: 5px;">
|
||
<div class="layui-inline">
|
||
<input type="text" id="keywords" class="layui-input search-item" placeholder="请假人姓名|手机号" style="height: 38px;width: 150px;" autocomplete="off">
|
||
</div>
|
||
<div class="layui-inline" style="width: 150px;">
|
||
<select id="approver2State" name="approver2State">
|
||
<option value="">审批状态</option>
|
||
<option value="0">待审批</option>
|
||
<option value="1">同意</option>
|
||
<option value="2">不同意</option>
|
||
</select>
|
||
</div>
|
||
<div class="layui-inline">
|
||
<input type="text" id="startTime" class="layui-input search-item"
|
||
readonly="readonly" placeholder="开始时间" style="height: 38px;width: 120px;cursor: pointer" autocomplete="off">
|
||
</div>
|
||
<div class="layui-inline">
|
||
<input type="text" id="endTime" class="layui-input search-item"
|
||
readonly="readonly" placeholder="截止时间" style="height: 38px;width: 120px;cursor: pointer" autocomplete="off">
|
||
</div>
|
||
<button type="button" id="search" class="layui-btn layui-btn-sm">
|
||
<i class="fa fa-lg fa-search"></i> 搜索
|
||
</button>
|
||
</div>
|
||
<table class="layui-hide" id="dataTable" lay-filter="dataTable"></table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script id="pass-div-box" type="text/html">
|
||
<div class="layui-fluid layui-anim layui-anim-fadein">
|
||
<div class="layui-row">
|
||
<div class="layui-col-md12 layui-col-sm12">
|
||
<div class="layui-form">
|
||
<div class="">
|
||
<textarea id="leaveRefuseSummary" name="leaveRefuseSummary" autocomplete="off" maxlength="255"
|
||
placeholder="请填写审批意见" class="layui-textarea"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</script>
|
||
<script src="assets/layuiadmin/layui/layui.js"></script>
|
||
<script type="text/javascript">
|
||
layui.config({
|
||
base: 'assets/layuiadmin/'
|
||
}).extend({
|
||
index: 'lib/index'
|
||
}).use(['index', 'table', 'laytpl', 'form','laydate'], function() {
|
||
var $ = layui.$;
|
||
var $win = $(window);
|
||
var laytpl = layui.laytpl;
|
||
var table = layui.table;
|
||
var admin = layui.admin;
|
||
var form = layui.form;
|
||
var laydate = layui.laydate;
|
||
var tableUrl = 'api/leave/list-page-leave-detail2';
|
||
var dataLoading = false;
|
||
|
||
function init() {
|
||
laydate.render({
|
||
elem: '#startTime'
|
||
});
|
||
laydate.render({
|
||
elem: '#endTime'
|
||
});
|
||
initTable();
|
||
}
|
||
init();
|
||
|
||
function initTable() {
|
||
dataLoading = true;
|
||
table.render({
|
||
elem: '#dataTable',
|
||
id: 'dataTable',
|
||
url: top.restAjax.path(tableUrl, []),
|
||
width: admin.screen() > 1 ? '100%' : '',
|
||
height: $win.height() - 100,
|
||
limit: 20,
|
||
limits: [20, 40, 60, 80, 100, 200],
|
||
request: {
|
||
pageName: 'page',
|
||
limitName: 'rows'
|
||
},
|
||
cols: [[
|
||
{field:'rowNum', width:60, title: '序号', fixed: 'left', align:'center', templet: '<span>{{d.LAY_INDEX}}</span>'},
|
||
{field: 'userAvatar', width: 60, title: '头像', align:'center',fixed: 'left',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '<img style="width: 30px;height: 30px;" src="assets/images/profile-photo.jpg"/>';
|
||
} else {
|
||
return '<img style="width: 30px;height: 30px;" src="route/file/downloadfile/false/'+ rowData +'"/>';
|
||
}
|
||
}
|
||
},
|
||
{field: 'leaveUserName', width: 200, title: '请假人', align:'center',fixed: 'left',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData + '【' + row['userPhone'] + '】';
|
||
}
|
||
},
|
||
{field: 'isSelf', width: 100, title: '公私假', align:'center',fixed: 'left',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(rowData === 0) {
|
||
return '公假';
|
||
}
|
||
if(rowData === 1) {
|
||
return '私假';
|
||
}
|
||
return '错误'
|
||
}
|
||
},
|
||
{field: 'leaveTypeName', width: 100, title: '请假缘由', align:'center',fixed: 'left',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'leaveTime', width: 180, title: '请假时间', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'leaveTimeEnd', width: 180, title: '结束时间', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'leaveTimeLong', width: 100, title: '请假时长', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData + '天';
|
||
}
|
||
},
|
||
{field: 'leaveSummary', width: 200, title: '详细请假原因', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return '<span style="color: #1E9FFF">' + rowData + '</span>';
|
||
}
|
||
},
|
||
{field: 'leaveImg', width: 100, title: '请假条', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return '<button type="button" class="layui-btn layui-btn-xs layui-btn-normal" lay-event="leaveImgEvent">查看</button>';
|
||
}
|
||
},
|
||
{field: 'leaveState', width: 100, title: '当前状态', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(rowData == '0'){
|
||
return '<span style="color: #aa7700">待审批</span>'
|
||
}
|
||
if(rowData == '1'){
|
||
return '<span style="color: #00a0e9">同意</span>'
|
||
}
|
||
if(rowData == '2'){
|
||
return '<span style="color: red">不同意</span>'
|
||
}
|
||
return '-';
|
||
}
|
||
},
|
||
{field: 'leaveRefuseSummary', width: 120, title: '审批意见', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'approverName', width: 100, title: '1级审批人', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'approverState', width: 120, title: '1级审批状态', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(rowData == '0'){
|
||
return '<span style="color: #aa7700">待审批</span>'
|
||
}
|
||
if(rowData == '1') {
|
||
return '<span style="color: #00a0e9">同意</span>'
|
||
}
|
||
if(rowData == '2') {
|
||
return '<span style="color: red">不同意</span>'
|
||
}
|
||
return '-';
|
||
}
|
||
},
|
||
{field: 'approverRefuseSummary', width: 120, title: '1级审批意见', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'approver2State', width: 120, title: '2级审批状态', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(rowData == '0'){
|
||
return '<span style="color: #aa7700">待审批</span>'
|
||
}
|
||
if(rowData == '1') {
|
||
return '<span style="color: #00a0e9">同意</span>'
|
||
}
|
||
if(rowData == '2') {
|
||
return '<span style="color: red">不同意</span>'
|
||
}
|
||
return '-';
|
||
}
|
||
},
|
||
{field: 'approver2RefuseSummary', width: 120, title: '2级审批意见', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{field: 'approver2Name', width: 120, title: '2级审批人', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return rowData;
|
||
}
|
||
},
|
||
{width: 140, title: '操作按钮', align:'center', fixed: 'right',
|
||
templet: function(row) {
|
||
if(row.approver2State === 1 || row.approver2State === 2) {
|
||
return '-';
|
||
}
|
||
var dom = '';
|
||
dom += '<div class="layui-btn-group">';
|
||
dom += '<button type="button" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="passEvent">' +
|
||
'<i class="fa fa-legal"></i>同意</button>';
|
||
dom += '<button type="button" class="layui-btn layui-btn-danger layui-btn-xs" lay-event="unPassEvent">' +
|
||
'<i class="fa fa-exclamation-triangle"></i>不同意</button>';
|
||
dom += '</div>';
|
||
return dom;
|
||
}
|
||
},
|
||
|
||
]],
|
||
page: true,
|
||
parseData: function(data) {
|
||
return {
|
||
'code': 0,
|
||
'msg': '',
|
||
'count': data.total,
|
||
'data': data.rows
|
||
};
|
||
},
|
||
done: function(){
|
||
dataLoading = false;
|
||
}
|
||
});
|
||
}
|
||
|
||
// 重载表格
|
||
function reloadTable(currentPage) {
|
||
dataLoading = true;
|
||
table.reload('dataTable', {
|
||
url: top.restAjax.path(tableUrl, []),
|
||
where :{
|
||
keywords : $('#keywords').val(),
|
||
approver2State : $('#approver2State').val(),
|
||
startTime : $('#startTime').val(),
|
||
endTime : $('#endTime').val()
|
||
},
|
||
page: {
|
||
curr: currentPage
|
||
},
|
||
height: $win.height() - 100,
|
||
done:function(){
|
||
dataLoading = false;
|
||
}
|
||
});
|
||
}
|
||
|
||
table.on('tool(dataTable)', function(obj) {
|
||
if (obj.event === 'passEvent') {
|
||
var passPopIndex = layer.open({
|
||
type: 1,
|
||
title: '<span style="color: #cc0000">*</span>请假审批(同意)',
|
||
closeBtn: 1,
|
||
offset: '150px',
|
||
area: ['40%', '30%'],
|
||
shadeClose: false,
|
||
anim: 2,
|
||
content: $('#pass-div-box').html(),
|
||
btn: ['确定', '取消'],
|
||
btnAlign : 'c',
|
||
yes : function(){
|
||
var loadIndex = layer.load(1);
|
||
top.restAjax.put(top.restAjax.path('api/leave/updateleaveofapproval2/{arg}', [obj.data.leaveId]),
|
||
{approver2RefuseSummary : $('#leaveRefuseSummary').val(), approver2State : '1'}, null, function(code, data) {
|
||
layer.close(passPopIndex);
|
||
layer.close(loadIndex);
|
||
top.dialog.msg('审批完成');
|
||
reloadTable();
|
||
}, function(){
|
||
layer.close(loadIndex);
|
||
top.dialog.msg(data.msg);
|
||
});
|
||
},
|
||
btn2 : function(){
|
||
layer.close(passPopIndex);
|
||
},
|
||
success : function(){
|
||
$('#leaveRefuseSummary').val('同意');
|
||
}
|
||
});
|
||
}
|
||
if (obj.event === 'unPassEvent') {
|
||
var passPopIndex = layer.open({
|
||
type: 1,
|
||
title: '<span style="color: #cc0000">*</span>请假审批(不同意)',
|
||
skin: 'un-pass-class',
|
||
offset: '150px',
|
||
closeBtn: 1,
|
||
area: ['40%', '30%'],
|
||
shadeClose: false,
|
||
anim: 2,
|
||
content: $('#pass-div-box').html(),
|
||
btn: ['确定', '取消'],
|
||
btnAlign : 'c',
|
||
yes : function(){
|
||
var loadIndex = layer.load(1);
|
||
top.restAjax.put(top.restAjax.path('api/leave/updateleaveofapproval2/{arg}', [obj.data.leaveId]),
|
||
{approver2RefuseSummary : $('#leaveRefuseSummary').val(), approver2State : '2'}, null,
|
||
function(code, data) {
|
||
layer.close(passPopIndex);
|
||
layer.close(loadIndex);
|
||
top.dialog.msg('审批完成');
|
||
reloadTable();
|
||
}, function(){
|
||
layer.close(loadIndex);
|
||
top.dialog.msg(data.msg);
|
||
});
|
||
},
|
||
btn2 : function(){
|
||
layer.close(passPopIndex);
|
||
},
|
||
success : function(){
|
||
$('#leaveRefuseSummary').val('不同意');
|
||
}
|
||
});
|
||
}
|
||
if(obj.event === 'leaveImgEvent') {
|
||
let data = obj.data;
|
||
let fileIds = data.leaveImg.split(',');
|
||
let files = [];
|
||
$.each(fileIds, function(index, item) {
|
||
files.push({
|
||
alt: index,
|
||
pid: item,
|
||
src: `route/file/downloadfile/true/${item}`,
|
||
thumb: `route/file/downloadfile/true/${item}`
|
||
})
|
||
})
|
||
layer.photos({
|
||
photos: {
|
||
title: `${data.leaveUserName}的请假条`,
|
||
id: data.leaveId,
|
||
start: 0,
|
||
data: files
|
||
},
|
||
anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机
|
||
});
|
||
}
|
||
});
|
||
|
||
$(document).on('click', '#search', function() {
|
||
if(dataLoading){
|
||
layer.msg('数据加载中,请稍等...');
|
||
return;
|
||
}
|
||
reloadTable(1);
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |