374 lines
17 KiB
HTML
374 lines
17 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="approverState" name="approverState">
|
||
<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-detail1';
|
||
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: 'outgoingLocation', width: 200, title: '外出地点', align:'center',
|
||
templet: function(row) {
|
||
var rowData = row[this.field];
|
||
if(typeof(rowData) === 'undefined' || rowData == null || rowData == '') {
|
||
return '-';
|
||
}
|
||
return `<a href="javascript:void(0);" lay-event="showOutgoingEvent">${rowData}</a>`;
|
||
}
|
||
},
|
||
{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;
|
||
}
|
||
}
|
||
]],
|
||
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(),
|
||
approverState : $('#approverState').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 === '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的选择，指定弹出图片动画类型，默认随机
|
||
});
|
||
}
|
||
if(obj.event === 'showOutgoingEvent') {
|
||
let data = obj.data;
|
||
console.log(data);
|
||
}
|
||
});
|
||
|
||
$(document).on('click', '#search', function() {
|
||
if(dataLoading){
|
||
layer.msg('数据加载中,请稍等...');
|
||
return;
|
||
}
|
||
reloadTable(1);
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |