From 4d8c6dd77427e8e581fda17b6b65ba86bfb7a815 Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Mon, 27 Feb 2023 14:30:01 +0800
Subject: [PATCH] 洪水淹没
---
widgets/FloodAnalysis/Widget.js | 210 ++++++++++++++++++++++++++++++----------------------
1 files changed, 122 insertions(+), 88 deletions(-)
diff --git a/widgets/FloodAnalysis/Widget.js b/widgets/FloodAnalysis/Widget.js
index 0e51620..2fd77e5 100644
--- a/widgets/FloodAnalysis/Widget.js
+++ b/widgets/FloodAnalysis/Widget.js
@@ -9,6 +9,7 @@
"dojo/topic",
'jimu/BaseWidget',
'dojo/on',
+ 'dojo/mouse',
'dstore/Memory',
'dstore/Trackable',
'dgrid/Grid',
@@ -19,7 +20,7 @@
'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,Editor, RequestMemory, createSyncStore, echarts, layer, turf) {
+ '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',
@@ -56,7 +57,7 @@
currentNearPoint:null,
evaluateLayerIndex:"",
//收起框打开状态
- isOpen: true,
+ popupLayer: null,
//api接口
url: {
riverwaySelectName: "http://localhost:82/blade-ycreal/riverway/selectName",
@@ -99,7 +100,7 @@
}
],
startup: function startup() {
- var self = this
+ const self = this
this.bindHtmlElement()
//实时、预测改变事件
$('input[type=radio][name=middleRadio]').change(function () {
@@ -133,6 +134,7 @@
if (self.currentHd){
$('#analysis-pagination').show()
}
+ $('#search-name').val("")
})
//历史风险图按钮点击事件
@@ -145,7 +147,6 @@
self.divFloodHistory.show()
$('#analysis-pagination').hide()
$('#history-pagination').show()
-
//获取历史数据
self.getHistoryList()
@@ -162,6 +163,7 @@
if (self.evaluateLayerIndex){
layer.close(self.evaluateLayerIndex)
self.evaluateLayerIndex = ""
+ $('#restore-icon').hide()
}
setTimeout(function(){//有bug 需要延迟执行隐藏
$("#hd-select").hide()
@@ -169,8 +171,8 @@
})
// 河段输入事件
$('#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();//添加新值 删除旧值
@@ -187,7 +189,7 @@
//河段选择框改变事件
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))
@@ -209,7 +211,7 @@
//水面线选择框改变事件
this.smxSelect.change(function () {
- var selected = $(this).val()
+ let selected = $(this).val()
self.getPointData(selected)
})
@@ -233,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()
+ }
})
},
@@ -272,10 +276,15 @@
//清空表格数据
$('.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() {
@@ -320,6 +329,7 @@
$('#search-name').val("")
$('#glzd').val("")
$('#qdj').val('')
+ $('.restore-icon').hide()
this.isOpen = true
this.analysisBtn.addClass('choose-button')
@@ -374,12 +384,14 @@
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")
@@ -424,17 +436,21 @@
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),
- point: {
- color: Cesium.Color.RED,
- pixelSize: 11,
- //防止地形遮挡住点
- disableDepthTestDistance: Number.POSITIVE_INFINITY,
- heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
- },
+ 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){
@@ -494,37 +510,35 @@
$('#history-pagination').hide()
}
let pageSize = 22
- var count = Math.ceil(tableData.length / pageSize);
- var self = this
+ 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.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]);
}
}
@@ -543,7 +557,7 @@
//减法函数
accSub(arg1,arg2){
- var r1,r2,m,n;
+ 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));
@@ -642,7 +656,7 @@
//防止出现两个小数相加出现很多0的情况
floatAdd(arg1, arg2) {
- var r1, r2, m;
+ let r1, r2, m;
try {
r1 = arg1.toString().split(".")[1].length;
} catch (e) {
@@ -667,7 +681,7 @@
//评估分析弹窗
evaluatePopup(flag) {
- var self = this
+ const self = this
let selectSmx = this.smxDataList.filter(e=>{
return e.smxcode == this.currentSmxcode
})
@@ -675,7 +689,6 @@
let isAnalysis = flag == 'analysis'?true:false
let parentData = {}
-
if (isAnalysis){
parentData.data = this.evaluateData
parentData.hd = this.currentHd
@@ -690,11 +703,11 @@
parentData.point = this.currentSelectHistoryData.smxVal.point
}
- var url = './corelib/common/popup/evaluateAnalysis.html'
- var top = ($(window).height() - 764) / 2;
- var left = ($(window).width() -465);
+ 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: true, //开启最大化最小化按钮
@@ -706,46 +719,16 @@
closeBtn: 0,
shade: 0,
move:false,
- maxmin: true,
+ maxmin: false,
//设置默认不在左下角
minStack:false,
- min: function(layero,index){
- setTimeout(function(){
- layero.css({
- 'width':'50px',
- 'top': '83px',
- 'left':'inherit',
- 'right':'0px',
- })
- })
- //显示最大化icon
- $('.layui-layer-max').css("display","")
- //标题背景改变
- $('.layui-layer-title').css({
- 'background-color':'rgb(255,255,255)'
- })
- },
- restore: function(layero,index) {
- //隐藏最大化icon
- $('.layui-layer-max').css("display","none")
- //还原时窗口长宽会减小,原因未知。因此还原时再设置一次长宽
- layero.css({
- 'width':'465px',
- 'height':'818px'
- })
- //还原标题背景色
- $('.layui-layer-title').css({
- 'background-color':'rgb(0, 73, 135)'
- })
- },
+ zIndex:-100000,
success:function (layero,index) {
-
$('.layui-layer-setwin .layui-layer-min cite').css("background-color",'white')
-
//绑定父子之间的关系,用于数据传递,缺少则无法传递
- var body = layer.getChildFrame("body", index);
+ let body = layer.getChildFrame("body", index);
//得到iframe页的窗口对象
- var iframeWin = window[layero.find('iframe')[0]['name']];
+ let iframeWin = window[layero.find('iframe')[0]['name']];
self.evaluateLayerIndex = index
if (isAnalysis){
@@ -754,12 +737,46 @@
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').css("display","")
+ $('.layui-layer-max').show()
}else {
- $('.layui-layer-max').css("display","none")
+ $('.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
}
});
},
@@ -767,9 +784,9 @@
//http://dgrid.io/tutorials/1.0/hello_dgrid/ 创建表格
createList: function (dataList, txt) {
const self = this
- var CustomGrid = declare([Grid, Keyboard, Selection,Editor]);
- var column, tab, moon, dauy;
- var formatter = function (value,object) {
+ 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 {
@@ -823,18 +840,33 @@
}
tab = 'history-tab2-grid'
}
- var grid = new CustomGrid({
+ 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();
- //change事件
- // grid.on("dgrid-datachange", function(evt){
- // //获取行数据
- // let data = evt.cell.row.data
- // });
+ 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){
@@ -876,6 +908,7 @@
});
}
});
+
grid.renderArray(dataList);
},
@@ -885,6 +918,7 @@
//关闭分析窗口
if (this.evaluateLayerIndex){
layer.close(this.evaluateLayerIndex)
+ $('#restore-icon').hide()
this.evaluateLayerIndex = ""
}
@@ -911,12 +945,12 @@
})
$('.dong-progress').stop().show();
// 总长度
- var totalWidth = $('.dong-progress .container').width();
+ let totalWidth = $('.dong-progress .container').width();
// 过度长度
- var excessiveWidth = totalWidth / 100;
- var watchWidth = 0;
+ let excessiveWidth = totalWidth / 100;
+ let watchWidth = 0;
// 进度条的定时器
- var proTime = setInterval(function () {
+ let proTime = setInterval(function () {
watchWidth += excessiveWidth;
if (watchWidth > totalWidth) {
watchWidth = totalWidth;
--
Gitblit v1.9.3