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');
    })
}