383 lines
16 KiB
JavaScript
383 lines
16 KiB
JavaScript
let form, table, laydate, objParam, tag, active, element;
|
|
let tableIns;
|
|
let pageNum = 1; // 定义分页
|
|
let labelsArr = [['demo', 'demo2', 'demo3', 'demo4'], ['demo', 'demo2', 'demo3', 'demo4', 'demo5'], ['demo3', 'demo4', 'demo5', 'demo6']];
|
|
let labelArr = [];
|
|
function setParams(obj) {
|
|
objParam = JSON.parse(obj);
|
|
setSearch(objParam.type);
|
|
if (objParam.type === 1) { // 工程数量跳转
|
|
labelArr = labelsArr[0];
|
|
} else if (objParam.type === 2) { // 需求计划详情跳转
|
|
labelArr = labelsArr[1];
|
|
} else if (objParam.type === 3 || objParam.type === 4 || objParam.type === 5 || objParam.type === 6) { // 派车详情
|
|
labelArr = labelsArr[2];
|
|
}
|
|
setFilter(objParam.type);
|
|
setFilterData(objParam.type);
|
|
layui.config({
|
|
base: "../../lib/layui-v2.9.18/layui/modules/", //此处路径请自行处理, 可以使用绝对路径
|
|
}).extend({
|
|
tag: 'tag'
|
|
}).use(["form", "table", 'laydate', 'tag', 'element'], function () {
|
|
form = layui.form;
|
|
table = layui.table;
|
|
laydate = layui.laydate;
|
|
tag = layui.tag;
|
|
element = layui.element;
|
|
//全局设置
|
|
tag.set({
|
|
skin: 'layui-btn layui-btn-primary layui-btn-sm layui-btn-radius',//标签样式
|
|
tagText: '添加标签' //标签添加按钮提示文本
|
|
});
|
|
// 触发事件
|
|
active = {
|
|
// 新增demo2标签
|
|
tagAdd: function (nameValue, index) {
|
|
tag.add('delDemo', {
|
|
text: nameValue,
|
|
id: index
|
|
})
|
|
},
|
|
// 删除demo2标签
|
|
tagDelete: function (index) {
|
|
tag.delete('delDemo', index);
|
|
}
|
|
};
|
|
$.each(labelArr, function (index, item) {
|
|
tag.on('click(' + item + ')', function () {
|
|
let name = replaceChinese($(this).html());
|
|
let index = $(this).attr('lay-id');
|
|
let indexArr = index.split('-');
|
|
$('#' + item + ' button').each(function () {
|
|
let flag = $(this).hasClass('checkBtn');
|
|
if (flag) {
|
|
$(this).removeClass('checkBtn');
|
|
}
|
|
});
|
|
$('#' + item + ' button').each(function () {
|
|
let layId = $(this).attr('lay-id');
|
|
if (layId === index) {
|
|
$(this).addClass('checkBtn');
|
|
}
|
|
});
|
|
let flag = false, isAll = false, isRepeat = false, delLabelIdArr = [];
|
|
if (name === '全部') {
|
|
isAll = true;
|
|
}
|
|
$('#delDemo button').each(function () {
|
|
let layId = $(this).attr('lay-id');
|
|
let layIdArr = layId.split('-');
|
|
if (isAll && indexArr[0] === layIdArr[0]) { // 选择的是全部
|
|
delLabelIdArr.push(layId);
|
|
} else if (!isAll && indexArr[0] === layIdArr[0]) {
|
|
isRepeat = true;
|
|
delLabelIdArr.push(layId);
|
|
} else if (!isAll && index === layId) { // 选择的不是全部，并且标签相同
|
|
flag = true
|
|
return false;
|
|
}
|
|
})
|
|
if (isAll && delLabelIdArr.length > 0) {
|
|
$.each(delLabelIdArr, function (index, item) {
|
|
active.tagDelete(item);
|
|
})
|
|
} else if (!isAll && delLabelIdArr.length > 0 && isRepeat) {
|
|
$.each(delLabelIdArr, function (index, item) {
|
|
active.tagDelete(item);
|
|
})
|
|
active.tagAdd(name, index);
|
|
} else if (!isAll && flag && isRepeat) {
|
|
return layer.msg('选中标签已存在', { icon: 7 });
|
|
} else if (!isAll && !flag && !isRepeat) {
|
|
active.tagAdd(name, index);
|
|
}
|
|
});
|
|
});
|
|
// 已选条件删除
|
|
tag.on('delete(delDemo)', function (data) {
|
|
let index = $('#delDemo button').eq(data.index).attr('lay-id');
|
|
$('.tag-item').each(function () {
|
|
let layId = $(this).attr('lay-id');
|
|
if (layId === index) {
|
|
$(this).removeClass('checkBtn');
|
|
}
|
|
});
|
|
});
|
|
setInitCheckData();
|
|
if (objParam.type === 1) { // 工程数量跳转
|
|
loadScript("../../js/welcome/data_datail_pro_list.js");
|
|
} else if (objParam.type === 2) { // 需求计划详情跳转
|
|
loadScript("../../js/welcome/data_datail_plan_list.js");
|
|
} else if (objParam.type === 3 || objParam.type === 4 || objParam.type === 5 || objParam.type === 6) { // 派车详情
|
|
loadScript("../../js/welcome/data_datail_dispatch_list.js");
|
|
}
|
|
setTimeout(() => {
|
|
if (objParam.type === 1 || objParam.type === 2) {
|
|
let height = $('div#demo.layui-btn-container.tag').height();
|
|
if (height > 30) {
|
|
$('#open').removeAttr('style');
|
|
$('#demo button').css('margin-bottom', '5px');
|
|
$('#demo').css({ 'height': '30px', 'overflow': 'hidden', 'text-overflow': 'ellipsis' })
|
|
}
|
|
}
|
|
}, 100);
|
|
});
|
|
}
|
|
|
|
// 动态加载js
|
|
function loadScript(url) {
|
|
var script = document.createElement('script');
|
|
script.type = 'text/javascript';
|
|
script.src = url;
|
|
document.body.appendChild(script);
|
|
}
|
|
|
|
// 保留中文汉字和数字
|
|
function replaceChinese(value) {
|
|
// let str = value.match(/[\u4e00-\u9fa5]|\d|[a-z][A-Z]/g).join("");
|
|
let str = value.replace('<i class="layui-icon layui-unselect tag-close">ဆ</i>', '');
|
|
return str;
|
|
}
|
|
|
|
// 清空筛选
|
|
function clearFilter() {
|
|
$('.tag-item').each(function () {
|
|
$(this).removeClass('checkBtn');
|
|
});
|
|
$('#delDemo button').each(function () {
|
|
let layId = $(this).attr('lay-id');
|
|
active.tagDelete(layId);
|
|
})
|
|
}
|
|
|
|
// 1.收起数据
|
|
function showData(type) {
|
|
if (type === 1) {
|
|
$('#open').removeAttr('style');
|
|
$('#close').css('display', 'none');
|
|
$('#demo').css({ 'height': '30px', 'overflow': 'hidden', 'text-overflow': 'ellipsis' })
|
|
} else {
|
|
$('#open').css('display', 'none');
|
|
$('#close').removeAttr('style');
|
|
$('#demo').removeAttr('style');
|
|
}
|
|
}
|
|
|
|
// 设置筛选条件
|
|
function setFilter(type) {
|
|
let html = ""
|
|
if (type === 1) { // 工程详情
|
|
html += "<div>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>分公司：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo' id='demo'>" +
|
|
"</div>" +
|
|
"<a id='close' onclick='showData(1)' style='display: none;'><img src='../../images/welcome/close.png'>收起</a>" +
|
|
"<a id='open' onclick='showData(2)' style='display: none;'><img src='../../images/welcome/show.png'>展开</a>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>派车状态：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo2' id='demo2'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>年份：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo3' id='demo3'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>月份：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo4' id='demo4'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"</div>";
|
|
} else if (type === 2) { // 需求计划详情
|
|
html += "<div>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>分公司：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo' id='demo'>" +
|
|
"</div>" +
|
|
"<a id='close' onclick='showData(1)' style='display: none;'><img src='../../images/welcome/close.png'>收起</a>" +
|
|
"<a id='open' onclick='showData(2)' style='display: none;'><img src='../../images/welcome/show.png'>展开</a>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>派车状态：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo2' id='demo2'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>付款状态：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo5' id='demo5'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>年份：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo3' id='demo3'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>月份：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo4' id='demo4'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"</div>";
|
|
} else if (type === 3 || 4 || 5 || 6) { // 派车详情
|
|
html += "<div>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>类型：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo6' id='demo6'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>年份：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo3' id='demo3'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>月份：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo4' id='demo4'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"<div class='layout tag-box'>" +
|
|
"<p>付款状态：</p>" +
|
|
"<div class='layui-btn-container tag' lay-filter='demo5' id='demo5'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<hr>" +
|
|
"</div>";
|
|
}
|
|
$('#filter-box').before(html);;
|
|
}
|
|
|
|
function setFilterData(type) {
|
|
if (type === 1) { // 工程详情
|
|
loadCompanyData(); // 分公司
|
|
loadDispatchStatusData(); // 派车状态
|
|
loadYearsData(); // 年份
|
|
loadMonthData(); // 月份
|
|
} else if (type === 2) { // 需求计划详情
|
|
loadCompanyData(); // 分公司
|
|
loadDispatchStatusData(1); // 派车状态
|
|
loadPayStatusData(); // 付款状态
|
|
loadYearsData(); // 年份
|
|
loadMonthData(); // 月份
|
|
} else if (type === 3 || 4 || 5 || 6) { // 派车详情
|
|
loadTypeData(); // 车辆类型
|
|
loadYearsData(); // 年份
|
|
loadMonthData(); // 月份
|
|
loadPayStatusData(); // 付款状态
|
|
}
|
|
}
|
|
|
|
// 设置默认选中的筛选条件
|
|
function setInitCheckData() {
|
|
let checkTabId = [], checkTabName = [];
|
|
if (objParam.currentTabId === '2') { // 选中本年度
|
|
let nowYear = new Date().getFullYear();
|
|
checkTabId.push('year-' + nowYear), checkTabName.push(nowYear + '年');
|
|
} else if (objParam.currentTabId === '3') { // 选中去年
|
|
let lastYear = new Date().getFullYear() - 1;
|
|
checkTabId.push('year-' + lastYear), checkTabName.push(lastYear + '年');
|
|
}
|
|
|
|
if (objParam.type === 3) { // 运输车量-派车详情
|
|
checkTabId.push('type-1'), checkTabName.push('车辆');
|
|
} else if (objParam.type === 4) { // 吊车量-派车详情
|
|
checkTabId.push('type-2'), checkTabName.push('吊车');
|
|
} else if (objParam.type === 5) { // 已付款金额-派车详情
|
|
if (!objParam.notUse) {
|
|
checkTabId.push('pay-1'), checkTabName.push('已付款');
|
|
}
|
|
} else if (objParam.type === 6) { // 待付款金额-派车详情
|
|
if (!objParam.notUse) {
|
|
checkTabId.push('pay-2'), checkTabName.push('未付款');
|
|
}
|
|
}
|
|
for (let i = 0; i < checkTabId.length; i++) {
|
|
let strArr = checkTabId[i].split('-');
|
|
if (strArr[0] === 'year') {
|
|
checkTab('demo3', checkTabId[i]);
|
|
} else if (strArr[0] === 'type') {
|
|
checkTab('demo6', checkTabId[i]);
|
|
} else if (strArr[0] === 'pay') {
|
|
checkTab('demo5', checkTabId[i]);
|
|
}
|
|
active.tagAdd(checkTabName[i], checkTabId[i]);
|
|
}
|
|
function checkTab(name, checkTabId) {
|
|
$('#' + name + ' button').each(function () {
|
|
let layId = $(this).attr('lay-id');
|
|
if (checkTabId === layId) {
|
|
$(this).addClass('checkBtn');;
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
// 设置搜索条件
|
|
function setSearch(type) {
|
|
let html = "";
|
|
if (type === 1) { // 工程详情
|
|
html += "<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='proName' id='proName' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入工程名称' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>";
|
|
} else if (type === 2) { // 需求计划详情
|
|
html += "<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='code' id='code' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入计划编号' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='supName' id='supName' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入供应商名称' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='proName' id='proName' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入工程名称' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>";
|
|
} else if (type === 3 || 4 || 5 || 6) { // 派车详情
|
|
html += "<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='code' id='code' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入计划编号' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='name' id='name' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入名称' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='model' id='model' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入规格' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='supName' id='supName' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入供应商' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>" +
|
|
"<div class='layui-inline'>" +
|
|
"<div class='layui-input-inline' style='width: 200px;'>" +
|
|
"<input type='text' name='proName' id='proName' autocomplete='off' class='layui-input' lay-affix='clear' placeholder='输入工程名称' maxlength='30'>" +
|
|
"</div>" +
|
|
"</div>";
|
|
}
|
|
$('#search-btn').before(html);
|
|
} |