From 52c8ca8e31bb9aee13726d9c858dee1d11dcde87 Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Mon, 20 Feb 2023 10:19:29 +0800
Subject: [PATCH] 洪水淹没-进度条、分析弹窗大小位置变更
---
widgets/FloodAnalysis/Widget.js | 128 ++++++++++++++++++++++++++++++++----------
1 files changed, 96 insertions(+), 32 deletions(-)
diff --git a/widgets/FloodAnalysis/Widget.js b/widgets/FloodAnalysis/Widget.js
index 0811815..a1d1b4c 100644
--- a/widgets/FloodAnalysis/Widget.js
+++ b/widgets/FloodAnalysis/Widget.js
@@ -41,6 +41,7 @@
//洪水分析表格数据
analysisTableList: [],
dgridSelectEvent:null,
+ currentSelectHistoryData:null,
//历史风险图表格数据
historyTableList: [
{name: "5年洪水淹没图"},
@@ -57,31 +58,31 @@
isOpen: true,
//api接口
url: {
- riverwaySelectName: "http://192.168.0.207:82/blade-ycreal/riverway/selectName",
- waterlineSelectName: "http://192.168.0.207:82/blade-ycreal/waterline/selectName",
- childpage: "http://192.168.0.207:82/blade-ycreal/water/childpage",
- getCzByGlCodeByGlQdj: "http://192.168.0.207:82/blade-ycreal/waterline/getCzByGlCodeByGlQdj",
- getHistoryList: "http://192.168.0.103:82/blade-ycreal/inundationResult/list",
- saveHistoryData: "http://192.168.0.103:82/blade-ycreal/inundationResult/save",
- getCoordinatesMinQdj: "http://192.168.0.207:82/blade-ycreal/water/getCoordinatesMinQdj",
+ 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: "http://localhost:82/blade-ycreal/inundationResult/list",
+ saveHistoryData: "http://localhost:82/blade-ycreal/inundationResult/save",
+ getCoordinatesMinQdj: "http://localhost:82/blade-ycreal/water/getCoordinatesMinQdj",
},
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,
@@ -91,7 +92,6 @@
startup: function startup() {
var self = this
this.bindHtmlElement()
-
//实时、预测改变事件
$('input[type=radio][name=middleRadio]').change(function () {
if (this.value == "realtime") {
@@ -106,10 +106,9 @@
//开始分析按钮点击事件
$('#start-analysis-btn').click(function () {
if (self.currentHd && self.currentSmxcode) {
- // self.evaluatePopup()
- self.drawWater()
+ self.drawWater('analysis')
} else {
- alert("请先选择河段和水面线")
+ layer.msg("请先选择河段和水面线")
}
})
@@ -140,6 +139,7 @@
//获取历史数据
self.getHistoryList()
+
})
//河段输入框聚焦、失焦、输入事件
@@ -184,6 +184,8 @@
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),
@@ -647,38 +649,56 @@
},
//评估分析弹窗
- evaluatePopup() {
+ evaluatePopup(flag) {
var self = this
let selectSmx = this.smxDataList.filter(e=>{
return e.smxcode == this.currentSmxcode
})
+ let isAnalysis = flag == 'analysis'?true:false
+
let parentData = {}
- parentData.data = this.evaluateData
- parentData.hd = this.currentHd
- parentData.smx = selectSmx[0]
- parentData.sw = $('#sw-input').val()
- parentData.point = this.analysisTableList
- // let data = this.evaluateData
- // let dataStr = JSON.stringify(data)
- // let hdStr = JSON.stringify(this.currentHd)
+ 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 smxStr = JSON.stringify(selectSmx[0])
var url = './corelib/common/popup/evaluateAnalysis.html'
- var top = ($(window).height() - 600) / 2;
- var left = ($(window).width() - 1300 - 340) / 2 + 340;
+ var top = ($(window).height() - 550) / 2;
+ var left = ($(window).width() - 400 - 340) / 2 + 340;
layer.open({
title: '评估分析',
type: 2,
maxmin: false, //开启最大化最小化按钮
- area: ['1500px', '700px'],
+ area: ['900px', '600px'],
skin: 'floodAnalysis',
- offset: 'auto',
+ offset: [top,left],
content: url + "?parentData=" + encodeURIComponent(JSON.stringify(parentData)),//使用encodeURIComponent转码,避免中文字符乱码,避免url截取错误
id: "floodAnalysisLayer",
closeBtn: 1,
+ success:function (layero,index) {
+ //绑定父子之间的关系,用于数据传递,缺少则无法传递
+ var body = layer.getChildFrame("body", index);
+ //得到iframe页的窗口对象
+ var iframeWin = window[layero.find('iframe')[0]['name']];
+
+ if (isAnalysis){
+ iframeWin.$('#save-btn').show()
+ }else {
+ iframeWin.$('#save-btn').hide()
+ }
+ }
});
},
@@ -751,15 +771,32 @@
this.dgridSelectEvent = grid.on("dgrid-select", function(evt){
//获取行数据
let data = evt.rows[0].data
-
+ 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("")
+ $('#smx-select option').remove()
+ //清空表格数据
+ $('.analysis-box-list').empty();
+ $('#analysis-pagination').hide()
+
+ self.analysisTableList = []
+
self.createPointAndLine(data.smxVal.point,self.pointEntities)
self.map.camera.flyTo({
destination: Cesium.Cartesian3.fromDegrees(data.lon, data.lat, 50000),
});
- self.drawWater()
+ self.drawWater('history')
}
});
@@ -767,11 +804,15 @@
},
// 洪水淹没效果
- drawWater() {
+ drawWater(flag) {
//地图定位
// 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]
@@ -785,14 +826,37 @@
extrudedHeight: new Cesium.CallbackProperty(() => { return startHeight }, false)
}
})
+ $('.dong-progress').stop().show();
+ // 总长度
+ var totalWidth = $('.dong-progress .container').width();
+ // 过度长度
+ var excessiveWidth = totalWidth / 100;
+ var watchWidth = 0;
+ // 进度条的定时器
+ var 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()
+ this.evaluatePopup(flag)
}
// 使用该方式会闪烁,改用 Cesium.CallbackProperty 平滑
// this.waterEntity.polygon.extrudedHeight = startHeight
--
Gitblit v1.9.3