From e5b3ac602230c6782afcd2ddb5f55020c87b2f25 Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期二, 13 四月 2021 11:16:24 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/panel/RightSearchPanel.vue | 45 ++ src/conf/Topic.js | 15 src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue | 23 + src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue | 4 src/components/LayerController/modules/LcBaseMap.vue | 5 src/components/panel/ToolBoxPanel.vue | 3 src/components/BaseNav/PublicBounced/GasComponents/EChartsHourWasteWater.vue | 678 +++++++++++++++++++++++++++++++++++++++++++++ src/components/panel/LegendPanel.vue | 15 src/components/LayerController/modules/LcServiceLayer.vue | 13 src/Sgis.js | 8 src/components/plugin/PathDrag.js | 2 public/assets/images/map/solidwaste/gf_green.png | 0 public/assets/images/map/wastewater/fs_bright_green.png | 0 public/assets/images/map/solidwaste/gf_green2.png | 0 src/conf/TDT.js | 10 src/main.js | 1 public/assets/images/map/wastewater/fs_bright_greens.png | 0 src/conf/MapConfig.js | 8 src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue | 1 src/components/LayerController/logic/WasteWater.js | 6 src/components/helpers/BasemapHelper.js | 8 src/utils/utils.js | 4 src/components/LayerController/logic/SolidWaste.js | 4 23 files changed, 791 insertions(+), 62 deletions(-) diff --git a/public/assets/images/map/solidwaste/gf_green.png b/public/assets/images/map/solidwaste/gf_green.png index 3238061..975d61c 100644 --- a/public/assets/images/map/solidwaste/gf_green.png +++ b/public/assets/images/map/solidwaste/gf_green.png Binary files differ diff --git a/public/assets/images/map/solidwaste/gf_green2.png b/public/assets/images/map/solidwaste/gf_green2.png new file mode 100644 index 0000000..975d61c --- /dev/null +++ b/public/assets/images/map/solidwaste/gf_green2.png Binary files differ diff --git a/public/assets/images/map/wastewater/fs_bright_green.png b/public/assets/images/map/wastewater/fs_bright_green.png index 9d6dae8..cb30683 100644 --- a/public/assets/images/map/wastewater/fs_bright_green.png +++ b/public/assets/images/map/wastewater/fs_bright_green.png Binary files differ diff --git a/public/assets/images/map/wastewater/fs_bright_greens.png b/public/assets/images/map/wastewater/fs_bright_greens.png new file mode 100644 index 0000000..9d6dae8 --- /dev/null +++ b/public/assets/images/map/wastewater/fs_bright_greens.png Binary files differ diff --git a/src/Sgis.js b/src/Sgis.js index 8c5b3c9..d46bfc2 100644 --- a/src/Sgis.js +++ b/src/Sgis.js @@ -1,7 +1,6 @@ -import BasemapHelper from '@components/helpers/BasemapHelper' -import VectorLayerHelper from '@components/helpers/VectorLayerHelper' + // 鍒濆鍖栨樉绀� -import '@components/plugin/PathDrag' + import MapConfig from '@/conf/MapConfig' import '@components/plugin/PathDashFlow' // 娴佸姩绾垮浘 import DownLoad from '@components/plugin/DownLoad' @@ -17,7 +16,8 @@ import '@/components/plugin/magicMarker.css' import '@components/plugin/pulse/Pulse' // marker 澶栧湀娉� import '@components/plugin/pulse/Pulse.css' // marker 澶栧湀娉� css - +import BasemapHelper from '@components/helpers/BasemapHelper' +import VectorLayerHelper from '@components/helpers/VectorLayerHelper' let map = null const L = window.L const initMap = (div, mapOption) => { diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue index 3f5e8cc..63f6a30 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue @@ -58,7 +58,6 @@ <script> import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList' -// import dayjs from 'dayjs' export default { name: 'ECharts', diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue index 2dd2517..ce8f4e9 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue @@ -154,7 +154,7 @@ }, CreateChart: function (id, title, legend, xdata, ydatas, yname, jcdID, datatype) { this.myChart = this.$echarts.init(this.$refs.main) - // this.myChart.clear() + this.myChart.clear() var dataUnit = '' if (datatype === 1) { dataUnit = '姘旈噺(m鲁/d)' @@ -339,7 +339,6 @@ }, legend: { // 鍥句緥 data: legend - // color: }, dataZoom: [{ type: 'inside', @@ -537,6 +536,7 @@ // } // } } + } </script> diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHourWasteWater.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHourWasteWater.vue new file mode 100644 index 0000000..3a14a98 --- /dev/null +++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHourWasteWater.vue @@ -0,0 +1,678 @@ +<!-- 灏忔椂鏁版嵁 --> +<template> + <div id="Tab"> + <div class="infomation"> + <div> + <span class="grid-content">姘哀鍖栫墿 :<i>29.93</i> 鏍囧噯 : 100</span> + <span class="grid-content">浜屾哀鍖栫~ : <i>17.34</i> 鏍囧噯 : 50</span> + <span class="grid-content">鐑熷皹 : <i>6.93</i> 鏍囧噯 : 30</span> + <span class="grid-content">搴熸皵娴侀噺 : <i>120343.18</i></span> + </div> + </div> + <div class="form-echrts"> + <div class="from-search"> + <div class="pickerMon"> + <div class="pickerData"> + <span> 寮�濮嬫椂闂�:</span> + <span class="pickerTable"> + <el-date-picker type="datetime" v-model="formInline.timeStart"> + </el-date-picker> + </span> + </div> + <div class="pickerData"> + <span >缁撴潫鏃堕棿:</span> + <span class="pickerTable"> + <el-date-picker + type="datetime" + v-model="formInline.timeEnd" + > + </el-date-picker> + </span> + </div> + </div> + <div> + 閲囨牱鐐规暟: + <el-select v-model="formInline.region"> + <el-option label="0" value="0"></el-option> + <el-option label="25" value="25"></el-option> + <el-option label="50" value="50"></el-option> + <el-option label="75" value="75"></el-option> + <el-option label="100" value="100"></el-option> + </el-select> + </div> + <div class="detailbtn" @click="onSubmit">鏌ヨ</div> + <div class="detailbtn" @click="dialogVisible = true" >鏄庣粏琛�</div> + </div> + <div style="width:5rem;height:2rem;" id="echarts" ref="main"> + </div> + </div> + <!-- 鏄庣粏寮规 --> + <el-dialog :visible.sync="dialogVisible" + :append-to-body="true" + :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName" + width="68%" + center + v-dialogDrag + > + <div class="el-dialog-div" style="height: 500px"> + <public-detailed-list v-bind="$attrs"></public-detailed-list> + </div> + </el-dialog> + </div> +</template> + +<script> +import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList' + +export default { + name: 'ECharts', + components: { + PublicDetailedList + }, + data () { + return { + value1: '', + value2: '', + watchData: [], + dialogVisible: false, + myChar: null, + value: '', + formInline: { + region: '', + timeStart: '', + timeEnd: '' + }, + myChart: null, + JsonWater: { + id: 'mycharteff', + title: '', + datatype: 2, + jcdID: '1020', + legend: [ + { + icon: 'image://../assets/imgs/legend/SO2.png', + itemHeight: 5, + itemWidth: 20, + name: 'COD', + testStyle: { + color: '#ccc' + } + }, + { + icon: 'image://../assets/imgs/legend/NOX.png', + itemHeight: 5, + itemWidth: 20, + name: '姘ㄦ爱', + testStyle: { + color: '#ccc' + } + }, + { + icon: 'image://../assets/imgs/legend/VOCs.png', + itemHeight: 5, + itemWidth: 20, + name: '搴熸按娴侀噺', + testStyle: { + color: '#ccc' + } + } + ], + xdata: ['17鏃�', '18鏃�', '19鏃�', '20鏃�', '21鏃�', '22鏃�', '23鏃�', '0鏃�', '1鏃�', '2鏃�', '3鏃�', '4鏃�', '5鏃�', '6鏃�', '7鏃�', '8鏃�', '9鏃�', '10鏃�', '11鏃�', '12鏃�', '13鏃�', '14鏃�', '15鏃�', '16鏃�'], + ydatas: [ + { name: 'COD', data: [5.602, 5.617, 5.612, 5.647, 5.652, 5.673, 5.665, 5.702, 5.69, 5.722, 5.729, 5.755, 5.754, 5.784, 8.593, 12.826, 11.125, 8.582, 8.047, 7.325, 6.452, 5.175, 5.522, 6.039], zdcbcolor: 'red', zxcolor: '#fff21c', bzz: 80 }, + { name: '姘ㄦ爱', data: [0.196, 0.184, 0.189, 0.193, 0.199, 0.201, 0.21, 0.211, 0.214, 0.213, 0.214, 0.214, 0.214, 0.214, 0.214, 0.214, 0.213, 0.195, 0.183, 0.183, 0.183, 0.204, 0.223, 0.38], zdcbcolor: 'red', zxcolor: '#00B0F0', bzz: 25 }, + { name: '搴熸按娴侀噺', data: [226.766998, 223.709, 104.838997, 259.417999, 292.963989, 282.291992, 293.272003, 182.985992, 174.287003, 175.011993, 174.307007, 187.044998, 252.026001, 250.365005, 155.317993, 164.723007, 243.785995, 135.520996, 98.18, 185.481995, 226.473999, 215.171005, 250.393005, 254.643997], zdcbcolor: 'red', zxcolor: '#9ACD32', bzz: null } + ], + yname: '娴撳害(mg/l)' + } + } + }, + methods: { + onSubmit () { + console.log(1) + + // const date = [this.value1, this.value2, this.formInline.region] + this.effChartShow(this.JsonWater.id, this.JsonWater.title, this.JsonWater.legend, this.JsonWater.xdata, this.JsonWater.ydatas, this.JsonWater.yname, this.JsonWater.id, this.JsonWater.datatype) + // console.log(date) + // if (date) { + // var date1 = new Date(date) + // date1 = new Date(date1.getTime() - (8 * 3600000)) + // console.log(date1) + // var dateUtil = new DateUtil() + // var datePkg = dateUtil.getTowDate(date1, "a", 24 * 3600000 - 1); + // var datatype = 2; + }, + effChartShow: function (id, title, legend, xdata, ydatas, yname, jcdID, datatype) { + this.myChart = this.$echarts.init(this.$refs.main) + this.myChart.clear() + var dataUnit = '' + if (datatype === 1) { + dataUnit = '娴侀噺(m鲁/d)' + } else { + dataUnit = '娴侀噺(m鲁/h)' + } + + var serLists = [] + for (var j = 0; j < ydatas.length; j++) { + var len = ydatas[j].data.length + for (var k = 0; k < len; k++) { + var it = ydatas[j].data[k] + var it2 = parseFloat(it).toFixed(2) + ydatas[j].data[k] = it2 + } + } + for (var i = 0; i < ydatas.length; i++) { + // var zdcbcolor = ydatas[i].zdcbcolor + var bz = ydatas[i].bzz + var obj + if (bz) { + obj = { + name: ydatas[i].name, + symbol: 'circle', // 鎶樼偣褰㈢姸 + symbolSize: 10, // 澶у皬 + smooth: false, // 鐩寸嚎 锛宼rue 涓烘洸绾� + itemStyle: { + normal: { + color: function (c) { // 鏍规嵁value 鏄剧ず涓嶅悓鐨勬姌鐐归鑹� + /* var biaozhuiz + for (var i = 0; i < bzzList.length; i++) { + if (bzzList[i].name == c.seriesName) { + biaozhuiz = bzzList[i].bzhui + } + } + if (c.value > biaozhuiz) { + return zdcbcolor + } else if (c.value > biaozhuiz * 0.9) { + return '#FFA500' + } else { + return '#33c95f' + } */ + }, + lineStyle: { // 鎶樼嚎鐨勯鑹� + color: ydatas[i].zxcolor, + width: 5 + }, + borderColor: 'black', // 鎶樼偣杈规鐨勯鑹� + label: { // 鏄剧ず鍊� + show: false + } + } + + }, + type: 'line', + data: ydatas[i].data, + markLine: { // 骞冲潎鍊� 锛� 鍜� 鎸囨爣涓婇檺 + symbol: 'none', + data: [{ + label: { + normal: { + position: 'end', + formatter: '' // ydatas[i].name+'鏍囧噯鍊�' //+'{c}' + } + }, + name: '鏍囧噯鍊�', + yAxis: bz, + lineStyle: { + color: ydatas[i].zxcolor, + type: 'dashed', + width: 2 + } + } + ] + } + } + } else { + obj = { + name: ydatas[i].name, + symbol: 'circle', // 鎶樼偣褰㈢姸 + symbolSize: 10, // 澶у皬 + smooth: false, // 鐩寸嚎 锛宼rue 涓烘洸绾� + yAxisIndex: 1, + itemStyle: { + normal: { + color: function (c) { // 鏍规嵁value 鏄剧ず涓嶅悓鐨勬姌鐐归鑹� + /* var biaozhuiz + for (var i = 0; i < bzzList.length; i++) { + if (bzzList[i].name == c.seriesName) { + biaozhuiz = bzzList[i].bzhui + } + } + if (c.value > 9999999) { + return zdcbcolor + } else { + return '#33c95f' + } */ + }, + lineStyle: { // 鎶樼嚎鐨勯鑹� + color: ydatas[i].zxcolor, + width: 5 + }, + borderColor: 'black', // 鎶樼偣杈规鐨勯鑹� + label: { // 鏄剧ず鍊� + show: false + } + } + }, + type: 'line', + data: ydatas[i].data + } + } + serLists.push(obj) + } + var option = + { + /* title: { + text: title, + }, */ + tooltip: { // 鎻愮ず妗� + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + color: '#1a4245' + } + }, + formatter: function (params) { + var s = params[0].name + '<br />' + for (var i = 0; i < params.length; i++) { + // var name = params[i].name + // 鍥捐〃title鍚嶇О + var seriesName = params[i].seriesName + // 鍊� + var value = params[i].value + var valueFliter + if (value === 'NaN') { + valueFliter = '' + } else { + // valueFliter = formatter(value) + } + var maker = params[i].marker + if (seriesName === 'COD') { + maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#fff21c;"></span>' + } else if (seriesName === '姘ㄦ爱') { + maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#00B0F0;"></span>' + } else if (seriesName === '鎬荤7') { + maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#f48183;"></span>' + } else if (seriesName === '鎬绘爱') { + maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#d9f2f4;"></span>' + } else { + maker = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#9ACD32;"></span>' + } + s += maker + seriesName + ':' + valueFliter + '<br />' + } + return s + } + }, + toolbox: { // 鎵撳嵃绛夊伐鍏� + show: false, + feature: { + saveAsImage: {} + } + }, + grid: { // 缃戞牸 + top: '20%', + left: '5%' + }, + legend: { + data: legend + }, + dataZoom: [{ + type: 'inside', + start: 0, + end: 100 + }, { + start: 0, + end: 100, + show: false, + handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', + handleSize: '80%', + handleStyle: { + color: '#fff', + shadowBlur: 3, + shadowColor: 'rgba(0, 0, 0, 0.6)', + shadowOffsetX: 2, + shadowOffsetY: 2 + } + }], + xAxis: { // x 杞磋缃� + type: 'category', + boundaryGap: false, + axisLabel: { // x杞村叏閮ㄦ樉绀� + rotate: 20, + interval: 0, + textStyle: { + color: '#fff' + } + }, + splitLine: { // 缃戞牸鍨傜洿绾夸负 铏氱嚎 + show: true, + lineStyle: { + type: 'dashed' + } + }, + axisTick: { // x 杞村埢搴︽樉绀� + show: false + }, + axisLine: { + lineStyle: { + color: '#FFFFFF', + width: 1// 杩欓噷鏄负浜嗙獊鍑烘樉绀哄姞涓婄殑 + } + }, + data: xdata + }, + yAxis: [{ + type: 'value', + name: yname, + /* max: function (value) { + var max_val_list = [] // 鎵�鏈夋樉绀烘姌绾跨殑鏍囧噯鍊� + if (bzzList && bzzList.length > 0) { + $.each(bzzList, function (index, item) { + max_val_list.push(item.bzhui) + }) + } + max_val_list = max_val_list.sort(function (a, b) { + return a - b + }) // 鎺掑簭 + var ma = value.max > max_val_list[max_val_list.length - 1] ? value.max + 5 : max_val_list[max_val_list.length - 1] + return parseInt(ma) + }, */ + axisLabel: { + formatter: '{value}', + textStyle: { + color: '#fff' + } + }, + axisPointer: { + snap: true + }, + splitLine: { + show: false + }, // y杞� 缃戞牸绾夸笉鏄剧ず, + axisLine: { + lineStyle: { + color: '#FFFFFF', + width: 1// 杩欓噷鏄负浜嗙獊鍑烘樉绀哄姞涓婄殑 + } + } + }, { + type: 'value', + name: dataUnit, + axisLabel: { + formatter: '{value}', + textStyle: { + color: '#fff' + } + }, + axisPointer: { + snap: true + }, + splitLine: { + show: false + }, // y杞� 缃戞牸绾夸笉鏄剧ず, + // inverse: true, + // nameLocation: 'start', + // max:500, + axisLine: { + lineStyle: { + color: '#FFFFFF', + width: 1// 杩欓噷鏄负浜嗙獊鍑烘樉绀哄姞涓婄殑 + } + } + }], + series: serLists + } + this.myChart.setOption(option) + /* + myChart.on('legendselectchanged', function (params) { + // console.log(params); + var StdVal = null + var op = { yAxis: {} } + if (params.selected.COD) { + if (bzzList && bzzList.length > 0) { + for (let i = 0; i < bzzList.length; i++) { + if (bzzList[i].name == 'COD') { + StdVal = bzzList[i].bzhui + } + } + } + + op.yAxis.max = function (value) { + var ma + if (value.max < StdVal) { + ma = StdVal + } else { + ma = Math.ceil(value.max) + } + return ma + } + } else if (params.selected['鎬绘爱']) { + if (bzzList && bzzList.length > 0) { + for (let i = 0; i < bzzList.length; i++) { + if (bzzList[i].name == '鎬绘爱') { + StdVal = bzzList[i].bzhui + } + } + } + op.yAxis.max = function (value) { + var ma + if (value.max < StdVal) { + ma = StdVal + } else { + ma = Math.ceil(value.max) + } + return ma + } + } else if (params.selected['姘ㄦ爱']) { + if (bzzList && bzzList.length > 0) { + for (let i = 0; i < bzzList.length; i++) { + if (bzzList[i].name == '姘ㄦ爱') { + StdVal = bzzList[i].bzhui + } + } + } + op.yAxis.max = function (value) { + var ma + if (value.max < StdVal) { + ma = StdVal + } else { + ma = Math.ceil(value.max) + } + return ma + } + } else if (params.selected['鎬荤7']) { + if (bzzList && bzzList.length > 0) { + for (let i = 0; i < bzzList.length; i++) { + if (bzzList[i].name == '鎬荤7') { + StdVal = bzzList[i].bzhui + } + } + } + op.yAxis.max = function (value) { + var ma + if (value.max < StdVal) { + ma = StdVal + } else { + ma = Math.ceil(value.max) + } + return ma + } + } + myChart.setOption(op) + }) + */ + + /** + * 瑙e喅myChart.on('click',function(){...})浜嬩欢閲嶅瑙﹀彂鐨勯棶棰� + * Date: 20200720 + */ + this.myChart.off('click') + + /** + * 鍥炬爣鐐瑰嚮浜嬩欢 + * 20190426 add + * */ + /* myChart.on('click', function (params) { + // console.log('[鐩戞祴鐐筰d=%s]',jcdID) + + // 鑾峰彇褰撳墠鏃堕棿锛屽皬鏃� + var nowHours = new Date().Format('hh') + // console.log('[褰撳墠灏忔椂鏄細%s]',nowHours); + + // 鐐瑰嚮鎶樼嚎鍥炬姌鐐瑰搴旂殑鏃堕棿 + // 闇�瑕佷紶鐨勬椂闂翠负 + var _date = null + if (params.name.indexOf('鏃�') != -1) { + var hours = params.name.substring(0, params.name.indexOf('鏃�')) + // console.log('[鍧愭爣杞村搴旂殑鏃堕棿涓�%s]',hours); + + if (parseInt(hours) < parseInt(nowHours)) { + _date = new Date().Format('yyyy-MM-dd') + ' ' + hours + ':00:00' + } else { + var currentDate = new Date() + // 24灏忔椂涔嬪墠鏃堕棿 + var stringDate = new Date(currentDate.getTime() - 24 * 60 * 60 * 1000).Format('yyyy-MM-dd') + + _date = stringDate + ' ' + hours + ':00:00' + } + + // console.log('[闇�瑕佷紶閫掔殑鏃堕棿涓猴細%s]',_date); + } else if (params.name.indexOf('鏃�') != -1) { + var day = params.name.substring(0, params.name.indexOf('鏃�') - 1) + _date = new Date().Format('yyyy-MM') + '-' + day.trim() + } + + // todo 璋冩帴鍙� 鏌ュ嚟璇� + + if (params.color != 'red') { + var poltMtrlId + var monItemId = 28 + for (var i = 0; i < wrwIDS.length; i++) { + if (params.seriesName == wrwIDS[i].name) { + poltMtrlId = wrwIDS[i].id + } + } + + getCBMX(jcdID, poltMtrlId, monItemId, _date, function (res) { + createDivByMouse(res, params.event) + }) + } + // createDivByMouse("s",params.event); + }) */ + }, + drawChart: function () { + window.onresize = function () { + var h1 = document.documentElement.clientHeight// 鑾峰彇灞忓箷鐨勯珮搴� + if (h1 > 700) { + this.myChart.getDom().style.height = 3 + 'rem' + this.myChart.getDom().style.width = 6 + 'rem' + } else { + this.myChart.getDom().style.height = 3 + 'rem' + this.myChart.getDom().style.width = 6 + 'rem' + } + this.myChart.resize() + } + } + + } + +} +</script> + +<style scoped lang="less"> +.grid-content{ + font-size: 8px; + background-color: #2e4967; + text-align: center; + border-radius: 2px; + margin-right: 10px; + padding:0 10px +} +.infomation { + padding: 5px 10px; +} + +.form-echrts { + width: 100%; + border-top: 1px solid #396d83; + //margin: 10px 10px 10px 10px; + .from-search{ + display: flex; + padding:5px; + >div{margin-left: 10px} + .pickerMon{ + display: flex; + >div:first-child { + margin-right: 10px; + } + .pickerData{ + flex: 1; + display: flex; + >span{line-height: 22px} + .pickerTable { + margin-left: 3px; + } + } + } + /deep/.el-date-editor--datetime{ + width: 100%; + } + /deep/.el-input__inner{ + position: relative; + width:140px; + background-color: #2e4967; + color: #ffffff; + font-size: 12px; + height: 24px; + padding: 0; + border-color:#00fff6; + text-align: center; + //padding-left:20px ; + //padding: 0!important; + } + /deep/.el-input__icon{ + display: block; + width: 140px; + height: 22px; + line-height: 22px; + cursor: pointer; + font-size: 0; + } + .echatsInput{ + color: #00ffff; + background-color: #2e4967; + border: none; + border-radius: 6px; + width: 80px; + height: 22px; + text-align: center; + } + input::-webkit-calendar-picker-indicator { + opacity: 100; + } + .detailbtn{ + background-color:#2e4967; + text-align: center; + padding: 0 7px; + line-height: 24px; + border-radius: 4px; + margin-right: 6px; + } + .detailbtn:hover{ + box-shadow: 0 0 0.03rem #fff700 !important; + color:#fff700 !important; + cursor: pointer; + } + } + .el-dialog-div { + //height: 50vh!important; + overflow: auto; + //overflow: hidden; + } + + #echarts { + margin: 0; + padding: 0; + } +} +</style> diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue index 1c442fd..13ee10e 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue @@ -9,6 +9,10 @@ <li @click='tabTaggle("EChartsHour")'>灏忔椂鏁版嵁</li> <li @click='tabTaggle("EChartsDate")'>鏃ユ暟鎹�</li> <li @click='tabTaggle("EChartsDate")'>浜哄伐鏁版嵁</li> + <li :class="active==0?'hover':''" @click='tabTaggle("EChartsHour",0)'>瀹炴椂鏁版嵁</li> + <li :class="active==1?'hover':''" @click='tabTaggle("EChartsHour",1)'>灏忔椂鏁版嵁</li> + <li :class="active==2?'hover':''" @click='tabTaggle("EChartsHourWasteWater",2)'>鏃ユ暟鎹�</li> + <li :class="active==3?'hover':''" @click='tabTaggle("ECharts",3)'>浜哄伐鏁版嵁</li> </ul> <div class="legend" > <span >姝e父</span> @@ -26,28 +30,31 @@ import EChartsHour from './EChartsHour' import EChartsDate from './EChartsDate' import ECharts from './Echarts' +// import EChartsDate from './EChartsDate' +import EChartsHourWasteWater from './EChartsHourWasteWater' export default { name: 'PublicChart', components: { EChartsHour, EChartsDate, - ECharts + ECharts, + // EChartsDate + EChartsHourWasteWater }, data () { return { - currentTab: 'EChartsHour' + currentTab: 'EChartsHour', + active: '0' } }, methods: { - tabTaggle (taggleMenu) { + tabTaggle (taggleMenu, num) { this.currentTab = taggleMenu + this.active = num // debugger } } - // created () { - // this.$refs.CreateChart - // } } </script> @@ -112,10 +119,10 @@ margin-right: 10px; padding:0 15px } - +.tab li.hover, .tab li:hover { background-color: #0e639e; - color: #682000; + color: #fff; cursor: pointer; } .legend{ diff --git a/src/components/LayerController/logic/SolidWaste.js b/src/components/LayerController/logic/SolidWaste.js index 91a6455..8f9e12b 100644 --- a/src/components/LayerController/logic/SolidWaste.js +++ b/src/components/LayerController/logic/SolidWaste.js @@ -4,7 +4,7 @@ // 鍖哄垎涓嶅悓绫诲瀷 浣跨敤涓嶅悓img const defaultImg = '/assets/images/map/solidwaste/voc.png' -const setting = '/assets/images/map/solidwaste/gf_green.png' +const setting = '/assets/images/map/solidwaste/gf_green2.png' // 璇锋眰鎺ュ彛鏁版嵁 const mapApi = require('../../../api/mapApi').default @@ -88,7 +88,7 @@ // 閫氳繃鏂规硶 鍚戠粦瀹氬脊妗嗕紶閫掓暟鎹� instance.setData(resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei') /* flyTo()寮瑰嚭妗嗗钩绉讳簨浠� */ - this.setPanTo(e.latlng, 80) + this.setPanTo(e.latlng, 200) } // flayTo() 寮规鐨勫彲婊戝姩浜嬩欢 diff --git a/src/components/LayerController/logic/WasteWater.js b/src/components/LayerController/logic/WasteWater.js index 671df7b..5b510ae 100644 --- a/src/components/LayerController/logic/WasteWater.js +++ b/src/components/LayerController/logic/WasteWater.js @@ -6,10 +6,10 @@ // 寮圭獥鏁版嵁寮曡繘 const publicBounced = require('../../BaseNav/PublicBounced/PublicBounced').default -const NormalImg = '/assets/images/map/wastewater/fs_green.png' // 姝e父 +const NormalImg = '/assets/images/map/wastewater/fs_bright_green.png' // 姝e父 const OffImg = '/assets/images/map/wastewater/fs_gray.png' // 鍋滆繍 const AbnormalImg = '/assets/images/map/wastewater/fs_blue.png' // 寮傚父 -const MissImg = '/assets/images/map/wastewater/fs_yellow.png' // 缂哄け +const MissImg = '/assets/images/map/wastewater/fs_bright_green.png' // 缂哄け const AlarmImg = '/assets/images/map/wastewater/fs_red.png' // 鎶ヨ闂儊 const WarnImg = '/assets/images/map/wastewater/fs_orange.png' // 棰勮闂儊 @@ -73,7 +73,7 @@ } const hourData = await mapApi.getQueryOnlineMonData(hourValue) const dateData = await mapApi.getQueryOnlineMonData(dateValue) - console.log(dateData) + // console.log(dateData) // const drawback = await mapApi.getWasteWaterMonitoring() // console.log(drawback) const result = await mapApi.getWasteWaterMonitoringDetails(dataValue) diff --git a/src/components/LayerController/modules/LcBaseMap.vue b/src/components/LayerController/modules/LcBaseMap.vue index 801148f..87c3621 100644 --- a/src/components/LayerController/modules/LcBaseMap.vue +++ b/src/components/LayerController/modules/LcBaseMap.vue @@ -30,13 +30,14 @@ methods: { updateBasemapList () { this.basemapList = this.basemapHelper.getBasemapList() - console.log(this.basemapList) + // console.log(this.basemapList) }, changeBasemap (itm) { + // console.log(itm) const code = itm.code this.basemapList.forEach((item) => { if (item.code === code) { - console.log(this.currentBaseMapCode) + // console.log(this.currentBaseMapCode) if (this.currentBaseMapCode == null || this.currentBaseMapCode !== code) { this.currentBaseMapCode = code this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, true) diff --git a/src/components/LayerController/modules/LcServiceLayer.vue b/src/components/LayerController/modules/LcServiceLayer.vue index f6af058..153db9d 100644 --- a/src/components/LayerController/modules/LcServiceLayer.vue +++ b/src/components/LayerController/modules/LcServiceLayer.vue @@ -7,7 +7,7 @@ <i class="downUp el-icon-caret-bottom" @click="item.isShow=!item.isShow" :class="item.isShow?'':'active'" ></i><!-- el-icon-arrow-down --> <!-- 涓�绾у浘灞傞亶鍘� --> <div style="padding-left:25px;padding-top:10px;color:#fff"> - <input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code" @change="swAllLayers(item)"/>{{ item.name }} + <input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code" @change="swAllLayers(item,'')"/>{{ item.name }} </div> <div class="layerbox-item" v-show="item.isShow"> <!-- 浜岀骇鍥惧眰閬嶅巻 --> @@ -16,7 +16,7 @@ :name="'wmsSublayers_'+item.code+'_'+itm.code" :checked="itm.checked" :value="itm.code" - @change="swAllLayers(itm)"/>{{ itm.name }} + @change="swAllLayers(itm,item.name)"/>{{ itm.name }} <!-- 涓夌骇鍥惧眰閬嶅巻 --> <div class="layerbox-item-3"> <div class="basemap-layer-item" v-for="layer in itm.layers" :key="layer.code"> @@ -24,7 +24,7 @@ :name="'wmsSublayers_'+item.code+'_'+layer.code" :checked="layer.checked" :value="layer.code" - @change="swAllLayers(layer)"/> + @change="swAllLayers(layer,'')"/> <span :style="'color:'+layer.color">{{ layer.name }}</span> </div> </div> @@ -39,7 +39,7 @@ <script> import LcServiceLayerFilter from '@components/LayerController/modules/LcServiceLayerFilter' - +import bus from '@/eventBus' export default { name: 'LcServiceLayer', components: { LcServiceLayerFilter }, @@ -51,11 +51,14 @@ mounted () { }, methods: { - swAllLayers (item) { + swAllLayers (item, v) { // eslint-disable-next-line no-debugger item.checked = !item.checked this.toggleLayer(item) this.swLayers(item.layers, item.checked) + if (v === '涓撻鍥惧眰') { + bus.$emit('changeSearchBar', item) + } }, swLayers (layers, checked) { if (layers) { diff --git a/src/components/helpers/BasemapHelper.js b/src/components/helpers/BasemapHelper.js index 49af53e..9fc4059 100644 --- a/src/components/helpers/BasemapHelper.js +++ b/src/components/helpers/BasemapHelper.js @@ -1,6 +1,6 @@ /* eslint-disable no-debugger */ import AjaxUtils from '@/utils/AjaxUtils' -import * as utils from '../../utils/utils' +// import * as utils from '../../utils/utils' /** * 搴曞浘绠$悊鍔╂墜锛岃礋璐e簳鍥惧垱寤哄強寮�鍏� */ @@ -79,10 +79,8 @@ const internetBasemaps = config.mapConfig.InternetBaseMaps for (let i = 0, len = internetBasemaps.length; i < len; ++i) { const basemapConfig = internetBasemaps[i] - const mapToken = utils.getRandomTDTToken() - const mapUrl = utils.changeURLArg(basemapConfig.map.url, 'tk', mapToken) - const basemapLayer = this.L.tileLayer(mapUrl, basemapConfig.map.option) - const basemapAnnotationLayer = this.L.tileLayer(mapUrl, basemapConfig.annotation.option) + const basemapLayer = this.L.tileLayer(basemapConfig.map.url, basemapConfig.map.option) + const basemapAnnotationLayer = this.L.tileLayer(basemapConfig.annotation.url, basemapConfig.annotation.option) const basemap = { code: basemapConfig.code, diff --git a/src/components/panel/LegendPanel.vue b/src/components/panel/LegendPanel.vue index d14a1b3..36e0efd 100644 --- a/src/components/panel/LegendPanel.vue +++ b/src/components/panel/LegendPanel.vue @@ -32,7 +32,7 @@ import { LayerPipeLines } from '../../conf/layers/LayerPipeLines' import { LayerPk } from '../../conf/layers/LayerPk' import { LayerArea } from '../../conf/layers/LayerArea' - +import bus from '@/eventBus' export default { name: 'LegendPanel', data () { @@ -42,10 +42,23 @@ serviceLayers: [LayerSoilGroundWater, LayerEnvRisk, LayerAirQuality, LayerWasteSolid, LayerWasteGas, LayerWasteWater, LayerArea, LayerPk, LayerPipeLines] } }, + mounted () { + const that = this + bus.$on('changeState', function (state) { + if (state.num !== 4 && state.type) { + that.isShow = false + } + }) + }, methods: { // 鍥炬爣 鎺у埗鍐呭鐨勫睍绀轰笌闅愯棌 legendChange () { this.isShow = !this.isShow + const state = { + type: this.isShow, + num: 4 + } + bus.$emit('changeState', state) } } } diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue index 28910bb..cc2ba13 100644 --- a/src/components/panel/RightSearchPanel.vue +++ b/src/components/panel/RightSearchPanel.vue @@ -12,7 +12,7 @@ </div> </li> </ul> --> - <ul v-for="item in topicList" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" > + <ul v-for="item in topicList" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" v-show="item.isShow" > <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left"> <li> <img src="../../assets/images/map-pages/icon/sl.png" class="icon"> @@ -26,11 +26,11 @@ <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div> </div> <div :class="'search-container map-background'" v-show="selectGroup" > - <div @click="setSearchPanelChange" type="button" class="el-button special-button el-button--default "> + <div @click="setSearchPanelChange" class="el-button special-button el-button--default "> <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i> <i class=" el-icon-d-arrow-left" v-else ></i> </div> - <div class="el-message-box__content" style="padding:0 6px 6px 6px;font-size: 13px;"> + <div class="el-message-box__content" style="padding:0;font-size: 13px;"> <component :title="title" :is="gcComp"></component> </div> </div> @@ -55,6 +55,7 @@ import SolidWasteSearch from '@components/panel/topicSearch/SolidWasteSearch' import SewersSearch from '@components/panel/topicSearch/SewersSearch' import SoilGroundWaterSearch from '@components/panel/topicSearch/SoilGroundWaterSearch.vue' +import bus from '@/eventBus' export default { name: 'MonitorPanel', components: { GasWasteSearch, WaterWasteSearch, SolidWasteSearch, EnvRiskSearch, DischargeSearch }, @@ -66,7 +67,6 @@ topicCheckedList: [], isPanelVisible: false, gcComp: SewersSearch, - gdVisible: true, hbVisible: false, pkVisible: false, @@ -74,7 +74,7 @@ title: '姹¢洦姘寸缃�', isCollapse: true, - selectGroup: true + selectGroup: false } }, computed: {}, @@ -116,13 +116,13 @@ case '姹℃煋婧�': this.gcComp = DischargeSearch break - case '搴熸按鐩戞祴': + case '搴熸按': this.gcComp = WaterWasteSearch break - case '搴熸皵鐩戞祴': + case '搴熸皵': this.gcComp = GasWasteSearch break - case '鍥哄簾绠$悊': + case '鍥哄簾': this.gcComp = SolidWasteSearch break case '鐜椋庨櫓': @@ -131,7 +131,7 @@ case '鍦熷¥鍙婂湴涓嬫按': this.gcComp = SoilGroundWaterSearch break - case '姹¢洦姘寸缃�': + case '绠$綉': this.gcComp = SewersSearch break } @@ -180,9 +180,32 @@ // speed: 1000 // }) // } + }, + defaultLastOne () { + let v = {} + this.topicList.forEach((item) => { + if (item.isShow) { + v = item + } + }) + this.selected(v) } }, mounted () { + const that = this + bus.$on('changeSearchBar', function (obj) { + // console.log(obj.checked, obj.name) + that.topicList.forEach((item) => { + if (item.name === obj.name) { + item.isShow = obj.checked + if (item.isShow) { + that.selected(item) + } else { + that.defaultLastOne() + } + } + }) + }) } } </script> @@ -199,7 +222,7 @@ .search-container { position: relative; width: 1.79167rem; - /*height: 5.6475rem;*/ + /* height: 5.6475rem;*/ overflow: hidden; } .module-wrap{ @@ -716,7 +739,7 @@ .panel-title{} .search-panel{ background-color: transparent; - padding: 10px 0; + padding: 10px; border-bottom: 1px solid @background-color-split; // .el-input{width:calc(100% - 40px);position: relative} /deep/ input { diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue index 1e62696..585dba3 100644 --- a/src/components/panel/ToolBoxPanel.vue +++ b/src/components/panel/ToolBoxPanel.vue @@ -278,7 +278,6 @@ }) }, methods: { - init (map) { this.map = map this.toolBoxPanelVisible = true @@ -288,7 +287,7 @@ this.drawLayer = this.L.layerGroup().addTo(this.map) } this.active = index - console.log(this.basemapList) + // console.log(this.basemapList) for (let i = 0; i < this.isShow.length; i++) { if (i !== index) { this.isShow[i] = false diff --git a/src/components/plugin/PathDrag.js b/src/components/plugin/PathDrag.js index 4566b86..4916866 100644 --- a/src/components/plugin/PathDrag.js +++ b/src/components/plugin/PathDrag.js @@ -136,4 +136,4 @@ }); } -}); \ No newline at end of file +}); diff --git a/src/conf/MapConfig.js b/src/conf/MapConfig.js index 6e6ea34..445e160 100644 --- a/src/conf/MapConfig.js +++ b/src/conf/MapConfig.js @@ -45,10 +45,6 @@ } // 姹¢洦姘村浘灞傞厤缃� } -const mapTokenArray = ['5d76218063082952d18b76da5005f490', - 'f1b72b5e7cb1175acddfa485f1bc9770', - 'ac8bbce8119b337d75d4b06696f6186d', - '9bf834ce1ba3ba01c568147e9bfcab7c'] /** * 鍐呯綉GIS锛岃幏鍙杢oken鍙傛暟 */ @@ -84,7 +80,7 @@ mapOptions, mapConfig, TokenConfig, - BLUEMAP_HOST, - mapTokenArray + BLUEMAP_HOST + // mapTokenArray // MagicMaker } diff --git a/src/conf/TDT.js b/src/conf/TDT.js index b91a337..5a02c16 100644 --- a/src/conf/TDT.js +++ b/src/conf/TDT.js @@ -1,7 +1,15 @@ // basemap涓绘満閰嶇疆 + const SINOPEC_GIS_HOST = 'http://10.246.132.249:8080' // 鍐呯綉澶╁湴鍥句富鏈哄湴鍧� const TIANDITU_GIS_HOST = 'http://t0.tianditu.gov.cn' // 鍏綉澶╁湴鍥句富鏈哄湴鍧� -const TIANDITU_GIS_TOKEN = '5d76218063082952d18b76da5005f490' // 澶囩敤tk: f1b72b5e7cb1175acddfa485f1bc9770 + +const mapTokenArray = ['5d76218063082952d18b76da5005f490', + 'f1b72b5e7cb1175acddfa485f1bc9770', + 'ac8bbce8119b337d75d4b06696f6186d', + '9bf834ce1ba3ba01c568147e9bfcab7c'] + +const TIANDITU_GIS_TOKEN = mapTokenArray[Math.floor(Math.random() * mapTokenArray.length)] // 澶囩敤tk: f1b72b5e7cb1175acddfa485f1bc9770 + const intranet = [ { code: 'tianditu_img', diff --git a/src/conf/Topic.js b/src/conf/Topic.js index 49707dd..bcf296e 100644 --- a/src/conf/Topic.js +++ b/src/conf/Topic.js @@ -15,42 +15,49 @@ name: '姹℃煋婧�', id: 1, check: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }, { - name: '搴熸按鐩戞祴', + name: '搴熸按', id: 2, checked: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }, { - name: '搴熸皵鐩戞祴', + name: '搴熸皵', id: 3, checked: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }, { - name: '鍥哄簾绠$悊', + name: '鍥哄簾', id: 4, checked: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }, { name: '鐜椋庨櫓', id: 5, checked: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }, { name: '鍦熷¥鍙婂湴涓嬫按', id: 6, checked: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }, { - name: '姹¢洦姘寸缃�', + name: '绠$嚎', id: 7, checked: false, + isShow: true, icon: '/assets/images/menu/special.png', comp: '' }] diff --git a/src/main.js b/src/main.js index 4c254ad..2337442 100644 --- a/src/main.js +++ b/src/main.js @@ -15,6 +15,7 @@ import '@/utils/dialogDrag.js' import '@components/plugin/leaflet-measure-path/leaflet-measure-path.css' import '@components/plugin/leaflet-measure-path/leaflet-measure-path' +import '@components/plugin/PathDrag' const appConfig = require('@/app.config') Vue.config.productionTip = false diff --git a/src/utils/utils.js b/src/utils/utils.js index def6f2a..8ace9bb 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -4,7 +4,6 @@ * arg_val 鏇挎崲鍚庣殑鍙傛暟鐨勫�� * return url 鍙傛暟鏇挎崲鍚庣殑url */ -import MapConfig from '../conf/MapConfig' export function changeURLArg (url, arg, argValue) { var pattern = arg + '=([^&]*)' var replaceText = arg + '=' + argValue @@ -22,7 +21,4 @@ } // eslint-disable-next-line no-unreachable return url + '\n' + arg + '\n' + argValue -} -export function getRandomTDTToken () { - return MapConfig.mapTokenArray[Math.floor(Math.random() * MapConfig.mapTokenArray.length)] } -- Gitblit v1.8.0