335 lines
16 KiB
JavaScript
335 lines
16 KiB
JavaScript
let that;
|
|
let datatable = null;
|
|
const app = {
|
|
data() {
|
|
return {
|
|
// 第一次加载
|
|
isfirst: true,
|
|
// 酒店组值
|
|
selected_hotel_group: Cookies.get('EVENTLOGGING_hotelgroup') || 0,
|
|
// 酒店组
|
|
selecthotelgroup: [{ HotelGroupsId: "0", HotelGroupsName: "全部酒店组" }],
|
|
// 事件id
|
|
evenid: Cookies.get('EVENTLOGGING_evenid') || "",
|
|
// 房间当前选择
|
|
selected_room: Cookies.get('EVENTLOGGING_room') || 0,
|
|
// 房间选择
|
|
selectroom: [{ val: "0", text: "全部房间" }],
|
|
// 起始时间
|
|
startDate: Cookies.get('EVENTLOGGING_startDate') || moment().startOf("days").format('YYYY-MM-DD HH:mm:ss'),
|
|
// 结束时间
|
|
endDate: Cookies.get('EVENTLOGGING_endDate') || moment().format('YYYY-MM-DD HH:mm:ss'),
|
|
// 表格
|
|
datatable: null,
|
|
// 天数快捷选择值
|
|
selected_day: Cookies.get('EVENTLOGGING_day') || 1,
|
|
// 天数快捷选择
|
|
selectday: [{ val: "1", text: "今天" }, { val: "2", text: "昨天" }, { val: "3", text: "最近7天" }, { val: "4", text: "最近30天" }, { val: "-1", text: "自定义" }],
|
|
// 每页数量选择值
|
|
selected_page: Cookies.get('EVENTLOGGING_page') || 10,
|
|
// 每页数量
|
|
selectpage: [{ val: "10", text: "每页10条" }, { val: "20", text: "每页20条" }, { val: "30", text: "每页30条" }, { val: "10", text: "每页40条" }],
|
|
// 酒店选择
|
|
selecthotel: [{ HotelId: "0", HotelName: "全部酒店" }],
|
|
// 酒店选择值
|
|
selected_hotel: Cookies.get('EVENTLOGGING_hotel') || 0,
|
|
// 高度
|
|
appheight: "",
|
|
}
|
|
},
|
|
created() {
|
|
that = this;
|
|
setTimeout(function () { that.init(); }, 10);
|
|
},
|
|
methods: {
|
|
// 初始化
|
|
init() {
|
|
this.loc();
|
|
this.selectgroup_init();
|
|
// 带有时间选择的日期范围选择器
|
|
$('#reservationtime').daterangepicker({
|
|
startDate:that.startDate,
|
|
endDate: that.endDate,
|
|
timePicker: true,
|
|
maxDate: new Date(),
|
|
minDate: "2022-3-25 01:01:01",
|
|
timePicker24Hour: true,
|
|
timePickerSeconds: true,
|
|
locale: {
|
|
cancelLabel: 'Clear',
|
|
format: 'YYYY-MM-DD HH:mm:ss'
|
|
}
|
|
}).on('apply.daterangepicker', function (ev, picker) {
|
|
that.startDate = picker.startDate.format('YYYY-MM-DD HH:mm:ss');
|
|
that.endDate = picker.endDate.format('YYYY-MM-DD HH:mm:ss');
|
|
that.selected_day = -1;
|
|
}).on('cancel.daterangepicker', function (ev, picker) {
|
|
$(this).val('');
|
|
that.startDate = null;
|
|
that.endDate = null;
|
|
that.selected_day = -1;
|
|
});
|
|
},
|
|
// 酒店组改变事件 更改酒店列表信息
|
|
selectgroup_init() {
|
|
try
|
|
{
|
|
if(that.isfirst) {
|
|
MyPost("/Api/HOTELINFO", { isSwal: that.isfirst }, res => {
|
|
if (res == null) {
|
|
toastr.error('酒店信息获取失败~');
|
|
return;
|
|
}
|
|
that.selecthotelgroup = that.selecthotelgroup.concat(res || []);
|
|
let oldok = false;
|
|
for (let i of that.selecthotelgroup) {
|
|
if (i.HotelGroupsId == that.selected_hotel_group) {
|
|
oldok = true;
|
|
break;
|
|
}
|
|
}
|
|
if (!oldok) {
|
|
// 历史选择的酒店组不存在
|
|
that.selected_hotel_group = 0;
|
|
that.selected_hotel = 0;
|
|
that.selected_room = 0;
|
|
}
|
|
// 初始化 酒店列表
|
|
that.selecthotel_init();
|
|
|
|
});
|
|
} else {
|
|
that.selecthotel_init();
|
|
}
|
|
|
|
|
|
} catch (e) {
|
|
console.log("酒店组选择报错."+e);
|
|
}
|
|
},
|
|
// 获取酒店下拉列表信息
|
|
selecthotel_init() {
|
|
that.selected_hotel_group = Number.parseInt(that.selected_hotel_group + "".replace(/\s*/g, ""));
|
|
// 如果历史酒店组的id 未能在数据找到 就让选择全部酒店组 显示所有酒店
|
|
let alldata = [{ HotelId: "0", HotelName: "全部酒店" }];
|
|
for (let i of that.selecthotelgroup) {
|
|
if (i.Hotels != null) {
|
|
alldata = alldata.concat(i.Hotels);
|
|
}
|
|
if (i.HotelGroupsId == that.selected_hotel_group && that.selected_hotel_group > 0) {
|
|
that.selecthotel = [{ HotelId: "0", HotelName: "全部酒店" }];
|
|
that.selecthotel = that.selecthotel.concat(i.Hotels || []);
|
|
let isold = false;
|
|
// 如果是第一次 那就 判断 历史选择的酒店 是否有存在 没有的话就 重置选择
|
|
if (that.isfirst && that.selected_hotel !=0) {
|
|
for (let j of that.selecthotel) {
|
|
if (j.HotelId == that.selected_hotel) {
|
|
isold = true;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
if (!isold) {
|
|
that.selected_hotel = 0;
|
|
that.selected_room = 0;
|
|
}
|
|
that.selectroom_init();
|
|
return;
|
|
}
|
|
}
|
|
// 如果没有找到 就 重置选择
|
|
that.selected_hotel_group = 0;// that.selected_hotel_group > 0 正常操作 是不存在找不到的 酒店组时已经判断过一次了。
|
|
that.selected_hotel = 0;
|
|
that.selected_room = 0;
|
|
that.selecthotel = alldata;
|
|
console.log(that.selecthotel)
|
|
console.log(alldata)
|
|
that.selectroom_init();
|
|
},
|
|
// 获取房间下拉列表信息
|
|
selectroom_init() {
|
|
that.selectroom = [{ val: "0", text: "全部房间" }];
|
|
MyPost("/Api/ROOMINFO", { isSwal: that.isfirst, data: { HotelId: that.selected_hotel, GroupId: that.selected_hotel_group } }, res => {
|
|
that.selectroom = that.selectroom.concat(res || []);
|
|
let oldok = false;
|
|
if (that.isfirst && that.selected_room != 0) {
|
|
for (let i of that.selectroom) {
|
|
if (i.val == that.selected_room) {
|
|
oldok = true;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
if (!oldok) {
|
|
// 历史选择的房间不存在 或者 不是第一次加载
|
|
that.selected_room = 0;
|
|
}
|
|
that.table_init();
|
|
});
|
|
},
|
|
// 时间快捷选择
|
|
selected_day_change: function () {
|
|
that.selected_day = Number.parseInt(that.selected_day + "".replace(/\s*/g, ""));
|
|
switch (that.selected_day) {
|
|
case 1:
|
|
that.startDate = moment().startOf("days").format('YYYY-MM-DD HH:mm:ss')
|
|
that.endDate = moment().format('YYYY-MM-DD HH:mm:ss')
|
|
break;
|
|
case 2:
|
|
that.startDate = moment().subtract(1, 'days').startOf("days").format('YYYY-MM-DD HH:mm:ss');
|
|
that.endDate = moment().subtract(1, 'days').endOf("days").format('YYYY-MM-DD HH:mm:ss');
|
|
break;
|
|
case 3:
|
|
that.startDate = moment().subtract(6, 'days').format('YYYY-MM-DD HH:mm:ss');
|
|
that.endDate = moment().format('YYYY-MM-DD HH:mm:ss');
|
|
break;
|
|
case 4:
|
|
that.startDate = moment().subtract(29, 'days').format('YYYY-MM-DD HH:mm:ss');
|
|
that.endDate = moment().format('YYYY-MM-DD HH:mm:ss');
|
|
break;
|
|
}
|
|
// that.selected_day 是string 类型 他会自己转成 number 进行比较
|
|
if (that.selected_day > -1) {
|
|
$('#reservationtime').val(that.startDate + ' - ' + that.endDate);
|
|
that.table_init();
|
|
}
|
|
},
|
|
// 计算距离
|
|
loc: function () {
|
|
// 采用的局部 vue 所以这里 有些许 jquery
|
|
//let footloc = $('.main-footer').offset().top;
|
|
$('.main-footer').hide();
|
|
this.appheight = "calc(100vh - " + $('.table-responsive').offset().top + "px)";
|
|
},
|
|
|
|
ellipsis(value) {
|
|
let var_ = "" + value
|
|
let length_ = var_.length;
|
|
let str = "";
|
|
for (var i = length_; i < 4; i++) {
|
|
str += "1";
|
|
}
|
|
return var_ + `<span style='opacity: 0;'>` + str + `</span>`;
|
|
},
|
|
// 表格初始化
|
|
table_init() {
|
|
try {
|
|
if (that.isfirst) {
|
|
that.isfirst = false;
|
|
}
|
|
if (datatable != null) {
|
|
datatable.destroy();
|
|
}
|
|
$.fn.dataTable.ext.errMode = 'none';//屏蔽掉报错弹窗
|
|
datatable = $('#dataTable').on('error.dt', function (e, settings, techNote, message) {
|
|
console.log(e, settings, techNote)
|
|
console.log('An error has been reported by DataTables: ', message);
|
|
}).DataTable({
|
|
"data": null,
|
|
"ordering": true,
|
|
"paging": true,
|
|
"serverSide": true,
|
|
"ajax": function (datas, callback, settings) {
|
|
datas.hotelid = that.selected_hotel;
|
|
datas.mac = that.mac;
|
|
datas.roomid = that.selected_room;
|
|
datas.evenid = that.evenid;
|
|
datas.startDate = that.startDate;
|
|
datas.endDate = that.endDate;
|
|
MyPost("/Server/EVENTLOGGING_", { isSwal: true, data: datas }, (res) => {
|
|
that.rcudata = res || [];
|
|
Cookies.set('EVENTLOGGING_hotelgroup', that.selected_hotel_group, { expires: 7, path: window.location.pathname });
|
|
if (that.endDate != null) {
|
|
Cookies.set('EVENTLOGGING_endDate', that.endDate, { expires: 7, path: window.location.pathname });
|
|
}
|
|
if (that.startDate != null) {
|
|
Cookies.set('EVENTLOGGING_startDate', that.startDate, { expires: 7, path: window.location.pathname });
|
|
}
|
|
// 写入数据缓存
|
|
Cookies.set('EVENTLOGGING_hotelgroup', that.selected_hotel_group, { expires: 7, path: window.location.pathname });
|
|
Cookies.set('EVENTLOGGING_day', that.selected_day, { expires: 7, path: window.location.pathname });
|
|
Cookies.set('EVENTLOGGING_hotel', that.selected_hotel, { expires: 7, path: window.location.pathname });
|
|
Cookies.set('EVENTLOGGING_page', that.selected_page, { expires: 7, path: window.location.pathname });
|
|
Cookies.set('EVENTLOGGING_evenid', that.evenid, { expires: 7, path: window.location.pathname });
|
|
Cookies.set('EVENTLOGGING_room', that.selected_room, { expires: 7, path: window.location.pathname });
|
|
if (that.isfirst) { that.isfirst = false; }
|
|
callback(res);
|
|
}, (err) => {
|
|
toastr.error('网络繁忙~')
|
|
})
|
|
},
|
|
'iDisplayLength': that.selected_page,
|
|
"columns": [{
|
|
'sTitle': '',/*.substring(6)*/
|
|
'render': function (data, type, rcu) {
|
|
try {
|
|
let STR =
|
|
`<div class="col-12 col-md-6">
|
|
<span>`+ that.ellipsis(rcu.data.MFD_ID) + `</span>
|
|
<button type="button" class= "`+ (rcu.data.Available == 1 ? 'btn btn-xs btn-success' : 'btn btn-xs btn-danger') + `">` + (rcu.data.Available == 1 ? '可 用' : '不可用') + `</button>
|
|
`+ rcu.data.UploadDateTime + `
|
|
</div>
|
|
<div class="col-md-6 col-12">
|
|
FilePath : `+ rcu.data.Directory + `\\` + rcu.data.XML_FileName + `
|
|
</div>
|
|
<div class="col-md-6 col-12">
|
|
XLM_MD5 : `+ rcu.data.XLM_MD5 + `
|
|
</div>
|
|
<div class="col-md-6 col-12">
|
|
`+ rcu.size + `
|
|
<button type="button" onclick="del_file(this,`+ rcu.data.MFD_ID + `)" class="btn btn-danger btn-xs">删除文件</button>
|
|
</div>`;
|
|
return STR;
|
|
} catch (e) {
|
|
console.log(e);
|
|
}
|
|
}
|
|
}],
|
|
"fnCreatedRow": function (nRow, aData, iDataIndex) {
|
|
$(nRow).addClass('bg-white').addClass('shadow');
|
|
$(nRow).children("td").addClass('row');
|
|
return;
|
|
},
|
|
"searching": false,
|
|
"autoWidth": false,
|
|
"bDeferRender ": true,
|
|
"bLengthChange": false,
|
|
"language":
|
|
{
|
|
"sProcessing": "处理中...",
|
|
"sLengthMenu": "显示 _MENU_ 项结果",
|
|
"sZeroRecords": "没有匹配结果",
|
|
"sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
|
|
"sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
|
|
"sInfoFiltered": "(由 _MAX_ 项结果过滤)",
|
|
"sInfoPostFix": "",
|
|
"sSearch": "搜索:",
|
|
"sUrl": "",
|
|
"sEmptyTable": "表中数据为空",
|
|
"sLoadingRecords": "载入中...",
|
|
"sInfoThousands": ",",
|
|
"oPaginate": {
|
|
"sFirst": "首页",
|
|
"sPrevious": "上页",
|
|
"sNext": "下页",
|
|
"sLast": "末页"
|
|
},
|
|
"oAria": {
|
|
"sSortAscending": ": 以升序排列此列",
|
|
"sSortDescending": ": 以降序排列此列"
|
|
}
|
|
}
|
|
});
|
|
} catch (e) {
|
|
console.log(e)
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
Vue.createApp(app).mount('#app');
|
|
|
|
$('#app').show();
|
|
|