From 89d57baac18111b9d82c0858c0c680f2d481b8c9 Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Fri, 17 Feb 2023 14:23:10 +0800
Subject: [PATCH] 洪水淹没-修改展示样式
---
widgets/FloodAnalysis/Widget.js | 98 +++++++++++++++++++++++++++++++++---------------
1 files changed, 67 insertions(+), 31 deletions(-)
diff --git a/widgets/FloodAnalysis/Widget.js b/widgets/FloodAnalysis/Widget.js
index 18cf964..ceb931e 100644
--- a/widgets/FloodAnalysis/Widget.js
+++ b/widgets/FloodAnalysis/Widget.js
@@ -2,7 +2,24 @@
// 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',
+ '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, Memory, Trackable, Grid, Keyboard, Selection,Editor, RequestMemory, createSyncStore, echarts, layer, turf) {
return declare([BaseWidget], {
baseClass: 'jimu-widget-FloodAnalysis',
name: 'FloodAnalysis',
@@ -105,16 +122,12 @@
}
})
- //历史风险图表格单选框改变事件
- $('input[type=radio][name=tableRadio]').change(function () {
- console.log(this.value)
- })
-
//洪水淹没分析按钮点击事件
this.analysisBtn.click(function () {
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()
@@ -128,6 +141,7 @@
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()
@@ -146,7 +160,6 @@
setTimeout(function(){//有bug 需要延迟执行隐藏
$("#hd-select").hide()
},300)
-
})
// 河道输入事件
$('#hd-input').on("input", function () {
@@ -238,7 +251,8 @@
$('#smx-select option').remove()
$('#sw-input').val("")
$('#hd-input').val("")
- $('#flood-tbody').html("")
+ //清空表格数据
+ $('.location-box-list').empty();
$('#analysis-pagination').hide()
this.analysisTableList = []
@@ -283,6 +297,7 @@
$('.fold-btn').removeClass('close')
$('.content').show()
$("#sw-input").prop('disabled', true);
+ $('#search-name').val("")
this.isOpen = true
this.analysisBtn.addClass('choose-button')
@@ -292,7 +307,10 @@
this.currentHd = null
this.currentSmxcode = ""
+ //获取河段数据
this.getHdData()
+ //获取历史数据
+ this.getHistoryList()
},
//获取河段下拉数据
@@ -450,7 +468,7 @@
if (tableData.length <= 0 && pageElementId == "history-pagination") {
$('#history-pagination').hide()
}
- let pageSize = 19
+ let pageSize = 10
var count = Math.ceil(tableData.length / pageSize);
var self = this
$('#' + pageElementId).pagination({
@@ -469,7 +487,7 @@
}
}
- pageElementId == "analysis-pagination" ? self.loadAnalysisTable(listdata) : self.loadHistoryTable(listdata)
+ pageElementId == "analysis-pagination" ? self.createList(listdata,"洪水淹没分析") : self.createList(listdata,"历史风险图")
}
});
@@ -485,26 +503,7 @@
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)
+ pageElementId == "analysis-pagination" ? self.createList(startData,"洪水淹没分析") : self.createList(startData,"历史风险图")
},
/**
@@ -617,13 +616,13 @@
return (arg1 * m + arg2 * m) / m;
},
+ //删除地图上的标注点位
deleteEntities(entities) {
entities.forEach(e => {
this.map.entities.remove(e)
})
entities = []
},
-
//评估分析弹窗
evaluatePopup() {
@@ -648,6 +647,43 @@
});
},
+ //http://dgrid.io/tutorials/1.0/hello_dgrid/ 创建表格
+ createList: function (dataList, txt) {
+ $('.location-box-list').empty();
+ var CustomGrid = declare([Grid, Keyboard, Selection,Editor]);
+ var column, tab, moon, dauy;
+ if (txt == "洪水淹没分析") {
+ column = {
+ location: '位置',
+ origin: '起点距',
+ water: '水面线',
+ sw: '水位',
+ lng:'经度',
+ lat:'纬度',
+ }
+ tab = 'analysis-tab1-grid'
+ } else if (txt == "历史风险图") {
+ column = {
+ radio:{ label: "", field: "radio", editor: 'radio' },
+ name: '名称',
+ }
+ tab = 'history-tab2-grid'
+ }
+ var grid = new CustomGrid({
+ columns: column,
+ selectionMode: 'none', // for Selection; only select a single row at a time
+ cellNavigation: false, // for Keyboard; allow only row-level keyboard navigation
+ }, tab);
+ grid.startup();
+
+ //点击事件
+ grid.on("dgrid-datachange", function(evt){
+ //获取行数据
+ let data = evt.cell.row.data
+ });
+ grid.renderArray(dataList);
+ },
+
});
});
--
Gitblit v1.9.3