| corelib/common/popup/css/style.css | ●●●●● patch | view | raw | blame | history | |
| corelib/common/popup/evaluateAnalysis.html | ●●●●● patch | view | raw | blame | history | |
| corelib/common/popup/js/evaluateAnalysis.js | ●●●●● patch | view | raw | blame | history | |
| corelib/common/popup/js/saveConfirm.js | ●●●●● patch | view | raw | blame | history | |
| corelib/common/popup/saveConfirm.html | ●●●●● patch | view | raw | blame | history | |
| widgets/FloodAnalysis/Widget.html | ●●●●● patch | view | raw | blame | history | |
| widgets/FloodAnalysis/Widget.js | ●●●●● patch | view | raw | blame | history | |
| widgets/FloodAnalysis/css/style.css | ●●●●● patch | view | raw | blame | history |
corelib/common/popup/css/style.css
@@ -805,7 +805,43 @@ /**损失分析**/ .evaluate-analysis { height: 628px; margin: 15px; } .evaluate-box { display: flex; height: 95%; } .evaluate-bottom { display: flex; justify-content: flex-end; } .evaluate-bottom > input { width: 120px; height: 40px; background-color: white; border-radius: 11px; } .evaluate-bottom > input:hover { color: white; background-color: #0db2ef; } .export-img { margin-right: 1%; } .evaluate-box-left { width: 70%; } .evaluate-box-right { width: 70%; height: 100%; } .evaluate-box-top { @@ -815,8 +851,7 @@ .evaluate-box-middle { width: 96%; height: 650px; border: 1px solid black; height: 90%; padding: 0px 10px 0px 10px; } @@ -857,7 +892,6 @@ } /**分页器**/ .flood-analysis-pagination { position: relative; text-align: center; @@ -977,29 +1011,33 @@ text-align: right; } /**确认保存弹出框**/ .confirm-popup{ margin-top: 5%; .flood-image-box .description { font-size: 20px; } .confirm-popup>div{ /**确认保存弹出框**/ .confirm-popup { margin-top: 5%; } .confirm-popup > div { text-align: center; } .confirm-top{ .confirm-top { font-size: 30px; } .confirm-bottom{ .confirm-bottom { margin-top: 8%; } .save-name-input{ .save-name-input { height: 26px; width: 215px; } .confirm-button{ .confirm-button { width: 80px; height: 32px; } corelib/common/popup/evaluateAnalysis.html
@@ -8,71 +8,83 @@ </head> <body> <div class="evaluate-analysis"> <div class="evaluate-top"></div> <div class="evaluate-box"> <div class="evaluate-box-top"> <div class="evaluate-box-top-left"> <div class="column-1"> <div> <span>受灾户数：</span><span class="house">暂无数据</span> </div> <div> <span>受灾面积：</span><span class="area">暂无数据</span> </div> <div class="evaluate-box-left"> <div class="flood-image-box"> <div class="flood-image-top"> <img id="show-img" src=""> </div> <div class="column-2"> <div> <span>受灾人口：</span><span class="people">暂无数据</span> </div> <div> <span>房屋价值：</span><span class="money">暂无数据</span> </div> <div class="description"> <!--已经与数据联动，此处可删可不删--> 该站位于古亭水园滩段，河段长4556m,预计会造成受灾户数125户，受灾人口625人，受灾面积47.999km²，房屋价值189.999万元 </div> </div> <div class="evaluate-box-top-right"> <label> <input id="list" type="radio" name="value" value="list" checked='checked'>列表 </label> <label> <input id="echarts" type="radio" name="value" value="echarts">图表 </label> </div> </div> <div class="evaluate-box-middle"> <div class="evaluate-table"> <table> <caption class="evaluate-table-caption table-caption">人口财产淹没损失表</caption> <thead class="evaluate-table-thead table-thead"> <tr> <th> <div>编号</div> </th> <th> <div>受淹户数(户)</div> </th> <th> <div>受淹人口数量(人)</div> </th> <th> <div>受淹居民地面积(km²)</div> </th> <th> <div>受淹房屋价值(万元/人)</div> </th> </tr> </thead> <tbody id="evaluate-tbody" class="table-tbody evaluate-tbody"></tbody> </table> <div class="evaluate-box-right"> <div class="evaluate-box-top"> <div class="evaluate-box-top-left"> <div class="column-1"> <div> <span>受灾户数：</span><span class="house">暂无数据</span> </div> <div> <span>受灾面积：</span><span class="area">暂无数据</span> </div> </div> <div class="column-2"> <div> <span>受灾人口：</span><span class="people">暂无数据</span> </div> <div> <span>房屋价值：</span><span class="money">暂无数据</span> </div> </div> </div> <div class="evaluate-box-top-right"> <label> <input id="list" type="radio" name="value" value="list" checked='checked'>列表 </label> <label> <input id="echarts" type="radio" name="value" value="echarts">图表 </label> </div> </div> <div class="flood-analysis-pagination Pagination" id="pagination"></div> <div class="evaluate-echarts" id="evaluate-echarts"></div> <div class="evaluate-box-middle"> <div class="evaluate-table"> <table> <caption class="evaluate-table-caption table-caption">人口财产淹没损失表</caption> <thead class="evaluate-table-thead table-thead"> <tr> <th> <div>编号</div> </th> <th> <div>受淹户数(户)</div> </th> <th> <div>受淹人口数量(人)</div> </th> <th> <div>受淹居民地面积(km²)</div> </th> <th> <div>受淹房屋价值(万元/人)</div> </th> </tr> </thead> <tbody id="evaluate-tbody" class="table-tbody evaluate-tbody"></tbody> </table> <div class="flood-analysis-pagination Pagination" id="evaluate-pagination"></div> </div> <div class="evaluate-echarts" id="evaluate-echarts"></div> </div> </div> </div> <div class="evaluate-bottom"> <button id="create-flood-image" type="button">生成淹没图</button> <input id="export-img" class="export-img" type="button" value="导出成果图"/> <input id="save-btn" class="save-btn" type="button" value="保存"/> </div> </div> corelib/common/popup/js/evaluateAnalysis.js
@@ -1,6 +1,7 @@ $(function () { //获取父窗口传来的数据 var data = JSON.parse(GetQueryString("data")) var hd = JSON.parse(GetQueryString("hd")) //配置数据 var nameData = [] var houseData = [] @@ -11,9 +12,9 @@ data.forEach(e => { nameData.push(e.name) houseData.push(e.house) peopleData.push(e.people) peopleData.push(e.population) areaData.push(e.area) moneyData.push(e.money) moneyData.push(e.value) }) } @@ -24,12 +25,12 @@ $('input[type=radio][name=value]').change(function () { if (this.value == 'list') { $('.evaluate-echarts').hide() $('.evaluate-box-top-left').css('visibility', 'visible') // $('.evaluate-box-top-left').css('visibility', 'visible') $('.evaluate-table').show() $('.flood-analysis-pagination').show() } else { $('.evaluate-table').hide() $('.evaluate-box-top-left').css('visibility', 'hidden') // $('.evaluate-box-top-left').css('visibility', 'hidden') $('.flood-analysis-pagination').hide() recharts_z() loadEcharts() @@ -39,8 +40,51 @@ //淹没图弹窗事件 $('#create-flood-image').click(function () { imagePopup() exportPicture() }) $('#save-btn').click(function () { confirmPopup() }) $('#export-img').click(function () { exportPicture() }) //确认弹窗 function confirmPopup() { const self = this let url = '../popup/saveConfirm.html' var top = ($(window).height() - 300) / 2 - 124; var left = ($(window).width() - 500) / 2; layer.open({ title: '保存', type: 2, maxmin: false, //开启最大化最小化按钮 area: ['500px', '200px'], skin: 'saveConfirm', offset: [top, left], content: url, id: "saveConfirmLayer", closeBtn: 1, //把父页面数据传递给子弹窗并渲染 success: function (layero, index) { self.popupIndex = index //绑定父子之间的关系，用于数据传递，缺少则无法传递 var body = layer.getChildFrame("body", index); //得到iframe页的窗口对象 var iframeWin = window[layero.find('iframe')[0]['name']]; iframeWin.$('#confirm-button').click(function () { let saveName = iframeWin.$('#save-name').val() if (saveName == "") return console.log(saveName, "-----------") saveHistoryData() }) } }) } //加载柱状图 function loadEcharts() { @@ -157,8 +201,9 @@ } function recharts_z() { var width = $(window).width() * 0.9; var width = $(window).width() * 0.45; var height = ($(window).height() - 50) - 80; $('#evaluate-echarts').empty(); $('#evaluate-echarts').removeAttr("_echarts_instance_").empty(); var chartPie = document.getElementById('evaluate-echarts'); @@ -178,25 +223,25 @@ return null; } //淹没图弹窗 function imagePopup() { var url = './corelib/common/popup/floodImage.html'; var top = ($(window).height() - 526) / 2; var left = ($(window).width() - 500 - 340) / 2 + 340; parent.layer.open({ title: '影响分析', type: 2, maxmin: false, //开启最大化最小化按钮 area: ['1000px', '800px'], skin: 'floodImage', offset: [top, left], content: url, id: "floodImageLayer", closeBtn: 1 }); //导出成果图 function exportPicture() { // 获取要下载的图片 var img = document.getElementById('show-img'); // 获取图片地址 var url = img.src; // 创建一个a节点插入的document var a = document.createElement('a'); // 模拟鼠标click点击事件 var event = new MouseEvent('click') // 设置a节点的download属性值 a.download = '成果图' // 将图片的src赋值给a节点的href a.href = url; a.dispatchEvent(event) } function init() { $('#show-img').prop('src', 'img/floodAnalysisEvaluate-2.png') loadSumData() loadPagination() } @@ -213,15 +258,15 @@ table += '<tr>' + '<td><div>' + listData[i].name + '</div></td>' + '<td><div>' + listData[i].house + '</div></td>' + '<td><div>' + listData[i].people + '</div></td>' + '<td><div>' + listData[i].population + '</div></td>' + '<td><div>' + listData[i].area + '</div></td>' + '<td><div>' + listData[i].money + '</div></td>' + '<td><div>' + listData[i].value + '</div></td>' + '</tr>' house += data[i].house people += data[i].people people += data[i].population area += data[i].area money += data[i].money money += data[i].value } $('#evaluate-tbody').html(table) } @@ -233,22 +278,23 @@ var money = 0 for (let i = 0; i < data.length; i++) { house = floatAdd(house, data[i].house) people = floatAdd(people, data[i].people) people = floatAdd(people, data[i].population) area = floatAdd(area, data[i].area) money = floatAdd(money, data[i].money) money = floatAdd(money, data[i].value) } $(".house").html(house + '户') $(".people").html(people + '人') $(".area").html(area + 'km²') $(".money").html(money + '万元') $('.description').html("该站位于" + hd.riverway + "，河段长" + hd.river_length + "m,预计会造成受灾户数" + house + "户，受灾人口" + people + "人，受灾面积" + area + "km²，房屋价值" + money + "万元") } function loadPagination() { if (data.length < 0) return var count = Math.ceil(data.length / 10); $('.Pagination').pagination({ $('#evaluate-pagination').pagination({ mode: 'fixed', jump: true, coping: false, @@ -297,4 +343,8 @@ m = Math.pow(10, Math.max(r1, r2)); return (arg1 * m + arg2 * m) / m; } function saveHistoryData() { console.log("------------------------------------") } }); corelib/common/popup/js/saveConfirm.js
@@ -1,17 +0,0 @@ console.log(this) $(function () { $('#confirm-button').click(function () { let saveName = $('#save-name').val() if (saveName == "") return var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引 parent.layer.close(index); }) }); corelib/common/popup/saveConfirm.html
@@ -18,8 +18,6 @@ </div> </div> <script src="../../../libs/jquery/jquery-3.3.1.min.js"></script> <script src="js/saveConfirm.js"></script> </body> </html> widgets/FloodAnalysis/Widget.html
@@ -1,107 +1,119 @@ <div> <div class="fold-btn"></div> <div class="content"> <div class="flood-top"> <input class="analysis-button" type="button" value="洪水淹没分析"/> <input class="history-button" type="button" value="历史风险图"/> </div> <div class="flood-middle"> <div class="flood-analysis"> <div class="select-box"> <div class="hd"> <label for="hd-select">河段：</label> <!-- <select id="hd-select" class="hd-select" name="hd" >--> </select> <!--做模糊查询选择框时使用--> <input type="text" name="hd-input" id="hd-input" class="hd-input" placeholder="请选择或输入"/> <select name="hd-select" id="hd-select" size="10"> </select> </div> <div class="smx"> <label for="smx-select">水面线：</label> <select id="smx-select" class="smx-select" name="smx"> </select> </div> <div class="sw"> <label for="sw-input">水位：</label> <div style="display: flex;flex-direction: column"> <input id="sw-input" class="sw-input" type="text" name="word" autocomplete="off" maxlength="256"/> <span class="tip">正数为水位上涨，负数为水位下降</span> </div> </div> </div> <div class="radio-box"> <input id="realtime" type="radio" name="middleRadio" value="realtime" checked='checked'>实时 <input id="forecast" type="radio" name="middleRadio" value="forecast">预测 </div> <div class="table-box"> <table> <thead class="flood-table-thead table-thead"> <tr> <th> <div>位置</div> </th> <th> <div>起点距</div> </th> <th> <div>经度</div> </th> <th> <div>纬度</div> </th> <th> <div>水面线</div> </th> <th> <div>水位</div> </th> </tr> </thead> <tbody id="flood-tbody" class="table-tbody flood-tbody"></tbody> </table> <div class="flood-analysis-pagination" id="analysis-pagination"></div> </div> </div> <div class="flood-history"> <div class="search-box"> <label for="search-name">名称：</label> <input id="search-name" class="search-name-input" type="text" name="word" autocomplete="off" maxlength="256" placeholder="请输入筛选名称"/> <input id="search-button" class="search-button" type="button" value="查 询"/> <input id="save-button" class="save-button" type="button" value="保 存"/> </div> <div class="table-box"> <table> <thead class="flood-table-thead table-thead"> <tr> <th style="width: 85px;"> <div class="fold-btn"></div> <div class="content"> <div class="flood-top"> <input class="analysis-button" type="button" value="洪水淹没分析"/> <input class="history-button" type="button" value="历史风险图"/> </div> <div class="flood-middle"> <div class="flood-analysis"> <div class="select-box"> <div class="hd"> <label for="hd-select">河段：</label> <!-- <select id="hd-select" class="hd-select" name="hd" >--> </select> <!--做模糊查询选择框时使用--> <input type="text" name="hd-input" id="hd-input" class="hd-input" placeholder="请选择或输入"/> <select name="hd-select" id="hd-select" size="10"> </select> </div> <div class="smx"> <label for="smx-select">水面线：</label> <select id="smx-select" class="smx-select" name="smx"> </select> </div> <div class="sw"> <label for="sw-input">水位：</label> <div style="display: flex;flex-direction: column"> <input id="sw-input" class="sw-input" type="text" name="word" autocomplete="off" maxlength="256"/> <span class="tip">正数为水位上涨，负数为水位下降</span> </div> </div> </div> <div class="radio-box"> <input id="realtime" type="radio" name="middleRadio" value="realtime" checked='checked'>实时 <input id="forecast" type="radio" name="middleRadio" value="forecast">预测 <input id="start-analysis-btn" class="start-analysis-btn" type="button" value="开始分析"/> </div> <div class="table-box"> <table> <thead class="flood-table-thead table-thead"> <tr> <th> <div>位置</div> </th> <th> <div>起点距</div> </th> <th> <div>经度</div> </th> <th> <div>纬度</div> </th> <th> <div>水面线</div> </th> <th> <div>水位</div> </th> </tr> </thead> <tbody id="flood-tbody" class="table-tbody flood-tbody"></tbody> </table> <div class="flood-analysis-pagination" id="analysis-pagination"></div> </div> </div> <div class="flood-history"> <div class="search-box"> <label for="search-name">名称：</label> <input id="search-name" class="search-name-input" type="text" name="word" autocomplete="off" maxlength="256" placeholder="请输入筛选名称"/> <input id="search-button" class="search-button" type="button" value="查 询"/> </div> <div class="table-box"> <table> <thead class="flood-table-thead table-thead"> <tr> <th style="width: 85px;"> </th> <th> <div>名称</div> </th> </tr> </thead> <tbody id="flood-history-tbody" class="table-tbody flood-tbody"> <tr> <td><div><input type="radio" name="tableRadio" value="1"></div></td> <td><div>5年洪水淹没图</div></td> </tr> <tr> <td><div><input type="radio" name="tableRadio" value="2"></div></td> <td><div>10年洪水淹没图</div></td> </tr> <tr> <td><div><input type="radio" name="tableRadio" value="3"></div></td> <td><div>15年洪水淹没图</div></td> </tr> </tbody> </table> <div class="flood-analysis-pagination" id="history-pagination"></div> </div> </div> </div> </div> </th> <th> <div>名称</div> </th> </tr> </thead> <tbody id="flood-history-tbody" class="table-tbody flood-tbody"> <tr> <td> <div><input type="radio" name="tableRadio" value="1"></div> </td> <td> <div>5年洪水淹没图</div> </td> </tr> <tr> <td> <div><input type="radio" name="tableRadio" value="2"></div> </td> <td> <div>10年洪水淹没图</div> </td> </tr> <tr> <td> <div><input type="radio" name="tableRadio" value="3"></div> </td> <td> <div>15年洪水淹没图</div> </td> </tr> </tbody> </table> <div class="flood-analysis-pagination" id="history-pagination"></div> </div> </div> </div> </div> </div> widgets/FloodAnalysis/Widget.js
@@ -6,11 +6,8 @@ return declare([BaseWidget], { baseClass: 'jimu-widget-FloodAnalysis', name: 'FloodAnalysis', //人员数据点位 peoplePositionArray: [], peoplePositionEntity: [], //绘制多边形的顶点经纬度 polygonPositionArray: [], //渲染的点位 pointEntities: [], //html元素 analysisBtn: null, historyBtn: null, @@ -25,37 +22,62 @@ //洪水分析表格数据 analysisTableList: [], //历史风险图表格数据 historyTableList:[ {name:"5年洪水淹没图"}, {name:"10年洪水淹没图"}, {name:"15年洪水淹没图"}, historyTableList: [ {name: "5年洪水淹没图"}, {name: "10年洪水淹没图"}, {name: "15年洪水淹没图"}, ], //当前选中的河段 currentHdId: "", currentHd: null, //当前选中的水面线 currentSmxcode: "", //收起框打开状态 isOpen:true, isOpen: true, //api接口 url: { riverwaySelectName: "http://192.168.0.200:82/blade-ycreal/riverway/selectName", waterlineSelectName: "http://192.168.0.200:82/blade-ycreal/waterline/selectName", childpage: "http://192.168.0.200:82/blade-ycreal/water/childpage", getCzByGlCodeByGlQdj: "http://192.168.0.200:82/blade-ycreal/waterline/getCzByGlCodeByGlQdj", getHistoryList:"", saveHistoryData:"", 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: "", }, //弹出框索引，用来关闭弹出框 popupIndex: "", evaluateData: [ { name: "会昌县", house: 35, population: 175, area: 12.888, value: 50.123 }, { name: "于都县", house: 70, population: 350, area: 24.456, value: 100.456 }, { name: "赣县", house: 20, population: 100, area: 8.551, value: 39.789 } ], startup: function startup() { var self = this this.bindHtmlElement() //收起展开按钮点击事件 $(".fold-btn").click(function(){ if (self.isOpen){ $(".fold-btn").click(function () { if (self.isOpen) { $(this).addClass('close') $(this).removeClass('open') $('.content').hide() self.isOpen = false }else { } else { $(this).addClass('open') $(this).removeClass('close') $('.content').show() @@ -71,6 +93,15 @@ } else { self.divSwInput.css('visibility', 'visible') self.spanTip.css('visibility', 'visible') } }) //开始分析按钮点击事件 $('#start-analysis-btn').click(function () { if (self.currentHd && self.currentSmxcode) { self.evaluatePopup() } else { alert("请先选择河段和水面线") } }) @@ -95,6 +126,8 @@ self.analysisBtn.addClass('unchoose-button') self.divFloodAnalysis.hide() self.divFloodHistory.show() self.getHistoryList() }) //河段输入框聚焦、失焦、输入事件 @@ -121,9 +154,16 @@ this.hdSelect.change(function () { $("#hd-input").val($(this).find("option:selected").text()); var selected = JSON.parse($(this).val()) self.currentHdId = selected.id self.currentHd = selected $('#sw-input').val("") self.getSmxData(selected.river_code, selected.default_smx) //地图定位 self.map.camera.flyTo({ destination: Cesium.Cartesian3.fromDegrees(selected.river_origin, selected.qd_lat, 50000), }); self.hdSelect.hide() }) @@ -148,35 +188,16 @@ $('#search-button').click(function () { let searchName = $('#search-name').val() let filterArray = self.historyTableList.filter(e=>{ let filterArray = self.historyTableList.filter(e => { return e.name.indexOf(searchName) != -1 }) self.loadPagination(filterArray,"flood-analysis-pagination") self.loadPagination(filterArray, "flood-analysis-pagination") }) console.log(this) $('#save-button').click(function () { let url = './corelib/common/popup/saveConfirm.html' var top = ($(window).height()-300) / 2 -124; var left = ($(window).width() -500) / 2; layer.open({ title:'保存', type: 2, maxmin: false, //开启最大化最小化按钮 area: ['500px', '200px'], skin: 'saveConfirm', offset: [top, left], content: url, id: "saveConfirmLayer", closeBtn: 1, //把父页面数据传递给子弹窗并渲染 success: function(layero, index) { } }) self.confirmPopup() // self.floodAnalysisPopup() }) }, onOpen: function onOpen() { @@ -184,8 +205,6 @@ //面板打开的时候触发 （when open this panel trigger） this.map.scene.globe.baseColor = Cesium.Color.BLACK; //初始化点 // this.addPoint() //切换底图 $($('div.cesium-viewer').find('.cesium-baseLayerPicker-choices')[0]).children('div:eq(0)').trigger('click'); $($('div.cesium-viewer').find('.cesium-baseLayerPicker-choices')[1]).children('div:eq(2)').trigger('click'); @@ -198,9 +217,8 @@ onClose: function onClose() { //面板关闭的时候触发 （when this panel is closed trigger） this.peoplePositionEntity.forEach(e => { this.map.entities.remove(e) }) this.deleteEntities(this.pointEntities) this.map.scene.globe.baseColor = Cesium.Color.WHITE; $('#hd-select option').remove() @@ -229,47 +247,6 @@ //todo //do something before this func this.inherited(arguments); }, //添加点 addPoint: function () { const url = './widgets/FloodAnalysis/data.json' this.getJsonUrl(url) }, //获取json对象，测试用 getJsonUrl: function (url) { var self = this; $.ajax({ url: url, dataType: 'json', type: 'get', success: function success(data) { const viewer = self.map var dataArray = data.data dataArray.forEach(e => { e.house = Number(e.house) e.people = Number(e.people) e.area = Number(e.area) e.money = Number(e.money) }) self.peoplePositionArray = [] self.peoplePositionArray = dataArray for (let i = 0; i < dataArray.length; i++) { var temp = viewer.entities.add({ position: Cesium.Cartesian3.fromDegrees(dataArray[i].LGTD, dataArray[i].LTTD), point: { color: Cesium.Color.RED, pixelSize: 16, //防止地形遮挡住点 disableDepthTestDistance: Number.POSITIVE_INFINITY, heightReference: Cesium.HeightReference.CLAMP_TO_GROUND }, }); self.peoplePositionEntity.push(temp) } } }); }, //绑定html元素，方便操作 @@ -378,16 +355,30 @@ success: function (res) { if (res.code == 200) { let data = res.data.records self.deleteEntities(self.pointEntities) for (let i = 0; i < data.length; i++) { var temp = self.map.entities.add({ position: Cesium.Cartesian3.fromDegrees(data[i].lng, data[i].lat), point: { color: Cesium.Color.RED, pixelSize: 11, //防止地形遮挡住点 disableDepthTestDistance: Number.POSITIVE_INFINITY, heightReference: Cesium.HeightReference.CLAMP_TO_GROUND }, }); self.pointEntities.push(temp) } self.analysisTableList = data self.getSub(self.currentHdId, self.currentSmxcode) self.getSub(self.currentHd.id, self.currentSmxcode) } } }); }, //获取历史风险图数据列表 getHistoryList(){ console.log("调用了！！！") getHistoryList() { const self = this $.ajax({ url: self.url.getHistoryList, @@ -396,11 +387,17 @@ jsonp: 'callback', jsonpCallback: 'data', data: { name:"", name: "", }, success: function (res) { if (res.code == 200) { let data = res.data.records if (self.popupIndex != "") { layer.close(self.popupIndex) self.popupIndex = "" } } } @@ -414,11 +411,11 @@ * @param tableElementId tbody id */ loadPagination(tableData, pageElementId) { if (tableData.length <= 0 && pageElementId =="analysis-pagination") { if (tableData.length <= 0 && pageElementId == "analysis-pagination") { $('#analysis-pagination').hide() } if (tableData.length <= 0 && pageElementId =="history-pagination") { if (tableData.length <= 0 && pageElementId == "history-pagination") { $('#history-pagination').hide() } var count = Math.ceil(tableData.length / 10); @@ -439,7 +436,7 @@ } } pageElementId == "analysis-pagination" ? self.loadAnalysisTable(listdata) :self.loadHistoryTable(listdata) pageElementId == "analysis-pagination" ? self.loadAnalysisTable(listdata) : self.loadHistoryTable(listdata) } }); @@ -455,7 +452,7 @@ startData.push(tableData[i]); } } pageElementId == "analysis-pagination" ? self.loadAnalysisTable(startData) :self.loadHistoryTable(startData) pageElementId == "analysis-pagination" ? self.loadAnalysisTable(startData) : self.loadHistoryTable(startData) }, /** @@ -485,7 +482,7 @@ var table = "" listData.forEach(e => { table += '<tr>' + '<td><div><input type="radio" name="tableRadio" value='+e.id+'></div></td>' + '<td><div><input type="radio" name="tableRadio" value=' + e.id + '></div></td>' + '<td><div>' + e.name + '</div></td>' + '</tr>' }) @@ -534,7 +531,7 @@ }, //保存历史风险图 saveHistoryData(){ saveHistoryData() { const self = this $.ajax({ url: self.url.getCzByGlCodeByGlQdj, @@ -544,7 +541,7 @@ jsonpCallback: 'data', data: {}, success: function (res) { if (res.code == 200){ if (res.code == 200) { self.getHistoryList() } } @@ -566,7 +563,39 @@ } m = Math.pow(10, Math.max(r1, r2)); return (arg1 * m + arg2 * m) / m; } }, deleteEntities(entities) { entities.forEach(e => { this.map.entities.remove(e) }) entities = [] }, //评估分析弹窗 evaluatePopup() { var self = this let data = this.evaluateData let dataStr = JSON.stringify(data) let hdStr = JSON.stringify(this.currentHd) var url = './corelib/common/popup/evaluateAnalysis.html' var top = ($(window).height() - 600) / 2; var left = ($(window).width() - 1300 - 340) / 2 + 340; layer.open({ title: '评估分析', type: 2, maxmin: false, //开启最大化最小化按钮 area: ['1500px', '700px'], skin: 'floodAnalysis', offset: 'auto', content: url + "?data=" + encodeURIComponent(dataStr) + "&hd=" + encodeURIComponent(hdStr),//使用encodeURIComponent转码，避免中文字符乱码，避免url截取错误 id: "floodAnalysisLayer", closeBtn: 1, }); }, }); }); widgets/FloodAnalysis/css/style.css
@@ -23,7 +23,7 @@ padding: 0; } .fold-btn{ .fold-btn { width: 50px; height: 30px; position: fixed; @@ -36,11 +36,11 @@ background-repeat: no-repeat; } .open{ .open { background-image: url(../images/fold_up.png); } .close{ .close { background-image: url(../images/fold_down.png); } @@ -78,7 +78,14 @@ color: #1f81e0; } .search-button,.save-button { .start-analysis-btn { width: 65px; height: 25px; background: white; border: none; } .search-button, .save-button { width: 66px; line-height: 0px; height: 30px; @@ -87,7 +94,7 @@ cursor: pointer; } .search-button:hover,.save-button:hover{ .search-button:hover, .save-button:hover { background-color: #1388ff; color: white; }
