洪水淹没

guoshilong

2023-02-27 4d8c6dd77427e8e581fda17b6b65ba86bfb7a815

 widgets/FloodAnalysis/Widget.js

@@ -2,7 +2,25 @@
// Copyright © 2022 guoshilong. All Rights Reserved.
// 模块描述:洪水淹没分析
///////////////////////////////////////////////////////////////////////////
define(['dojo/_base/declare', 'dojo/_base/lang', 'dojo/_base/array', 'dojo/_base/html', "dojo/topic", 'jimu/BaseWidget', 'dojo/on', 'dstore/Memory', 'dstore/Trackable', 'dgrid/Grid', 'dgrid/Keyboard', 'dgrid/Selection', 'dstore/RequestMemory', 'dgrid/test/data/createSyncStore', "libs/echarts/v4/echarts.min", 'libs/layer/layer.js', 'libs/turf/turf.min.js'], function (declare, lang, array, html, topic, BaseWidget, on, Memory, Trackable, Grid, Keyboard, Selection, RequestMemory, createSyncStore, echarts, layer, turf) {
define(['dojo/_base/declare',
    'dojo/_base/lang',
    'dojo/_base/array',
    'dojo/_base/html',
    "dojo/topic",
    'jimu/BaseWidget',
    'dojo/on',
    'dojo/mouse',
    'dstore/Memory',
    'dstore/Trackable',
    'dgrid/Grid',
    'dgrid/Keyboard',
    'dgrid/Selection',
    'dgrid/Editor',
    'dstore/RequestMemory',
    'dgrid/test/data/createSyncStore',
    "libs/echarts/v4/echarts.min",
    'libs/layer/layer.js',
    'libs/turf/turf.min.js'], function (declare, lang, array, html, topic, BaseWidget, on,mouse, Memory, Trackable, Grid, Keyboard, Selection,Editor, RequestMemory, createSyncStore, echarts, layer, turf) {
    return declare([BaseWidget], {
        baseClass: 'jimu-widget-FloodAnalysis',
        name: 'FloodAnalysis',
@@ -19,8 +37,12 @@
        smxSelect: null,
        //河段下拉列表
        hdDataList: [],
        //水面线下拉列表
        smxDataList:[],
        //洪水分析表格数据
        analysisTableList: [],
        dgridSelectEvent:null,
        currentSelectHistoryData:null,
        //历史风险图表格数据
        historyTableList: [
            {name: "5年洪水淹没图"},
@@ -31,60 +53,55 @@
        currentHd: null,
        //当前选中的水面线
        currentSmxcode: "",
        //水文站最近的点
        currentNearPoint:null,
        evaluateLayerIndex:"",
        //收起框打开状态
        isOpen: true,
        popupLayer: null,
        //api接口
        url: {
            riverwaySelectName: "http://localhost:82/blade-ycreal/riverway/selectName",
            waterlineSelectName: "http://localhost:82/blade-ycreal/waterline/selectName",
            childpage: "http://localhost:82/blade-ycreal/water/childpage",
            getCzByGlCodeByGlQdj: "http://localhost:82/blade-ycreal/waterline/getCzByGlCodeByGlQdj",
            getHistoryList: "",
            saveHistoryData: "",
            getRealTimeWaterByhdId: "http://localhost:82/blade-ycreal/waterline/getRealTimeWaterByhdId",
            getHistoryList: "http://localhost:82/blade-ycreal/inundationResult/list",
            saveHistoryData: "http://localhost:82/blade-ycreal/inundationResult/save",
            getCoordinatesMinQdj: "http://localhost:82/blade-ycreal/water/getCoordinatesMinQdj",
        },
        //弹出框索引，用来关闭弹出框
        popupIndex: "",
        evaluateData: [
            {
                name: "会昌县",
                name: "<0.5",
                house: 35,
                population: 175,
                area: 12.888,
                value: 50.123
            },
            {
                name: "于都县",
                name: "1.0-2.0",
                house: 70,
                population: 350,
                area: 24.456,
                value: 100.456
            },
            {
                name: "赣县",
                name: "2.0-3.0",
                house: 20,
                population: 100,
                area: 8.551,
                value: 39.789
            },
            {
                name: ">3.0",
                house: 70,
                population: 350,
                area: 24.6,
                value: 20.4
            }
        ],
        startup: function startup() {
            var self = this
            const self = this
            this.bindHtmlElement()
            //收起展开按钮点击事件
            $(".fold-btn").click(function () {
                if (self.isOpen) {
                    $(this).addClass('close')
                    $(this).removeClass('open')
                    $('.content').hide()
                    self.isOpen = false
                } else {
                    $(this).addClass('open')
                    $(this).removeClass('close')
                    $('.content').show()
                    self.isOpen = true
                }
            })

            //实时、预测改变事件
            $('input[type=radio][name=middleRadio]').change(function () {
                if (this.value == "realtime") {
@@ -99,15 +116,10 @@
            //开始分析按钮点击事件
            $('#start-analysis-btn').click(function () {
                if (self.currentHd && self.currentSmxcode) {
                    self.evaluatePopup()
                    self.drawWater('analysis')
                } else {
                    alert("请先选择河段和水面线")
                    layer.msg("请先选择河段和水面线")
                }
            })

            //历史风险图表格单选框改变事件
            $('input[type=radio][name=tableRadio]').change(function () {
                console.log(this.value)
            })

            //洪水淹没分析按钮点击事件
@@ -115,12 +127,14 @@
                self.analysisBtn.addClass('choose-button')
                self.analysisBtn.removeClass('unchoose-button')
                self.historyBtn.addClass('unchoose-button')
                self.historyBtn.removeClass('choose-button')
                self.divFloodHistory.hide()
                self.divFloodAnalysis.show()
                $('#history-pagination').hide()
                if (self.currentHd){
                    $('#analysis-pagination').show()
                }
                $('#search-name').val("")
            })

            //历史风险图按钮点击事件
@@ -128,12 +142,14 @@
                self.historyBtn.addClass('choose-button')
                self.historyBtn.removeClass('unchoose-button')
                self.analysisBtn.addClass('unchoose-button')
                self.analysisBtn.removeClass('choose-button')
                self.divFloodAnalysis.hide()
                self.divFloodHistory.show()
                $('#analysis-pagination').hide()
                $('#history-pagination').show()

                //获取历史数据
                self.getHistoryList()

            })

            //河段输入框聚焦、失焦、输入事件
@@ -143,15 +159,20 @@
            $('#hd-input').blur(function () {
                //隐藏域触发改变事件需要手动触发
                // $("#hd-select").val().change()
                //关闭分析窗口
                if (self.evaluateLayerIndex){
                    layer.close(self.evaluateLayerIndex)
                    self.evaluateLayerIndex = ""
                    $('#restore-icon').hide()
                }
                setTimeout(function(){//有bug 需要延迟执行隐藏
                    $("#hd-select").hide()
                },100)

                },300)
            })
            // 河道输入事件
            // 河段输入事件
            $('#hd-input').on("input", function () {
                var searchString = $('#hd-input').val()
                var filterArray = self.hdDataList.filter(e => {
                let searchString = $('#hd-input').val()
                let filterArray = self.hdDataList.filter(e => {
                    return e.riverway.indexOf(searchString) != -1
                })
                self.hdSelect.find("option").remove();//添加新值 删除旧值
@@ -161,41 +182,48 @@
            })

            //水位输入事件
            $('#sw-input').on("input", function () {
                self.getYcSub()
            $('#sw-input').on("input", function (e,v) {
                self.getSw($('#sw-input').val())
            })

            //河段选择框改变事件
            this.hdSelect.change(function () {
                $("#hd-input").val($(this).find("option:selected").text());
                var selected = JSON.parse($(this).val())
                let selected = JSON.parse($(this).val())
                // 设置站点信息
                $('#glzd').val(selected.stnm)
                $('#qdj').val(selected.gl_qdj.substring(0,selected.gl_qdj.length - 2))
                self.currentHd = selected
                // 获取水面线数据
                self.getSmxData(selected.river_code, selected.default_smx)
                // 获取最近起点距数据
                self.getMin(selected.default_smx,selected.gl_qdj)
                // 获取实时水位

                if (self.waterEntity)
                    self.map.entities.remove(self.waterEntity)
                //地图定位
                self.map.camera.flyTo({
                    destination: Cesium.Cartesian3.fromDegrees(selected.river_origin, selected.qd_lat, 50000),
                });


                self.hdSelect.hide()
            })

            //水面线选择框改变事件
            this.smxSelect.change(function () {
                var selected = $(this).val()
                let selected = $(this).val()
                self.getPointData(selected)
            })

            //水位输入框按下回车事件
            $('#sw-input').keypress(function (event) {
                if (event.which == 13) {
                    self.analysisTableList.forEach(e => {
                        e.sw = self.calculateSw(e.water, sw)
                    })
                    self.loadPagination(self.analysisTableList, "analysis-pagination")
                }
            })
            // //水位输入框按下回车事件
            // $('#sw-input').keypress(function (event) {
            //     if (event.which == 13) {
            //         self.analysisTableList.forEach(e => {
            //             e.sw = self.calculateSw(e.water, sw)
            //         })
            //         self.loadPagination(self.analysisTableList, "analysis-pagination")
            //     }
            // })

            //搜索按钮点击事件
            $('#search-button').click(function () {
@@ -207,9 +235,11 @@
                self.loadPagination(filterArray, "history-pagination")
            })

            $('#save-button').click(function () {
                self.confirmPopup()
                // self.floodAnalysisPopup()
            $('#restore-icon').click(function () {
                if (self.popupLayer){
                    self.popupLayer.show()
                    $(this).hide()
                }
            })
        },

@@ -234,16 +264,27 @@
            if (this.drawingPolyline)
                this.map.entities.remove(this.drawingPolyline);

            if (this.waterEntity)
                this.map.entities.remove(this.waterEntity)

            this.map.scene.globe.baseColor = Cesium.Color.WHITE;

            $('#hd-select option').remove()
            $('#smx-select option').remove()
            $('#sw-input').val("")
            $('#hd-input').val("")
            $('#flood-tbody').html("")
            //清空表格数据
            $('.analysis-box-list').empty();
            $('.history-box-list').empty();
            $('#analysis-pagination').hide()

            this.analysisTableList = []

            //关闭分析窗口
            if (this.evaluateLayerIndex){
                layer.close(this.evaluateLayerIndex)
                this.evaluateLayerIndex = ""
                $('#restore-icon').hide()
            }
        },

        onMinimize: function onMinimize() {
@@ -284,6 +325,11 @@
            $('.fold-btn').addClass('open')
            $('.fold-btn').removeClass('close')
            $('.content').show()
            $("#sw-input").prop('disabled', true);
            $('#search-name').val("")
            $('#glzd').val("")
            $('#qdj').val('')
            $('.restore-icon').hide()
            this.isOpen = true

            this.analysisBtn.addClass('choose-button')
@@ -293,7 +339,9 @@

            this.currentHd = null
            this.currentSmxcode = ""
            //获取河段数据
            this.getHdData()

        },

        //获取河段下拉数据
@@ -331,16 +379,19 @@
                },
                success: function (res) {
                    let data = res.data
                    self.smxDataList = data
                    self.smxSelect.find("option").remove();//添加新值 删除旧值
                    if (data.length <= 0) {
                        $('#flood-tbody').html("")
                        $('#analysis-pagination').hide()
                        self.deleteEntities(self.pointEntities)
                        if (self.drawingPolyline){
                            self.map.entities.remove(self.drawingPolyline);
                        }
                    }

                    data.forEach(e => {

                        self.smxSelect.append("<option value=" + e.smxcode + ">" + e.waterline + "</option>");

                        if (e.smxcode == defaultId) {
                            $("#smx-select option[value=" + e.smxcode + "] ").attr("selected", true)
                            self.smxSelect.trigger("change")
@@ -368,44 +419,54 @@
                success: function (res) {
                    if (res.code == 200) {
                        let data = res.data.records
                        self.deleteEntities(self.pointEntities)
                        // 水面线连线
                        let cartesians = []
                        for (let i = 0; i < data.length; i++) {
                            cartesians.push(new Cesium.Cartesian3.fromDegrees(data[i].lng, data[i].lat,data[i].sw))
                            let temp = self.map.entities.add({
                                position: Cesium.Cartesian3.fromDegrees(data[i].lng, data[i].lat,data[i].sw),
                                point: {
                                    color: Cesium.Color.RED,
                                    pixelSize: 11,
                                    //防止地形遮挡住点
                                    disableDepthTestDistance: Number.POSITIVE_INFINITY,
                                    heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
                                },
                            });
                            // 清空使用
                            self.pointEntities.push(temp)
                        }

                        // 先清空 后画线
                        if (self.drawingPolyline)
                            self.map.entities.remove(self.drawingPolyline);
                        let lineOpts = {
                            polyline: {
                                positions: cartesians,
                                clampToGround: true,
                                width: 3,
                                color: "#279a9a"
                            }
                        };
                        // 画线
                        self.drawingPolyline = self.map.entities.add(lineOpts);

                        self.createPointAndLine(data,self.pointEntities)
                        self.analysisTableList = data
                        self.getSub(self.currentHd.id, self.currentSmxcode)
                        self.getRealTimeWaterByhdId(self.currentHd.id)
                    }
                }
            });
        },

        //创建点线
        createPointAndLine(data,pointEntities){
            this.deleteEntities(pointEntities)
            // 水面线连线
            let cartesians = []
            for (let i = 0; i < data.length; i++) {
                cartesians.push(new Cesium.Cartesian3.fromDegrees(data[i].lng, data[i].lat,data[i].sw))
                let temp = this.map.entities.add({
                    position: Cesium.Cartesian3.fromDegrees(data[i].lng, data[i].lat,data[i].sw),
                    billboard:{
                        image: "./images/jiangshui_sq.png",
                        pixelOffset: new Cesium.Cartesian2(0, 0),
                        color: new Cesium.Color(20, 20, 0, 1),
                        width: 14,
                        height: 14,
                        heightReference : Cesium.HeightReference.CLAMP_TO_GROUND,
                        disableDepthTestDistance: Number.POSITIVE_INFINITY
                    }
                });
                // 清空使用
                pointEntities.push(temp)
            }
            //防止切换面板后渲染水面出错
            this.map.scene.globe.depthTestAgainstTerrain = true;

            // 先清空 后画线
            if (this.drawingPolyline){
                this.map.entities.remove(this.drawingPolyline);
            }
            let lineOpts = {
                polyline: {
                    positions: cartesians,
                    clampToGround: true,
                    width: 3,
                    color: "#279a9a"
                }
            };
            // 画线
            this.drawingPolyline = this.map.entities.add(lineOpts);

        },

        //获取历史风险图数据列表
@@ -419,14 +480,16 @@
                jsonpCallback: 'data',
                data: {
                    name: "",
                    pageSize:999999999,
                },
                success: function (res) {
                    if (res.code == 200) {
                        let data = res.data.records
                        if (self.popupIndex != "") {
                            layer.close(self.popupIndex)
                            self.popupIndex = ""
                        }
                        data.forEach(e=>{
                            e.smxVal = JSON.parse(e.smxVal)
                        })
                        self.historyTableList = data
                        self.loadPagination(data,"history-pagination")
                    }
                }
            });
@@ -446,76 +509,40 @@
            if (tableData.length <= 0 && pageElementId == "history-pagination") {
                $('#history-pagination').hide()
            }
            let pageSize = 11
            var count = Math.ceil(tableData.length / pageSize);
            var self = this
            let pageSize = 22
            let count = Math.ceil(tableData.length / pageSize);
            const self = this
            $('#' + pageElementId).pagination({
                mode: 'fixed',
                jump: true,
                coping: false,
                pageCount: count,
                callback: function (index) {
                    var listdata = [];
                    let listdata = [];
                    //显示页数
                    var index = (index.getCurrent() - 1) * pageSize;
                    for (var i = index; i < index + pageSize; i++) {
                    for (let i = index; i < index + pageSize; i++) {
                        listdata.push(tableData[i]);
                        if (i == tableData.length - 1) {
                            break;
                        }
                    }

                    pageElementId == "analysis-pagination" ? self.loadAnalysisTable(listdata) : self.loadHistoryTable(listdata)

                    pageElementId == "analysis-pagination" ? self.createList(listdata,"洪水淹没分析") : self.createList(listdata,"历史风险图")
                }
            });

            //首次加载前11条数据
            var startData = [];
            let startData = [];
            if (tableData.length > pageSize) {
                for (var i = 0; i < pageSize; i++) {
                for (let i = 0; i < pageSize; i++) {
                    startData.push(tableData[i]);
                }
            } else {
                for (var i = 0; i < tableData.length; i++) {
                for (let i = 0; i < tableData.length; i++) {
                    startData.push(tableData[i]);
                }
            }
            pageElementId == "analysis-pagination" ? self.loadAnalysisTable(startData) : self.loadHistoryTable(startData)
        },

        /**
         * 加载淹没分析表格
         * @param listData 需要加载的数据
         */
        loadAnalysisTable(listData) {
            var table = ""
            listData.forEach(e => {
                table += '<tr>' +
                    '<td><div>' + e.location + '</div></td>' +
                    '<td><div>' + e.origin + '</div></td>' +
                    '<td><div>' + e.lng + '</div></td>' +
                    '<td><div>' + e.lat + '</div></td>' +
                    '<td><div>' + e.water + '</div></td>' +
                    '<td><div>' + e.sw + '</div></td>' +
                    '</tr>'
            })
            $('#flood-tbody').html(table)
        },

        /**
         * 加载历史风险表格
         * @param listData 需要加载的数据
         */
        loadHistoryTable(listData) {
            var table = ""
            listData.forEach(e => {
                table += '<tr>' +
                    '<td><div><input type="radio" name="tableRadio" value=' + e.id + '></div></td>' +
                    '<td><div>' + e.name + '</div></td>' +
                    '</tr>'
            })
            $('#flood-history-tbody').html(table)
            pageElementId == "analysis-pagination" ? self.createList(startData,"洪水淹没分析") : self.createList(startData,"历史风险图")
        },

        /**
@@ -527,62 +554,93 @@
            let sw = this.floatAdd(Number(waterline), Number(sub))
            return sw
        },
        //预测水位计算
        getYcSub() {
            const self = this
            self.analysisTableList.forEach(e => {
                e.lng = Number(e.lng).toFixed(4)
                e.lat = Number(e.lat).toFixed(4)
                e.sw = self.calculateSw(e.water, $('#sw-input').val())

                e.water = Number(e.water).toFixed(4)
                e.sw = Number(e.sw).toFixed(4)
            })

            self.loadPagination(self.analysisTableList, "analysis-pagination")
        //减法函数
        accSub(arg1,arg2){
            let r1,r2,m,n;
            r1 = arg1.toString().length
            try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
            m=Math.pow(10,Math.max(r1,r2));
            //last modify by deeka
            //动态控制精度长度
            n=(r1>=r2)?r1:r2;
            return ((arg1*m-arg2*m)/m).toFixed(n);
        },
        //实时水位计算
        getSub(hdid, smxcode) {

        //获取实时水位
        getRealTimeWaterByhdId(hdid) {
            const self = this
            // 实时 需要请求服务器获取实时水位数据
            if ($('input[name=middleRadio]:checked').val() == 'realtime') {
                $.ajax({
                    url: self.url.getCzByGlCodeByGlQdj,
                    url: self.url.getRealTimeWaterByhdId,
                    type: 'get',
                    dataType: 'json',
                    jsonp: 'callback',
                    jsonpCallback: 'data',
                    data: {
                        hdId: hdid,
                        smxcode: smxcode
                        hdId: hdid
                    },
                    success: function (res) {
                        if (res.code == 200) {
                            let sub = res.data
                            $('#sw-input').val(sub)
                            self.analysisTableList.forEach(e => {
                                e.lng = Number(e.lng).toFixed(4)
                                e.lat = Number(e.lat).toFixed(4)
                                e.sw = self.calculateSw(e.water, sub)

                                e.water = Number(e.water).toFixed(4)
                                e.sw = Number(e.sw).toFixed(4)
                            })

                            self.loadPagination(self.analysisTableList, "analysis-pagination")
                            self.getSw(sub)
                        }
                    }
                });
            } else {
                self.getYcSub()
                self.getSw($('#sw-input').val())
            }

        },

        //计算水位
        getSw(val){
            const self = this
            let chazhi = 0
            if (val > 0) {
                chazhi = self.accSub(val,self.currentNearPoint.water)
            }

            let list = JSON.parse(JSON.stringify(self.analysisTableList))

            list.forEach(e => {
                e.lng = Number(e.lng).toFixed(4)
                e.lat = Number(e.lat).toFixed(4)
                e.sw = self.calculateSw(e.water, chazhi)
                e.water = Number(e.water).toFixed(2)
                e.sw = Number(e.sw).toFixed(2)
            })
            self.loadPagination(list, "analysis-pagination")
        },

        //获取最接近水文站的值
        getMin(smxcode, glQdj) {
            const self = this
            $.ajax({
                url: self.url.getCoordinatesMinQdj,
                type: 'get',
                dataType: 'json',
                jsonp: 'callback',
                jsonpCallback: 'data',
                data: {
                    smxcode:smxcode,
                    glQdj:glQdj
                },
                success: function (res) {
                    if (res.code == 200) {
                        self.currentNearPoint = res.data
                    }
                }
            });
        },

        //保存历史风险图
        saveHistoryData() {
            const self = this
            $.ajax({
                url: self.url.getCzByGlCodeByGlQdj,
                url: self.url.saveHistoryData,
                type: 'get',
                dataType: 'json',
                jsonp: 'callback',
@@ -598,7 +656,7 @@

        //防止出现两个小数相加出现很多0的情况
        floatAdd(arg1, arg2) {
            var r1, r2, m;
            let r1, r2, m;
            try {
                r1 = arg1.toString().split(".")[1].length;
            } catch (e) {
@@ -613,6 +671,7 @@
            return (arg1 * m + arg2 * m) / m;
        },

        //删除地图上的标注点位
        deleteEntities(entities) {
            entities.forEach(e => {
                this.map.entities.remove(e)
@@ -620,30 +679,307 @@
            entities = []
        },


        //评估分析弹窗
        evaluatePopup() {
            var self = this
            let data = this.evaluateData
            let dataStr = JSON.stringify(data)
            let hdStr = JSON.stringify(this.currentHd)
        evaluatePopup(flag) {
            const self = this
            let selectSmx = this.smxDataList.filter(e=>{
                return e.smxcode == this.currentSmxcode
            })

            var url = './corelib/common/popup/evaluateAnalysis.html'
            var top = ($(window).height() - 600) / 2;
            var left = ($(window).width() - 1300 - 340) / 2 + 340;
            let isAnalysis = flag == 'analysis'?true:false

            let parentData = {}
            if (isAnalysis){
                parentData.data = this.evaluateData
                parentData.hd = this.currentHd
                parentData.smx = selectSmx[0]
                parentData.sw = $('#sw-input').val()
                parentData.point = this.analysisTableList
            }else {
                parentData.data = this.evaluateData
                parentData.hd = this.currentSelectHistoryData.smxVal.hd
                parentData.smx = this.currentSelectHistoryData.smxVal.smx
                parentData.sw = this.currentSelectHistoryData.smxVal.sw
                parentData.point = this.currentSelectHistoryData.smxVal.point
            }

            let url = './corelib/common/popup/evaluateAnalysis.html'
            let top = ($(window).height() - 764) / 2;
            let left = ($(window).width() -465);
            layer.open({
                title: '评估分析',
                title: '分析结果',
                shade: 0,
                type: 2,
                maxmin: false, //开启最大化最小化按钮
                area: ['1500px', '700px'],
                maxmin: true, //开启最大化最小化按钮
                area: ['465px', '818px'],
                skin: 'floodAnalysis',
                offset: 'auto',
                content: url + "?data=" + encodeURIComponent(dataStr) + "&hd=" + encodeURIComponent(hdStr),//使用encodeURIComponent转码，避免中文字符乱码，避免url截取错误
                offset: [top,left],
                content: url + "?parentData=" + encodeURIComponent(JSON.stringify(parentData)),//使用encodeURIComponent转码，避免中文字符乱码，避免url截取错误
                id: "floodAnalysisLayer",
                closeBtn: 1,
                closeBtn: 0,
                shade: 0,
                move:false,
                maxmin: false,
                //设置默认不在左下角
                minStack:false,
                zIndex:-100000,
                success:function (layero,index) {
                    $('.layui-layer-setwin .layui-layer-min cite').css("background-color",'white')
                    //绑定父子之间的关系，用于数据传递，缺少则无法传递
                    let body = layer.getChildFrame("body", index);
                    //得到iframe页的窗口对象
                    let iframeWin = window[layero.find('iframe')[0]['name']];
                    self.evaluateLayerIndex = index

                    if (isAnalysis){
                        iframeWin.$('#save-btn').show()
                    }else {
                        iframeWin.$('#save-btn').hide()
                    }

                    self.popupLayer = $('.layui-layer')
                    iframeWin.$('#close-btn').click(function () {
                        self.popupLayer.hide()
                        $('#restore-icon').show()
                    })

                    if ($('.layui-layer-max').hasClass('layui-layer-maxmin')){
                        $('.layui-layer-max').show()
                    }else {
                        $('.layui-layer-max').hide()
                    }

                    //图片放大方法
                    // 思路: 获取所有要用的 => 然后通过点击图片显示弹窗 => 赋值到弹窗里面 => 图片赋值 => 文本赋值
                    // 获取点击图片
                    let img = iframeWin.$('#show-img')
                    // 获取弹窗
                    let modal = $('#myModal')
                    // 弹窗图片
                    let contImg = $('#img01')

                    img.click(function () {
                        modal.css({
                            "display":"block",
                            'position':'fixed',
                            'background-color':'#2f353cd4'
                        })
                        contImg.prop('src',img.prop('src'))
                    })
                    // 点击x按钮关闭弹窗
                    let closeBox = $('.close')
                    closeBox.click(function () {
                        modal.hide()
                    })

                },
                cancel:function (layero,index) {
                    self.popupLayer.hide()
                    $('#restore-icon').show()
                    return false
                }
            });
        },

        //http://dgrid.io/tutorials/1.0/hello_dgrid/    创建表格
        createList: function (dataList, txt) {
            const self = this
            let CustomGrid = declare([Grid, Keyboard, Selection,Editor]);
            let column, tab, moon, dauy;
            let formatter = function (value,object) {
                if (self.currentNearPoint.id == object.id) {
                    return '<span style="color:red">' + value + '</span>'
                } else {
                    return value
                }
            }
            if (txt == "洪水淹没分析") {
                $('.analysis-box-list').empty();
                column = {
                    location: {
                        label:'位置',
                        className:'dgrid-cell_200',
                        formatter:formatter
                    },
                    origin: {
                        label:'起点距',
                        className:'dgrid-cell_40',
                        formatter:function (value,object) {
                            if (self.currentNearPoint.id == object.id) {
                                return '<span style="color:red">' + value.substring(0,value.length - 2) + '</span>'
                            } else {
                                return value.substring(0,value.length - 2)
                            }
                        }
                    },
                    water: {
                        label:'水面线',
                        className:'dgrid-cell_60',
                        formatter:formatter
                    },
                    sw: {
                        label:'水位',
                        className:'dgrid-cell_60',
                        formatter:formatter
                    },
                    // lng:{
                    //     label:'经度',
                    //     formatter:formatter
                    // },
                    // lat:{
                    //     label:'纬度',
                    //     formatter:formatter
                    // },
                }
                tab = 'analysis-tab1-grid'
            } else if (txt == "历史风险图") {
                $('.history-box-list').empty();
                column = {
                    // radio:{ label: "", field: "radio", editor: 'radio' },
                    name: '名称',
                }
                tab = 'history-tab2-grid'
            }
            let grid = new CustomGrid({
                columns: column,
                selectionMode: 'single', // for Selection; only select a single row at a time
                cellNavigation: false, // for Keyboard; allow only row-level keyboard navigation
            }, tab);
            grid.startup();

            function makeHandler (grid, type, dir) {
                return function (event) {
                    let tip = $('#tableTip')
                    let obj = grid[type](event)

                    if (dir == 'entered' && obj.column.field == 'location' ){
                        tip.show()
                        tip.css({
                            "top":(194+(Number(obj.row.id)*24.5))+'px',
                            // "left":event.offsetX+10+'px'
                        })
                        tip.html(obj.row.data.location)
                    }else if (dir == 'left'){
                        tip.hide()
                    }
                };
            }

            grid.on(on.selector('.dgrid-content .dgrid-cell', mouse.enter), makeHandler(grid, 'cell', 'entered'));
            grid.on(on.selector('.dgrid-content .dgrid-cell', mouse.leave), makeHandler(grid, 'cell', 'left'));

            //防止绑定多次点击事件
            if (this.dgridSelectEvent){
                this.dgridSelectEvent.remove()
            }

            this.dgridSelectEvent = grid.on("dgrid-select", function(evt){
                //获取行数据
                let data = evt.rows[0].data
                //历史风险、洪水分析，表格不同的点击事件
                if (data.smxVal){
                    self.currentSelectHistoryData = data
                    if (data.smxVal.point.length>0){
                        self.deleteEntities(self.pointEntities)
                        if (self.drawingPolyline)
                            self.map.entities.remove(self.drawingPolyline);
                        if (self.waterEntity)
                            self.map.entities.remove(self.waterEntity)
                        $('#sw-input').val("")
                        $('#hd-input').val("")
                        $('#hd-input').trigger("input")
                        $('#smx-select option').remove()
                        //清空表格数据
                        $('.analysis-box-list').empty();
                        $('#analysis-pagination').hide()
                        //清空关联站和起点距
                        $('#glzd').val("")
                        $('#qdj').val('')
                        self.analysisTableList = []
                        self.createPointAndLine(data.smxVal.point,self.pointEntities)
                        self.map.camera.flyTo({
                            destination: Cesium.Cartesian3.fromDegrees(data.lon, data.lat, 50000),
                        });
                        self.drawWater('history')
                    }
                }else {
                    self.map.camera.flyTo({
                        destination: Cesium.Cartesian3.fromDegrees(data.lng, data.lat, 3000),
                    });
                }
            });

            grid.renderArray(dataList);
        },

        // 洪水淹没效果
        drawWater(flag) {

            //关闭分析窗口
            if (this.evaluateLayerIndex){
                layer.close(this.evaluateLayerIndex)
                $('#restore-icon').hide()
                this.evaluateLayerIndex = ""
            }

            //地图定位
            // this.map.camera.flyTo({
            //     destination: Cesium.Cartesian3.fromDegrees(115.93791, 25.989108, 5000),
            // });
            //显示进度条
            $('.dong-progress .container #progress_bar').width(0);
            $('.dong-progress').stop().hide();

            this.showWater = true
            this.waterEntity && this.map.entities.remove(this.waterEntity)
            const waterCoord = [116.0072, 25.9058, 100, 116.0546, 25.9012, 100 , 116.0457, 25.8611, 100, 115.9859, 25.8740 ,100]
            let startHeight = 169
            const targetHeight = 200
            this.waterEntity = this.map.entities.add({
                polygon: {
                    hierarchy: Cesium.Cartesian3.fromDegreesArrayHeights(waterCoord),
                    material: Cesium.Color.fromBytes(64, 157, 253, 200),
                    perPositionHeight: true,
                    extrudedHeight: new Cesium.CallbackProperty(() => { return startHeight }, false)
                }
            })
            $('.dong-progress').stop().show();
            // 总长度
            let totalWidth = $('.dong-progress .container').width();
            // 过度长度
            let excessiveWidth = totalWidth / 100;
            let watchWidth = 0;
            // 进度条的定时器
            let proTime = setInterval(function () {
                watchWidth += excessiveWidth;
                if (watchWidth > totalWidth) {
                    watchWidth = totalWidth;
                }
                $('.dong-progress .container #progress_bar').width(watchWidth);
            }, 22);
            const waterInterval = setInterval(() => {
                if (startHeight < targetHeight) {
                    startHeight += 5

                    if (startHeight >= targetHeight) {
                        startHeight = targetHeight
                        clearInterval(waterInterval)

                        if (watchWidth < totalWidth) {
                            watchWidth = totalWidth;
                        }
                        clearInterval(proTime);
                        //隐藏进度条
                        $('.dong-progress .container #progress_bar').width(0);
                        $('.dong-progress').stop().hide();
                        this.showWater = false
                        this.evaluatePopup(flag)
                    }
                    // 使用该方式会闪烁，改用 Cesium.CallbackProperty 平滑
                    // this.waterEntity.polygon.extrudedHeight = startHeight
                }
            }, 1000*0.5)
        }

    });
});