|
|
|
|
@ -19,22 +19,19 @@ |
|
|
|
|
<div class="layui-block"> |
|
|
|
|
<label class="layui-form-label">预约日期</label> |
|
|
|
|
<div class="layui-input-block"> |
|
|
|
|
<input type="text" class="layui-input" id="reservationStartDate" placeholder=预约开始时间> |
|
|
|
|
<input type="text" class="layui-input" id="reservationStartDate" placeholder="预约开始时间"> |
|
|
|
|
</div> |
|
|
|
|
<div class="layui-input-block"> |
|
|
|
|
<input type="text" class="layui-input" id="reservationEndDate" placeholder=预约结束时间> |
|
|
|
|
<input type="text" class="layui-input" id="reservationEndDate" placeholder="预约结束时间"> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="layui-block"> |
|
|
|
|
<button class="layui-btn layui-btn-sm layuiadmin-btn-forum-list" id="search" type="button" data-type="reload"> |
|
|
|
|
<button class="layui-btn layui-btn-sm layuiadmin-btn-forum-list" id="search" type="button"> |
|
|
|
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>搜索 |
|
|
|
|
</button> |
|
|
|
|
<button class="layui-btn layui-btn-sm layuiadmin-btn-forum-list" type="button" id="reset"> |
|
|
|
|
<i class="layui-icon layui-icon-refresh layuiadmin-button-btn"></i>重置 |
|
|
|
|
</button> |
|
|
|
|
<!-- <button class="layui-btn layui-btn-sm layuiadmin-btn-forum-list" type="button" id="download">--> |
|
|
|
|
<!-- <i class="layui-icon layui-icon-refresh layuiadmin-button-btn"></i>导出--> |
|
|
|
|
<!-- </button>--> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
@ -56,43 +53,66 @@ |
|
|
|
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除记录</a> |
|
|
|
|
</script> |
|
|
|
|
<script> |
|
|
|
|
//显示下拉列表(必须有) |
|
|
|
|
var startDate, endDate; |
|
|
|
|
// 显示下拉列表(必须有) |
|
|
|
|
layui.config({base: '/html/common/layui/'}).use('global'); |
|
|
|
|
layui.use('table', function() { |
|
|
|
|
|
|
|
|
|
layui.use(['table', 'laydate'], function() { |
|
|
|
|
var laydate = layui.laydate; |
|
|
|
|
// 渲染 |
|
|
|
|
laydate.render({ |
|
|
|
|
elem: '#reservationStartDate' |
|
|
|
|
var table = layui.table; |
|
|
|
|
var $ = layui.$; |
|
|
|
|
|
|
|
|
|
// 获取当天日期并格式化为YYYY-MM-DD |
|
|
|
|
|
|
|
|
|
startDate = laydate.render({ |
|
|
|
|
elem: '#reservationStartDate', |
|
|
|
|
value: getToday(), |
|
|
|
|
format: 'yyyy-MM-dd', |
|
|
|
|
done: function(value, date) { |
|
|
|
|
// endDate.config.min = value; // 设置结束日期的最小值为开始日期 |
|
|
|
|
// endDate.config.value = Math.max(value, endDate.config.value); // 确保结束日期不小于开始日期 |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
laydate.render({ |
|
|
|
|
elem: '#reservationEndDate' |
|
|
|
|
|
|
|
|
|
// 然后初始化结束日期控件 |
|
|
|
|
endDate = laydate.render({ |
|
|
|
|
elem: '#reservationEndDate', |
|
|
|
|
value: getToday(), |
|
|
|
|
format: 'yyyy-MM-dd', |
|
|
|
|
done: function(value, date) { |
|
|
|
|
// startDate.config.max = value; // 设置开始日期的最大值为结束日期 |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
var table = layui.table; |
|
|
|
|
|
|
|
|
|
// 初始化表格 |
|
|
|
|
table.render({ |
|
|
|
|
elem : '#datatable', |
|
|
|
|
even: true,//隔行换色 |
|
|
|
|
url : ctx + 'appointmentRecord/selectStatistics',//数据接口 |
|
|
|
|
elem: '#datatable', |
|
|
|
|
even: true, // 隔行换色 |
|
|
|
|
url: ctx + 'appointmentRecord/selectStatistics', // 数据接口 |
|
|
|
|
method: 'POST', |
|
|
|
|
contentType: 'application/json', |
|
|
|
|
cols : [ [ //表头 |
|
|
|
|
// {field: 'guid', type:'checkbox', width:'5%'}, |
|
|
|
|
{title:'序号', width:'5%', type:'numbers'}, |
|
|
|
|
{field:'visitingPlace', title:'参观地点', width:'20%', align:'center', |
|
|
|
|
cols: [[ // 表头 |
|
|
|
|
{title: '序号', width: '5%', type: 'numbers'}, |
|
|
|
|
{field: 'visitingPlace', title: '参观地点', width: '20%', align: 'center', |
|
|
|
|
templet: function(d) { |
|
|
|
|
return d.visitingPlace ? d.visitingPlace : '暂无'; |
|
|
|
|
}}, |
|
|
|
|
{field:'altogether', title:'预约人数', align:'center'}, |
|
|
|
|
{field:'verified', title:'核销人数', align:'center'}, |
|
|
|
|
{field:'cancel', title:'取消人数', align:'center'}, |
|
|
|
|
{field:'hasExpired', title:'过期人数', align:'center'}, |
|
|
|
|
{field:'guid', hide:true, width:0} |
|
|
|
|
] ], |
|
|
|
|
id : 'tableId', |
|
|
|
|
page : false,//开启分页 |
|
|
|
|
height : tableHight(), |
|
|
|
|
{field: 'altogether', title: '预约人数', align: 'center'}, |
|
|
|
|
{field: 'verified', title: '核销人数', align: 'center'}, |
|
|
|
|
{field: 'cancel', title: '取消人数', align: 'center'}, |
|
|
|
|
{field: 'hasExpired', title: '过期人数', align: 'center'}, |
|
|
|
|
{field: 'guid', hide: true, width: 0} |
|
|
|
|
]], |
|
|
|
|
id: 'tableId', |
|
|
|
|
page: false, // 开启分页 |
|
|
|
|
height: tableHight(), |
|
|
|
|
where: { |
|
|
|
|
reservationStartDate: getToday(), |
|
|
|
|
reservationEndDate: getToday() |
|
|
|
|
}, |
|
|
|
|
done: function(res, curr, count) { |
|
|
|
|
// 数据加载完成后计算合计 |
|
|
|
|
if( res.data.data.length > 0) { |
|
|
|
|
if(res.data && res.data.data && res.data.data.length > 0) { |
|
|
|
|
var totalData = { |
|
|
|
|
visitingPlace: '合计', |
|
|
|
|
altogether: 0, |
|
|
|
|
@ -126,74 +146,60 @@ |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
//搜索 |
|
|
|
|
var $ = layui.$, active = { |
|
|
|
|
reload : function() { |
|
|
|
|
table.reload('tableId', { |
|
|
|
|
where : { |
|
|
|
|
reservationStartDate:$('#reservationStartDate').val(), |
|
|
|
|
reservationEndDate:$('#reservationEndDate').val(), |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
//点击搜索按钮 |
|
|
|
|
// 搜索按钮 |
|
|
|
|
$('#search').on('click', function() { |
|
|
|
|
var type = $(this).data('type'); |
|
|
|
|
active[type] ? active[type].call(this) : ''; |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
//点击重置按钮 |
|
|
|
|
$('#reset').on('click', function() { |
|
|
|
|
var form = layui.form; |
|
|
|
|
$("#scenicName").val(""); |
|
|
|
|
$("#reservationPersonName").val(""); |
|
|
|
|
$("#reservationPersonPhone").val(""); |
|
|
|
|
$("#state").val(""); |
|
|
|
|
$("#reservationStartDate").val(""); |
|
|
|
|
$("#reservationEndDate").val(""); |
|
|
|
|
form.render('select'); |
|
|
|
|
var type = $(this).data('type'); |
|
|
|
|
active[type] ? active[type].call(this) : ''; |
|
|
|
|
table.reload('tableId', { |
|
|
|
|
where : { |
|
|
|
|
reservationStartDate:$('#reservationStartDate').val(), |
|
|
|
|
reservationEndDate:$('#reservationEndDate').val(), |
|
|
|
|
where: { |
|
|
|
|
reservationStartDate: $('#reservationStartDate').val(), |
|
|
|
|
reservationEndDate: $('#reservationEndDate').val() |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
// 获取当天日期并格式化为YYYY-MM-DD |
|
|
|
|
function getToday() { |
|
|
|
|
var today = new Date(); |
|
|
|
|
return today.getFullYear() + '-' + |
|
|
|
|
(today.getMonth() + 1).toString().padStart(2, '0') + '-' + |
|
|
|
|
today.getDate().toString().padStart(2, '0'); |
|
|
|
|
} |
|
|
|
|
$('#reset').on('click', function() { |
|
|
|
|
// 1. 获取当天日期（格式必须与控件一致） |
|
|
|
|
var today = new Date(); |
|
|
|
|
var todayStr = today.getFullYear() + '-' + |
|
|
|
|
(today.getMonth() + 1).toString().padStart(2, '0') + '-' + |
|
|
|
|
today.getDate().toString().padStart(2, '0'); |
|
|
|
|
// 3. 设置输入框值（两种方式确保生效） |
|
|
|
|
$('#reservationStartDate').val(todayStr).trigger('change'); |
|
|
|
|
$('#reservationEndDate').val(todayStr).trigger('change'); |
|
|
|
|
startDate = laydate.render({ |
|
|
|
|
elem: '#reservationStartDate', |
|
|
|
|
value: getToday(), |
|
|
|
|
format: 'yyyy-MM-dd', |
|
|
|
|
done: function(value, date) { |
|
|
|
|
// endDate.config.min = value; // 设置结束日期的最小值为开始日期 |
|
|
|
|
// endDate.config.value = todayStr; // 确保结束日期不小于开始日期 |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// $("#download").on("click",function() { |
|
|
|
|
// table.exportFile('tableData'); |
|
|
|
|
// }) |
|
|
|
|
// 然后初始化结束日期控件 |
|
|
|
|
endDate = laydate.render({ |
|
|
|
|
elem: '#reservationEndDate', |
|
|
|
|
value: getToday(), |
|
|
|
|
format: 'yyyy-MM-dd', |
|
|
|
|
min: getToday(), // 初始最小值为今天 |
|
|
|
|
done: function(value, date) { |
|
|
|
|
// startDate.config.value = todayStr; // 设置开始日期的最大值为结束日期 |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
var laydate = layui.laydate; |
|
|
|
|
var startDate = laydate.render({ |
|
|
|
|
elem : '#starttime', |
|
|
|
|
format: 'yyyy-MM-dd', |
|
|
|
|
max: new Date().getTime(), |
|
|
|
|
done : function(value, date) { |
|
|
|
|
endDate.config.min = { |
|
|
|
|
year : date.year, |
|
|
|
|
month : date.month-1, |
|
|
|
|
date : date.date, |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
var endDate = laydate.render({ |
|
|
|
|
elem : '#endtime', |
|
|
|
|
format: 'yyyy-MM-dd', |
|
|
|
|
max: new Date().getTime(), |
|
|
|
|
done : function(value, date) { |
|
|
|
|
startDate.config.max = { |
|
|
|
|
year : date.year, |
|
|
|
|
month : date.month-1, |
|
|
|
|
date : date.date, |
|
|
|
|
// 5. 重新加载表格数据 |
|
|
|
|
table.reload('tableId', { |
|
|
|
|
where: { |
|
|
|
|
reservationStartDate: todayStr, |
|
|
|
|
reservationEndDate: todayStr |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
</script> |
|
|
|
|
</html> |
|
|
|
|
|
chenfeng
6 months ago