418 lines
16 KiB
JavaScript
418 lines
16 KiB
JavaScript
let form, laydate, flow, layer, rightPopup;
|
|
let pageNum = 1, pageSize = 15; // 图片定义分页
|
|
let pageNum2 = 1, pageSize2 = 2; // 列表定义分页
|
|
let queryType = 2; // 默认图片
|
|
let objParams = {},highSearchData = {};
|
|
function setParams(obj) {
|
|
objParams = JSON.parse(obj);
|
|
layui.config({
|
|
base: "../../js/layui-v2.9.14/layui/", //此处路径请自行处理, 可以使用绝对路径
|
|
}).extend({
|
|
rightPopup: "rightPopup",
|
|
}).use(["form", 'laydate', 'flow', 'layer', 'rightPopup'], function () {
|
|
form = layui.form;
|
|
laydate = layui.laydate;
|
|
flow = layui.flow;
|
|
layer = layui.layer;
|
|
rightPopup = layui.rightPopup;
|
|
initImgNum(objParams.proId);
|
|
dataFlow({
|
|
pageNum: pageNum,
|
|
pageSize: pageSize,
|
|
queryType: queryType,
|
|
id:objParams.proId
|
|
});
|
|
});
|
|
}
|
|
|
|
/**数据流加载*/
|
|
function dataFlow(queryParams) {
|
|
flow.load({
|
|
elem: '#ID-flow-demo', // 流加载容器
|
|
scrollElem: '#ID-flow-demo', // 滚动条所在元素，一般不用填，此处只是演示需要。
|
|
end: '数据加载完毕',
|
|
direction: 'bottom',
|
|
done: function (page, next) { // 执行下一页的回调
|
|
pageNum = page;
|
|
let lis = [];
|
|
let returnData = loadData(queryParams);
|
|
if (returnData != null) {
|
|
if (queryType === 2) { // 图片
|
|
lis = initImgData(returnData.data.list)
|
|
} else { // 列表
|
|
lis = initListData(returnData.data.list)
|
|
}
|
|
next(lis.join(''), page < returnData.data.total / (queryType === 2 ? pageSize : pageSize2));
|
|
if (queryType === 2) {
|
|
$('.img-info').on('mouseenter', function () {
|
|
this.querySelector('.hidden-actions').style.display = 'block';
|
|
});
|
|
$('.img-info').on('mouseleave', function () {
|
|
this.querySelector('.hidden-actions').style.display = 'none';
|
|
});
|
|
} else {
|
|
$('.img-data').on('mouseenter', function () {
|
|
this.querySelector('.hidden-actions2').style.display = 'block';
|
|
});
|
|
$('.img-data').on('mouseleave', function () {
|
|
this.querySelector('.hidden-actions2').style.display = 'none';
|
|
});
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
/**加载图片数据*/
|
|
function loadData(queryParams) {
|
|
let returnData = null;
|
|
let url = null;
|
|
let obj = queryParams;
|
|
if (queryType === 2) { // 图片
|
|
url = dataUrl + "/backstage/synthesisQuery/getImgList";
|
|
} else { // 列表
|
|
url = dataUrl + "/backstage/synthesisQuery/getListData";
|
|
}
|
|
let params = {
|
|
encryptedData: encryptCBC(JSON.stringify(obj))
|
|
}
|
|
ajaxRequest(url, "POST", params, false, function () {
|
|
}, function (result) {
|
|
if (result.status === 200) {
|
|
console.log(result)
|
|
returnData = result;
|
|
} else {
|
|
layer.msg(result.msg, {icon: 2})
|
|
}
|
|
}, function (xhr) {
|
|
error(xhr)
|
|
});
|
|
return returnData;
|
|
}
|
|
|
|
/**渲染图片*/
|
|
function initImgData(list) {
|
|
let htmlArr = [];
|
|
if (list && list.length > 0) {
|
|
$.each(list, function (index, item) {
|
|
let filePath = imgUrl + item.compressFilePath + "?token=" + tokens
|
|
htmlArr.push("<div class='img-info'>" +
|
|
" <div class='imgData layout'>\n" +
|
|
" <img src='" + filePath + "'>" +
|
|
" </div>" +
|
|
" <div class='imgData2 layout'>" +
|
|
" <p>" + item.uploadTime + "</p>" +
|
|
" <p class='img-color" + (item.uploadType) + "'>" + item.uploadTypeName + "</p>" +
|
|
" </div>" +
|
|
" <div class='imgData3 layout'>" +
|
|
" <p>" + setSourceTypeName(item) + "</p>" +
|
|
setCollectData(item) +
|
|
" </div>" +
|
|
" <div class='hidden-actions'><div class='hidden-btn layout'>" +
|
|
" <div class='layout' onclick='viewImg(" + JSON.stringify(item) + ")'><div class='img-view' title='放大'></div></div>" +
|
|
" <div class='layout' onclick='imgDownLoad(" + JSON.stringify(item) + ",1)'><div title='原图下载' class='img-download'></div></div>" +
|
|
" <div class='layout' onclick='generateWatermark(" + JSON.stringify(item) + ")'><div title='水印下载' class='img-water'></div></div>" +
|
|
setCollectImg(item) +
|
|
" </div></div>" +
|
|
" </div>");
|
|
})
|
|
}
|
|
return htmlArr;
|
|
|
|
|
|
// 设置收藏按钮
|
|
function setCollectImg(item) {
|
|
if (item.collectStatus === '0') {
|
|
return "<div collectStatus=" + item.collectStatus + " class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",0)'><div title='收藏' class='img-collect'></div></div>" +
|
|
"<div style='display: none;' collectStatus=" + item.collectStatus + " class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",1)'><div title='取消收藏' class='img-collect-check'></div></div>";
|
|
} else {
|
|
return "<div style='display: none;' collectStatus=" + item.collectStatus + " class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",0)'><div title='收藏' class='img-collect'></div></div>" +
|
|
"<div collectStatus=" + item.collectStatus + " class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",1)'><div title='取消收藏' class='img-collect-check'></div></div>";
|
|
}
|
|
}
|
|
|
|
// 设置收藏图标
|
|
function setCollectData(item) {
|
|
if (item.collectStatus === '1') {
|
|
return "<img src='../../img/synthesisQuery/collect_check.png'>";
|
|
}
|
|
return "<img style='display:none;' src='../../img/synthesisQuery/collect_check.png'>";
|
|
}
|
|
|
|
// 设置标题
|
|
function setSourceTypeName(item) {
|
|
if (item.sourceType === '9') {
|
|
return item.title;
|
|
} else {
|
|
return item.sourceTypeName.split('-')[1];
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
/**1.图片 2.列表*/
|
|
function changeType(that, type) {
|
|
let queryParams = {
|
|
pageNum: pageNum,
|
|
pageSize: pageSize,
|
|
queryType: queryType,
|
|
id:objParams.proId
|
|
}
|
|
if (type === 2) {
|
|
$(that).attr('src', '../../img/synthesisQuery/photo_check.png');
|
|
$(that).next().attr('src', '../../img/synthesisQuery/list.png');
|
|
} else {
|
|
$(that).attr('src', '../../img/synthesisQuery/list_check.png');
|
|
$(that).prev().attr('src', '../../img/synthesisQuery/photo.png');
|
|
queryParams.pageNum = pageNum2;
|
|
queryParams.pageSize = pageSize2;
|
|
}
|
|
queryType = type;
|
|
resetData();
|
|
searchData(queryParams);
|
|
}
|
|
/**渲染列表图片*/
|
|
function initListData(list) {
|
|
let htmlArr = [];
|
|
if (list && list.length > 0) {
|
|
$.each(list, function (index, item) {
|
|
let html = "<div class='list-info'>" +
|
|
" <div class='info-data layout'>" +
|
|
" <p>" + item.vioDate + "</p>" +
|
|
" <p class='img-color" + (item.uploadType) + "'>" + item.uploadTypeName + "</p>" +
|
|
" </div>" +
|
|
setBasicInfo(item) +
|
|
" </div>"
|
|
console.log(html)
|
|
htmlArr.push(html);
|
|
})
|
|
}
|
|
return htmlArr;
|
|
|
|
/**设置安全违章\质量检测\安全措施落实\协调照片\重要事项及宣传类*/
|
|
function setBasicInfo(item) {
|
|
let html = '';
|
|
if (item.uploadType === '1') { // 安全违章
|
|
html += "<div class='info-data2 layout'>" +
|
|
"<p>违章地点：</p>" +
|
|
"<p>" + item.vioPlace + "</p>" +
|
|
"</div>" +
|
|
"<div class='info-data2 layout'>" +
|
|
"<p>违章描述：</p>" +
|
|
"<p>"+item.vioDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList) +
|
|
"</div>" +
|
|
setRectData(item);
|
|
} else if (item.uploadType === '2') { // 质量检测
|
|
html += "<div class='info-data2 layout'>" +
|
|
"<p>检查地点</p>" +
|
|
"<p>"+item.vioPlace+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-data2 layout'>" +
|
|
"<p>检查描述：</p>" +
|
|
"<p>"+item.vioDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList) +
|
|
"</div>" +
|
|
setRectData(item);
|
|
} else if (item.uploadType === '3') { // 安全措施落实
|
|
html += "<div class='info-data2 layout'>" +
|
|
"<p>检查地点</p>" +
|
|
"<p>"+item.vioPlace+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-data2 layout'>" +
|
|
"<p>检查描述：</p>" +
|
|
"<p>"+item.vioDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList) +
|
|
"</div>";
|
|
} else if (item.uploadType === '4') { // 协调照片
|
|
html += "<div class='info-data2 layout'>" +
|
|
"<p>建设前描述</p>" +
|
|
"<p>"+item.buildBeforeDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList) +
|
|
"</div>" +
|
|
"<div class='info-data2 layout'>" +
|
|
"<p>建设中描述：</p>" +
|
|
"<p>"+item.buildUnderDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList2) +
|
|
"</div>" +
|
|
"<div class='info-data2 layout'>" +
|
|
"<p>恢复后描述：</p>" +
|
|
"<p>"+item.buildAfterDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList3) +
|
|
"</div>";
|
|
|
|
} else if (item.uploadType === '5') { // 重要事项及宣传类
|
|
html += "<div class='info-data2 layout'>" +
|
|
"<p>标题</p>" +
|
|
"<p>"+item.title+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-data2 layout'>" +
|
|
"<p>内容：</p>" +
|
|
"<p>"+item.content+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList) +
|
|
"</div>";
|
|
}
|
|
return html;
|
|
|
|
function setImgData(obj,list) {
|
|
let cent = '';
|
|
$.each(list, function (index, item) {
|
|
item.proName = obj.proName;
|
|
let filePath = imgUrl + item.compressFilePath + "?token=" + tokens
|
|
cent += "<div class='img-data'>" +
|
|
"<img src=" + filePath + ">" +
|
|
"<div class='hidden-actions2'><div class='hidden-btn layout'>" +
|
|
"<div class='layout' onclick='viewImg(" + JSON.stringify(item) + ")'><div class='img-view' title='放大'></div></div>" +
|
|
"<div class='layout' onclick='imgDownLoad(" + JSON.stringify(item) + ",1)'><div title='原图下载' class='img-download'></div></div>" +
|
|
"<div class='layout' onclick='generateWatermark(" + JSON.stringify(item) + ")'><div title='水印下载' class='img-water'></div></div>" +
|
|
setCollectImg(item) +
|
|
"</div></div>" +
|
|
"</div>";
|
|
})
|
|
return cent;
|
|
}
|
|
|
|
/**设置整改数据*/
|
|
function setRectData(item) {
|
|
let cent2 = '';
|
|
if (item.rectStatus === '1') { // 已整改
|
|
cent2 += "<div class='info-data2 layout'>" +
|
|
"<p>整改说明：</p>" +
|
|
"<p>"+item.rectDesc+"</p>" +
|
|
"</div>" +
|
|
"<div class='info-img'>" +
|
|
setImgData(item,item.photoList2) +
|
|
"</div>";
|
|
}
|
|
return cent2;
|
|
}
|
|
}
|
|
|
|
|
|
// 设置收藏按钮
|
|
function setCollectImg(item) {
|
|
if (item.collectStatus === '0') {
|
|
return "<div class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",0)'><div title='收藏' class='img-collect'></div></div>" +
|
|
"<div style='display: none;' class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",1)'><div title='取消收藏' class='img-collect-check'></div></div>";
|
|
} else {
|
|
return "<div style='display: none;' class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",0)'><div title='收藏' class='img-collect'></div></div>" +
|
|
"<div class='layout' onclick='collectImg(this," + JSON.stringify(item) + ",1)'><div title='取消收藏' class='img-collect-check'></div></div>";
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
/**收藏*/
|
|
function collectImg(that, item, type) {
|
|
if (type === 0) { // 收藏
|
|
let flag = collectData({
|
|
collectType: 1,
|
|
id: item.id
|
|
});
|
|
if (flag) {
|
|
$(that).next().removeAttr("style");
|
|
$(that).css({'display': 'none'})
|
|
$(that).parent().parent().prev().find('img').eq(0).removeAttr('style')
|
|
layer.msg("收藏成功",{icon:1})
|
|
}else{
|
|
layer.msg("收藏失败",{icon:2})
|
|
}
|
|
|
|
} else if (type === 1) { // 取消收藏
|
|
let flag = collectData({
|
|
collectType: 2,
|
|
id: item.id
|
|
});
|
|
if (flag) {
|
|
$(that).prev().removeAttr("style");
|
|
$(that).css({'display': 'none'});
|
|
$(that).parent().parent().prev().find('img').eq(0).css({'display': 'none'})
|
|
layer.msg("取消收藏成功",{icon:1})
|
|
}else{
|
|
layer.msg("取消收藏失败",{icon:2})
|
|
}
|
|
}
|
|
}
|
|
|
|
/**高级筛选*/
|
|
function highSearch() {
|
|
highSearchData.type = 1;
|
|
rightPopup.rightPopupLayer("../../pages/synthesisQuery/highSearchForm.html", JSON.stringify(highSearchData), ["50%", "100%"]);
|
|
}
|
|
|
|
/**标题查询*/
|
|
function titleSearch() {
|
|
highSearchData = {};
|
|
resetData();
|
|
let queryParams = {
|
|
pageNum: pageNum,
|
|
pageSize: pageSize,
|
|
queryType: queryType,
|
|
searchType: 1,
|
|
keyWord: $('#keyWord').val(),
|
|
id:objParams.proId
|
|
}
|
|
searchData(queryParams);
|
|
}
|
|
|
|
|
|
/*图片类型查询*/
|
|
function queryByType(that, type) {
|
|
resetData();
|
|
if(queryType === 2){
|
|
highSearchData = {};
|
|
$(that).addClass('type-num-check');
|
|
let queryParams = {
|
|
pageNum: pageNum,
|
|
pageSize: pageSize,
|
|
queryType: queryType,
|
|
searchType: 2,
|
|
uploadType: type,
|
|
id:objParams.proId
|
|
}
|
|
searchData(queryParams);
|
|
}
|
|
}
|
|
|
|
/**高级筛选数据*/
|
|
function highSearchValue(obj) {
|
|
resetData();
|
|
highSearchData = JSON.parse(obj);
|
|
let queryParams = Object.assign(highSearchData, {})
|
|
queryParams.pageNum = pageNum;
|
|
queryParams.pageSize = pageSize;
|
|
queryParams.queryType = queryType;
|
|
queryParams.searchType = 3;
|
|
queryParams.id = objParams.proId;
|
|
dataFlow(queryParams);
|
|
}
|
|
|
|
// 查询数据
|
|
function searchData(queryParams) {
|
|
$('#ID-flow-demo').empty();
|
|
dataFlow(queryParams);
|
|
}
|
|
|
|
/**重置基本数据*/
|
|
function resetData() {
|
|
pageNum = 1;
|
|
pageNum2 = 1;
|
|
$('.type-num').each(function () {
|
|
$(this).removeClass('type-num-check');
|
|
})
|
|
}
|