425 lines
17 KiB
JavaScript
425 lines
17 KiB
JavaScript
var table,form,layer,laydate,element;
|
||
var currentDate = new Date();
|
||
var tabList=[];
|
||
var month = currentDate.getMonth() + 1;//当前第几月
|
||
var year = currentDate.getFullYear();
|
||
var orders="";
|
||
layui.use(['form','layer','table','laydate','element'], function () {
|
||
table = layui.table;
|
||
form = layui.form;
|
||
layer = layui.layer;
|
||
laydate = layui.laydate;
|
||
element = layui.element;
|
||
// 渲染时间选择器
|
||
laydate.render({
|
||
elem:'#month', //指定元素 元素选择器
|
||
type:'month', //选择时间类型 可选值:year(年) month(年月) date(年月日) time(时分秒) datetime(年月日时分秒)
|
||
trigger:'click',
|
||
format: 'yyyy-MM',
|
||
btns:['now','confirm'], //选择框右下角显示的按钮 清除-现在-确定
|
||
value: formatCurrentMonth(), // 如果你想预设当前日期为选中状态
|
||
done: function (value, date) {//时间回调
|
||
console.log("date:", date)
|
||
init(date.year,date.month);
|
||
}
|
||
});
|
||
|
||
$("#queryBt").click(function(){
|
||
var keyword = $('#keyword').val();
|
||
let json = {
|
||
"keyword": keyword
|
||
}
|
||
// 对表格进行重载。id 即 table表格的id
|
||
table.reload('table', {
|
||
// //设定异步数据接口的额外参数
|
||
page:{curr : 1}
|
||
,where: json
|
||
})
|
||
})
|
||
|
||
//排序方式下拉选监听
|
||
form.on('select(sortType)', function(data){
|
||
// data.value得到被选中的值
|
||
// alert(data.value); // 输出：0, 1, 2, 3
|
||
if(data.value==1){
|
||
orders=" order by createTime desc"
|
||
}else if(data.value==2){
|
||
orders=" order by state desc"
|
||
}else if(data.value==3){
|
||
orders=" order by state asc"
|
||
}
|
||
});
|
||
|
||
|
||
|
||
$("#reset").click(function(){
|
||
$('#keyword').val('');
|
||
let json = {
|
||
"keyword": ''
|
||
}
|
||
// 对表格进行重载。id 即 table表格的id
|
||
table.reload('table', {
|
||
// //设定异步数据接口的额外参数
|
||
page:{curr : 1}
|
||
,where: json
|
||
})
|
||
})
|
||
|
||
|
||
init(year,month)
|
||
setData(null)
|
||
|
||
$("#displayType>div").click(function(){
|
||
$("#displayType>div").removeClass("displayTypeDivClick");
|
||
$(this).addClass("displayTypeDivClick");
|
||
|
||
var text = $(this).text();
|
||
if(text == "照片视图"){
|
||
$("#inspectionTourContent").css("display", "")
|
||
$("#inspectionTourList").css("display", "none")
|
||
}
|
||
if(text == "列表显示"){
|
||
$("#inspectionTourContent").css("display", "none")
|
||
$("#inspectionTourList").css("display", "")
|
||
initTable();
|
||
}
|
||
})
|
||
});
|
||
|
||
|
||
// 静态数据
|
||
|
||
/**
|
||
* 初始化表格数据
|
||
*/
|
||
function initTable(){
|
||
// 渲染表格
|
||
table.render({
|
||
elem: '#table',
|
||
url: PATH_URL + "/workvisa/getList",
|
||
page: true,
|
||
where:{
|
||
proId:localStorage.getItem("resultVisaProId"),
|
||
makeMonth:localStorage.getItem("resultVisaMakeMonth"),orders:orders
|
||
},
|
||
method:'post',
|
||
skin: 'line', // 表格样式
|
||
cols: [[
|
||
{
|
||
title: '序号',
|
||
field: 'zizeng',
|
||
align: 'center',
|
||
type: 'numbers',
|
||
},
|
||
{field:'gtName', title: '杆塔名称',align: 'center'},
|
||
{field:'oneUserName', title: '护线员第一次巡视',align: 'center'},
|
||
{field:'oneMakeTime', title: '巡视日期第一次巡视',align: 'center'},
|
||
{field:'twoUserName', title: '护线员第二次巡视',align: 'center'},
|
||
{field:'twoMakeTime', title: '巡视日期第二次巡视',align: 'center'},
|
||
]],
|
||
// data: tableData
|
||
});
|
||
|
||
}
|
||
|
||
function formatCurrentMonth() {
|
||
var date = new Date();
|
||
var month = date.getMonth() + 1; // 注意月份是从0开始的，所以加1
|
||
return date.getFullYear() + '-' + (month < 10 ? '0' + month : month);
|
||
}
|
||
/**
|
||
* 初始化数据
|
||
*/
|
||
function init(chosenYear,chosenMonth){
|
||
layui.use(['table'], function () {
|
||
getView(chosenYear, chosenMonth)
|
||
|
||
})
|
||
}
|
||
|
||
|
||
function getView(){
|
||
// ①已上传：展示修改、删除图标，上传日期不可选择，照片信息，杆塔号；颜色为“#52C1F5”；
|
||
// ②未上传：展示上传图标，上传日期可选择，杆塔号，颜色为“#F56C6C”；
|
||
// ③巡护段外：展示修改、删除图标，上传日期不可选择，照片信息，工程名称，杆塔号；颜色为“#FF9900”；
|
||
// ④特巡/值守：展示修改、删除图标，上传日期不可选择，照片信息，备注；颜色为“#73A0FA”；
|
||
// ⑤正在编辑：修改图标绿色背景，可重新上传照片、重新选择日期，编辑即边框闪烁；
|
||
$.ajax({//id获取详情打开弹窗传值子页面
|
||
type: 'post',
|
||
url: PATH_URL + "/workvisa/getVisitationDetail",
|
||
dataType: 'json',
|
||
async:false,
|
||
data: {
|
||
proId:localStorage.getItem("resultVisaProId"),
|
||
makeMonth:localStorage.getItem("resultVisaMakeMonth")
|
||
},
|
||
success: function (data) {
|
||
console.log(data,"result");
|
||
viewList1=data.mgtListone;
|
||
photoList1=data.vgtListone;
|
||
viewList2=data.mgtListtwo;
|
||
photoList2=data.vgtListtwo;
|
||
viewList3=data.mgtListspe;
|
||
photoList3=data.mgtListspe;
|
||
|
||
},
|
||
error:function(e){
|
||
|
||
}
|
||
})
|
||
|
||
$("#inspectionTourContent").empty();
|
||
//杆塔集合
|
||
// viewList1 = [{id:"1",name:"#1"},{id:"2",name:'#2'},{id:"3",name:'#3'},{id:"4",name:'#4'},{id:"5",name:'#5'},{id:"6",name:'#6'},
|
||
// {id:"7",name:'#7'},{id:"8",name:'#8'},{id:"9",name:'#9'}]
|
||
// //照片集合
|
||
var filePath = 'http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/c0a62f0b51924a4584ec0c8f011fc2af0074P3wTgy1h3gtizuzvfj30zk0zg7ad.jpg';
|
||
var sFilePath='../../../image/viewImg.jpg';
|
||
// photoList1 = [{name:'#2', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},{name:'#3', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},
|
||
// {name:'#4', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},{name:'#5', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},
|
||
// {name:'#6', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'}]
|
||
|
||
let html = ``;
|
||
html += `<div style="width: 90%;height: 30px;font-weight: bold;">
|
||
<span style="border: 3px solid #409EFF;width: 20px;height: 10px;margin-left: 2%;margin-right: 1%;"></span>
|
||
<span style="color:#666666">正常巡视-第一次巡视</span>
|
||
<span style="color:#F56C6C">(负责的巡护区段杆塔)</span>
|
||
<span style="color:#999999">注：若需上传负责区域之外的杆塔，请点击</span>
|
||
<span style="color:#0000FF;cursor: pointer;" onclick="patrolOutsideAdd()">巡护段外上传>></span>
|
||
</div>
|
||
<div id="firstViewBox" style="width: 100%;min-height: 200px;margin-bottom: 20px;display: flex;flex-wrap: wrap;">`
|
||
for (let i = 0;i < viewList1.length;i++) {
|
||
var gtName = viewList1[i].gtName.length>4?viewList1[i].gtName.substring(0,4) + '...': viewList1[i].gtName;
|
||
html += `<div class="viewBox">
|
||
<div style="width: 100%;height:100%">`
|
||
if("1"==viewList1[i].makeType){
|
||
html +=`<div class="viewHeader" style="background-color: #FF9900;">`
|
||
}else{
|
||
html +=`<div class="viewHeader">`
|
||
}
|
||
html += `<img src="../../../image/tower_white.png" alt="">
|
||
<span style="width: 33%;" title="${viewList1[i].gtName}">${gtName}</span>
|
||
</div>
|
||
<div class="viewContent">`
|
||
var flag = false;
|
||
for (var j = 0; j < photoList1.length; j++) {
|
||
if(viewList1[i].gtId == photoList1[j].gtId){
|
||
//照片存在，直接显示
|
||
html += `<img src="${IMG_URL+photoList1[j].sfilePath}" alt="" onclick="filePreView('${IMG_URL+photoList1[j].filePath}')">`
|
||
flag = true;
|
||
break;
|
||
}
|
||
}
|
||
if(!flag){
|
||
//照片不存在，显示上传照片按钮
|
||
html += `<img src="../../../image/add2.png" style="width:150px;height:150px;border: 1px solid #E9E9E9;backgroubd:#F9F9F9;cursor: pointer;margin-top: 10px;" alt="" onclick="uploadPhoto(${viewList1[i].gtId},1,${viewList1[i].makeType})">
|
||
<div style="color:#cccccc">上传图片</div>`
|
||
}
|
||
html += `<div style="display: none;align-items: center;justify-content: center;position: relative;top:-100%;width:100%;height:100%;z-index:99;background-color: rgba(0,0,0,.2)">
|
||
<button class="layui-btn" onclick="uploadPhoto(${viewList1[i].gtId},1,${viewList1[i].makeType})">
|
||
<i class="layui-icon layui-icon-refresh-3"></i>
|
||
重新上传
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<div class="viewFooter">
|
||
<img src="../../../image/calendarIcon.png" width="18"> `
|
||
for (var j = 0; j < photoList1.length; j++) {
|
||
if(viewList1[i].gtId == photoList1[j].gtId){
|
||
//照片存在，直接显示
|
||
html += `${photoList1[j].makeTime}`
|
||
break;
|
||
}
|
||
}
|
||
html +=`</div>
|
||
</div>
|
||
|
||
</div>`
|
||
}
|
||
html += `</div>`;
|
||
|
||
// viewList2 = [{id:"1",name:"#1"},{id:"2",name:'#2'},{id:"3",name:'#3'},{id:"4",name:'#4'},{id:"5",name:'#5'},{id:"6",name:'#6'},
|
||
// {id:"7",name:'#7'},{id:"8",name:'#8'},{id:"9",name:'#9'}]
|
||
// photoList2 = [{name:'#2', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},{name:'#3', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},
|
||
// {name:'#4', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},{name:'#5', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},
|
||
// {name:'#6', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'}]
|
||
html += `<div style="width: 90%;height: 30px;font-weight: bold;">
|
||
<span style="border: 3px solid #409EFF;width: 20px;height: 10px;margin-left: 2%;margin-right: 1%;"></span>
|
||
<span style="color:#666666">正常巡视-第二次巡视</span>
|
||
<span style="color:#F56C6C">(负责的巡护区段杆塔)</span>
|
||
</div>
|
||
<div id="secondViewBox" style="width: 100%;min-height: 200px;margin-bottom: 20px;display: flex;flex-wrap: wrap;">`
|
||
for (let i = 0;i < viewList2.length;i++) {
|
||
var gtName = viewList2[i].gtName.length>4?viewList2[i].gtName.substring(0,4) + '...': viewList2[i].gtName;
|
||
html += `<div class="viewBox">
|
||
<div style="width: 100%;height:100%">
|
||
`
|
||
if("1"==viewList2[i].makeType){
|
||
html +=`<div class="viewHeader" style="background-color: #FF9900;">`
|
||
}else{
|
||
html +=`<div class="viewHeader">`
|
||
}
|
||
html += `
|
||
<img src="../../../image/tower_white.png" alt="">
|
||
<span style="width: 33%;" title="${viewList2[i].gtName}">${gtName}</span>
|
||
</div>
|
||
<div class="viewContent">`
|
||
var flag = false;
|
||
for (var j = 0; j < photoList2.length; j++) {
|
||
if(viewList2[i].gtId == photoList2[j].gtId){
|
||
//照片存在，直接显示
|
||
html += `<img src="${IMG_URL+photoList2[j].sfilePath}" alt="" onclick="filePreView('${IMG_URL+photoList2[j].filePath}')">`
|
||
flag = true;
|
||
break;
|
||
}
|
||
}
|
||
if(!flag){
|
||
//照片不存在，显示上传照片按钮
|
||
html += `<img src="../../../image/add2.png" style="width:150px;height:150px;border: 1px solid #E9E9E9;backgroubd:#F9F9F9;cursor: pointer;margin-top: 10px;" alt="" onclick="uploadPhoto(${viewList2[i].gtId},2,${viewList2[i].makeType})">
|
||
<div style="color:#cccccc">上传图片</div>`
|
||
}
|
||
html += `<div style="display: none;align-items: center;justify-content: center;position: relative;top:-100%;width:100%;height:100%;z-index:99;background-color: rgba(0,0,0,.2)">
|
||
<button class="layui-btn" onclick="uploadPhoto(${viewList2[i].gtId},2,${viewList2[i].makeType})>
|
||
<i class="layui-icon layui-icon-refresh-3"></i>
|
||
重新上传
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<div class="viewFooter">
|
||
<img src="../../../image/calendarIcon.png" width="18"> `
|
||
for (var j = 0; j < photoList2.length; j++) {
|
||
if(viewList2[i].gtId == photoList2[j].gtId){
|
||
//照片存在，直接显示
|
||
html += `${photoList2[j].makeTime}`
|
||
break;
|
||
}
|
||
}
|
||
html +=`
|
||
</div>
|
||
</div>
|
||
</div>`
|
||
}
|
||
html += `</div>`;
|
||
|
||
|
||
|
||
// viewList3 = [{id:"1",name:"#1"},{id:"2",name:'#2'},{id:"3",name:'#3'},{id:"4",name:'#4'},{id:"5",name:'#5'},{id:"6",name:'#6'},
|
||
// {id:"7",name:'#7'},{id:"8",name:'#8'},{id:"9",name:'#9'}]
|
||
// photoList3 = [{name:'#2', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},{name:'#3', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},
|
||
// {name:'#4', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},{name:'#5', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'},
|
||
// {name:'#6', filePath:filePath,sFilePath:sFilePath,makeTime:'2024-08-19'}]
|
||
html += `<div style="width: 90%;height: 30px;font-weight: bold;">
|
||
<span style="border: 3px solid #409EFF;width: 20px;height: 10px;margin-left: 2%;margin-right: 1%;"></span>特巡 / 值守
|
||
</div>
|
||
<div style="width: 94%;height: 150px;overflow: auto;margin-left: 1.8%;">
|
||
<table id="isWorkList" class="layui-table" lay-skin="row" style="width:100%;"></table>
|
||
</div>
|
||
<div id="specialViewBox" style="width: 100%;min-height: 200px;margin-bottom: 20px;display: flex;flex-wrap: wrap;">`
|
||
for (let i = 0;i < viewList3.length;i++) {
|
||
var gtName = viewList3[i].gtName.length>11?viewList3[i].gtName.substring(0,11) + '...': viewList3[i].gtName;
|
||
html += `<div class="viewBox">
|
||
<div style="width: 100%;height:100%">
|
||
<div class="viewHeader" style="font-size:12px">
|
||
<img src="../../../image/tower_white.png" alt="">
|
||
<span style="width: 33%;" title="${viewList3[i].gtName}">${gtName}</span>
|
||
</div>
|
||
<div class="viewContent">
|
||
`
|
||
var flag = false;
|
||
for (var j = 0; j < photoList3.length; j++) {
|
||
if(viewList3[i].gtId == photoList3[j].gtId){
|
||
//照片存在，直接显示
|
||
html += `<img src="${IMG_URL+photoList3[j].sfilePath}" alt="" onclick="filePreView('${IMG_URL+photoList3[j].filePath}')">`
|
||
flag = true;
|
||
break;
|
||
}
|
||
}
|
||
if(!flag){
|
||
//照片不存在，显示上传照片按钮
|
||
html += `<img src="../../../image/add2.png" style="width:150px;height:150px;border: 1px solid #E9E9E9;backgroubd:#F9F9F9;cursor: pointer;margin-top: 10px;" alt="" ">
|
||
<div style="color:#cccccc">上传图片</div>`
|
||
}
|
||
html += `
|
||
<div style="display: none;align-items: center;justify-content: center;position: relative;top:-100%;width:100%;height:100%;z-index:99;background-color: rgba(0,0,0,.2)">
|
||
<button class="layui-btn">
|
||
<i class="layui-icon layui-icon-refresh-3"></i>
|
||
重新上传
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<div class="viewFooter">
|
||
<img src="../../../image/calendarIcon.png" width="18">
|
||
`
|
||
for (var j = 0; j < photoList3.length; j++) {
|
||
if(viewList3[i].gtId == photoList3[j].gtId){
|
||
//照片存在，直接显示
|
||
html += `${photoList3[j].makeTime}`
|
||
break;
|
||
}
|
||
}
|
||
html +=`
|
||
</div>
|
||
</div>
|
||
|
||
</div>`
|
||
}
|
||
html += `</div>`;
|
||
$("#inspectionTourContent").append(html);
|
||
}
|
||
|
||
//页面赋值
|
||
function setData(data){
|
||
$.ajax({//id获取详情打开弹窗传值子页面
|
||
type: 'post',
|
||
url: PATH_URL + "/workvisa/getProjectDetail",
|
||
dataType: 'json',
|
||
data: {
|
||
proId:localStorage.getItem("resultVisaProId"),
|
||
makeMonth:localStorage.getItem("resultVisaMakeMonth")
|
||
},
|
||
success: function (data) {
|
||
$("#proName").text(data.data.proName);
|
||
$("#isTwo").text(data.data.isTwo==1?"双回路":"单回路");
|
||
$("#powerNum").text(data.data.powerNum);
|
||
$("#oneNum").text(data.data.oneNum);
|
||
$("#twoNum").text(data.data.twoNum);
|
||
$("#userNum").text(data.data.userNum);
|
||
},
|
||
error:function(e){
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
//文件查看
|
||
//查看附件详情
|
||
function filePreView(url) {
|
||
if(url != "" && url != null){
|
||
var suffix = url.split(".")[1];
|
||
if(suffix == "mp4"){
|
||
localStorage.setItem("filePath", url);
|
||
var height = '99%';
|
||
var width = '70%';
|
||
var index = parent.layer.open({
|
||
title: ["查看", 'color:#3B70A1;background-color:#E8ECEB;font-size:20px'],
|
||
type: 2,
|
||
content: '../../videoPlay.html',
|
||
area: [width, height],
|
||
maxmin: false
|
||
});
|
||
}else{
|
||
// localStorage.setItem("filePath", url);
|
||
// localStorage.setItem("fileName", fileName);
|
||
// localStorage.setItem("fileTime", time);
|
||
var height = '99%';
|
||
var width = '70%';
|
||
var index = parent.layer.open({
|
||
title: ["查看", 'color:#3B70A1;background-color:#E8ECEB;font-size:20px'],
|
||
type: 2,
|
||
content: '../../photoView.html',
|
||
area: [width, height],
|
||
maxmin: false
|
||
});
|
||
}
|
||
}
|
||
} |