From 124666224532543877aaf344d16254c0bc4db2b4 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Wed, 16 Jun 2021 11:14:40 +0800
Subject: [PATCH] 图例
---
widgets/legends/Widget.html | 20 ++++++----
widgets/legends/Widget.js | 76 ++++++++++++++++++++++++++++++++++++++
widgets/legends/css/style.css | 8 ++-
widgets/searchL/Widget.js | 14 ++++---
4 files changed, 101 insertions(+), 17 deletions(-)
diff --git a/widgets/legends/Widget.html b/widgets/legends/Widget.html
index 0313f26..2af8bad 100644
--- a/widgets/legends/Widget.html
+++ b/widgets/legends/Widget.html
@@ -1,13 +1,17 @@
<div>
<div class="title">图层列表</div>
<div class="main">
- <div class="m-init"> <i><img src="./images/addL/dwblue.png"/></i> 全景站点 <i>(20个)</i> </div>
- <div class="m-init m-i-child"> <i></i> 大湖池<i>(1个)</i> </div>
- <div class="m-init m-i-child"> <i></i> 战备胡 <i>(1个)</i> </div>
- <div class="m-init"> <i><img src="./images/addL/dworgin.png"/></i> 监控站点 <i>(50个)</i> </div>
- <div class="m-init m-i-child"> <i></i> 大湖池 <i>(1个)</i> </div>
- <div class="m-init"> <i><img src="./images/addL/forgin.png"/></i> 鄱阳湖面积 <i>(3253.52公顷)</i> </div>
- <div class="m-init"> <i><img src="./images/addL/fred.png"/></i> 鄱阳湖范围 <i></i> </div>
- <div class="m-init"> <i><img src="./images/addL/fblue.png"/></i> 其他 <i></i> </div>
+ <div id="legendsInquanjing">
+ <!-- <div class="m-init"> <i><img src="./images/addL/dwblue.png" /></i> 全景站点 <i>(20个)</i> </div> -->
+ <!-- <div class="m-init m-i-child"> <i></i> 大湖池<i>(1个)</i> </div>
+ <div class="m-init m-i-child"> <i></i> 战备胡 <i>(1个)</i> </div> -->
+ </div>
+ <div id="legendsInjiankong">
+ <!-- <div class="m-init"> <i><img src="./images/addL/dworgin.png" /></i> 监控站点 <i>(50个)</i> </div> -->
+ <!-- <div class="m-init m-i-child"> <i></i> 大湖池 <i>(1个)</i> </div> -->
+ </div>
+ <div class="m-init"> <i><img src="./images/addL/forgin.png" /></i> 鄱阳湖面积 <i>(3253.52公顷)</i> </div>
+ <div class="m-init"> <i><img src="./images/addL/fred.png" /></i> 鄱阳湖范围 <i></i> </div>
+ <div class="m-init"> <i><img src="./images/addL/fblue.png" /></i> 其他 <i></i> </div>
</div>
</div>
\ No newline at end of file
diff --git a/widgets/legends/Widget.js b/widgets/legends/Widget.js
index c162293..3177a50 100644
--- a/widgets/legends/Widget.js
+++ b/widgets/legends/Widget.js
@@ -29,9 +29,85 @@
layers: {},
startup: function () {
// 暴露在外的接口
+ topic.subscribe("getLegendsData", lang.hitch(this, this.onGetLegendsData));
},
+ onGetLegendsData: function (item) {
+ var val = item == ' ' ? '' : item;
+ console.log(val)
+ var that = this
+ , twoData = []
+ // url = `http://171.34.76.171:8880/pyh-wetResource/monitorRecords/queryMonitorData?name=&start&limit&type=${index}`
+ , token = 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJpc3MiOiJlY2hpc2FuIiwic3ViIjoiYWRtaW4iLCJpYXQiOjE2MjMyMjU5OTcsImV4cCI6MTYyNTgxNzk5N30.zWpoKa5AK7xLIPNm-CXoHY9D5kpk9AiUTGkuAQOZi2Rdl2BfroT4IqxjBpyUPZlgwCjG2CoJqy_7rnnodpmqNw'
+ , myGet = function (val, i) {
+ var url = `http://171.34.76.171:8880/pyh-wetResource/monitorRecords/queryMonitorData?name=${val}&start&limit&type=${i}`;
+ axios.get(url, {
+ headers: {
+ 'token': token
+ }
+ }).then((res) => {
+ if (res.data.code == 200) {
+ var data = res.data.data.panoramaList || res.data.data.stationList || res.data.data.videoList || []
+ , onceData = {};
+ console.log(data);
+ for (var k in data) {
+ if (i == 0) {
+ onceData[data[k].protectArea] = onceData[data[k].protectArea] == undefined ? 1 : onceData[data[k].protectArea] += 1;
+ } else if (i == 2) {
+ onceData[data[k].protectName] = onceData[data[k].protectName] == undefined ? 1 : onceData[data[k].protectName] += 1;
+ }
+ }
+ twoData.push(onceData)
+ if (i == 2) {
+ ready(twoData);
+ }
+ } else {
+ console.log('请求访问失败')
+ }
+ })
+ }
+ , ready = function (d, i) {
+ console.log(d);
+ // 全景
+ var q = d[0]
+ , num = 0
+ , strq
+ , domq = $('#legendsInquanjing')
+ , h = '';
+ domq.empty();
+ for (var k in q) {
+ num += q[k];
+ h += `<div class="m-init m-i-child"> <i></i> ${k}<i>(${q[k]}个)</i> </div>`;
+ }
+ strq = `<div class="m-init"> <i><img src="./images/addL/全景.png" /></i> 全景站点 <i>(${num}个)</i> </div>` + h;
+ domq.append(strq);
+ // 监控
+ q = d[1];
+ num = 0;
+ strq;
+ domq = $('#legendsInjiankong');
+ h = '';
+ domq.empty();
+ for (var k in q) {
+ num += q[k];
+ h += `<div class="m-init m-i-child"> <i></i> ${k}<i>(${q[k]}个)</i> </div>`;
+ }
+ strq = `<div class="m-init"> <i><img src="./images/addL/监控.png" /></i> 监控站点 <i>(${num}个)</i> </div>` + h;
+ domq.append(strq);
+
+
+ }
+ , doit = () => {
+ var i = 0;
+ myGet(val, i);
+ var i = 2;
+ myGet(val, i);
+
+ }
+
+ doit();
+ },
closeToolBox: function (item) {
},
diff --git a/widgets/legends/css/style.css b/widgets/legends/css/style.css
index 44f48ee..70808b0 100644
--- a/widgets/legends/css/style.css
+++ b/widgets/legends/css/style.css
@@ -1,11 +1,11 @@
.jimu-widget-legends {
position: absolute !important;
font-size: 14px;
- height: 290px !important;
+ max-height: 330px !important;
line-height: 32px;
- width: 230px !important;
+ width: 300px !important;
right: 60px !important;
- bottom: 40px !important;
+ bottom: 5px !important;
left: auto !important;
top: auto !important;
/* 240px */
@@ -18,6 +18,8 @@
z-index: 15 !important;
box-sizing: border-box;
padding: 0 6px 0 6px!important;
+ overflow: auto;
+ transition: all 2s;
}
.jimu-widget-legends .title {
diff --git a/widgets/searchL/Widget.js b/widgets/searchL/Widget.js
index d121f43..768de2c 100644
--- a/widgets/searchL/Widget.js
+++ b/widgets/searchL/Widget.js
@@ -55,6 +55,7 @@
$(".searchImg").click(function () {
that.getInputData();
+ topic.publish('getLegendsData', that.searchDatas);
if (typeof that.searchDatas == 'string') {
var han = /^[\u4e00-\u9fa5]+$/;
if (han.test(that.searchDatas) || that.searchDatas == ' ') {
@@ -101,6 +102,7 @@
$("#local_data").keyup(function (e) {
// console.log(e);
that.getInputData();
+ topic.publish('getLegendsData', that.searchDatas);
if (e.keyCode == 13 && typeof that.searchDatas == 'string') {
var han = /^[\u4e00-\u9fa5]+$/;
if (han.test(that.searchDatas) || that.searchDatas == ' ') {
@@ -380,9 +382,9 @@
// , page: true //是否显示分页
, limits: false
, limit: 10 //每页默认显示的数量
- , done: function(res, curr, count){
+ , done: function (res, curr, count) {
that.addTitle();
- }
+ }
});
@@ -423,9 +425,9 @@
// , page: true //是否显示分页
, limits: false
, limit: 10 //每页默认显示的数量
- , done: function(res, curr, count){
+ , done: function (res, curr, count) {
that.addTitle();
- }
+ }
});
table.on('tool(test1)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
@@ -498,9 +500,9 @@
// , page: true //是否显示分页
, limits: false
, limit: 10 //每页默认显示的数量
- , done: function(res, curr, count){
+ , done: function (res, curr, count) {
that.addTitle();
- }
+ }
});
--
Gitblit v1.9.3