From 7b4d8a5ee0cae50a5f473e3765ba84f28fe8ba4b Mon Sep 17 00:00:00 2001
From: zhangshuaibao <15731629597@163.com>
Date: 星期一, 29 三月 2021 11:27:54 +0800
Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop
---
src/api/request.js | 24 +
src/components/BaseNav/WireSurface/index.js | 22 +
src/components/flueGas/green_airquality_3.png | 0
vue.config.js | 2
src/components/BaseNav/SolidWaste/Popup.vue | 111 ++++++
src/views/MapTemplate.vue | 53 +++
src/components/BaseNav/PublicBounced/PublicBounced.vue | 69 ++++
src/Sgis.js | 2
src/components/flueGas/GasComponents/GasTable.vue | 46 ++
src/components/BaseNav/SolidWaste/SolidWaste.js | 102 ++---
public/static/airQuality.json | 117 ++++++
src/components/flueGas/green_airquality_2.png | 0
src/components/flueGas/GasComponents/GasECharts.vue | 107 ++++++
src/components/flueGas/flueGas.js | 176 ++++++++++
src/main.js | 3
src/components/flueGas/GasComponents/GasVideo.vue | 24 +
src/components/flueGas/popup-gas.vue | 54 +++
src/conf/MapConfig.js | 8
src/utils/axios.js | 3
package.json | 1
src/components/BaseNav/SolidWaste/SolidContent.vue | 79 +++-
21 files changed, 909 insertions(+), 94 deletions(-)
diff --git a/package.json b/package.json
index 1004223..abf1a54 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
"leaflet.markercluster": "^1.4.1",
"lodash": "^4.17.10",
"nprogress": "^0.2.0",
+ "qs": "^6.10.1",
"rbush": "^3.0.1",
"screenfull": "^3.3.3",
"style-resources-loader": "^1.4.1",
diff --git a/public/static/airQuality.json b/public/static/airQuality.json
new file mode 100644
index 0000000..2040078
--- /dev/null
+++ b/public/static/airQuality.json
@@ -0,0 +1,117 @@
+{
+ "Result": {
+ "IsSuccess": 1,
+ "code": 1,
+ "ErrorMsg": "",
+ "DataInfo": [
+ {
+ "StoragePlaceId": 124.0,
+ "StoragePlaceName": "鑱氶啔閮ㄥ簾姘旀帓鏀剧偣",
+ "HazaWasteStorageDate": "0001-01-01T00:00:00",
+ "HazaWasteCatgrName": null,
+ "SurplusQuantityWarning": 0,
+ "LongDayWarning": 0,
+ "DesignFloorArea": 95.0,
+ "HazaWasteName": null,
+ "EstimateFloorArea": 0.0,
+ "HazaWasteDeptName": null,
+ "SurplusFloorArea": 95.0,
+ "HazaWasteStorageDays": 0.0,
+ "StorageQty": 0.0,
+ "HazaWasteStorageQty": 0.0,
+ "positionX": 32.214483532361875,
+ "positionY":118.80441341164345
+ },
+ {
+ "StoragePlaceId": 123.0,
+ "StoragePlaceName": "鍖栧伐閮ㄥ簾姘旀帓鏀剧偣",
+ "HazaWasteStorageDate": "0001-01-01T00:00:00",
+ "HazaWasteCatgrName": null,
+ "SurplusQuantityWarning": 0,
+ "LongDayWarning": 0,
+ "DesignFloorArea": 260.0,
+ "HazaWasteName": null,
+ "EstimateFloorArea": 0.0,
+ "HazaWasteDeptName": null,
+ "SurplusFloorArea": 260.0,
+ "HazaWasteStorageDays": 0.0,
+ "StorageQty": 0.0,
+ "HazaWasteStorageQty": 0.0,
+ "positionX": 32.22122596740723,
+ "positionY": 118.7843091583252
+ },
+ {
+ "StoragePlaceId": 127.0,
+ "StoragePlaceName": "鐐兼补閮ㄥ簾姘旀帓鏀剧偣",
+ "HazaWasteStorageDate": "0001-01-01T00:00:00",
+ "HazaWasteCatgrName": null,
+ "SurplusQuantityWarning": 0,
+ "LongDayWarning": 0,
+ "DesignFloorArea": 351.0,
+ "HazaWasteName": null,
+ "EstimateFloorArea": 0.0,
+ "HazaWasteDeptName": null,
+ "SurplusFloorArea": 351.0,
+ "HazaWasteStorageDays": 0.0,
+ "StorageQty": 0.0,
+ "HazaWasteStorageQty": 0.0,
+ "positionX": 32.232299575805664,
+ "positionY": 118.78950408935547
+ },
+ {
+ "StoragePlaceId": 126.0,
+ "StoragePlaceName": "鐑儍閮ㄥ簾姘旀帓鏀剧偣",
+ "HazaWasteStorageDate": "0001-01-01T00:00:00",
+ "HazaWasteCatgrName": null,
+ "SurplusQuantityWarning": 0,
+ "LongDayWarning": 1.0,
+ "DesignFloorArea": 54.0,
+ "HazaWasteName": null,
+ "EstimateFloorArea": 0.0,
+ "HazaWasteDeptName": null,
+ "SurplusFloorArea": 54.0,
+ "HazaWasteStorageDays": 0.0,
+ "StorageQty": 1.0,
+ "HazaWasteStorageQty": 0.0,
+ "positionX": 32.24092555999756,
+ "positionY": 118.75035759735107
+ },
+ {
+ "StoragePlaceId": 127.0,
+ "StoragePlaceName": "鐑數绔欏簾姘旀帓鏀剧偣",
+ "HazaWasteStorageDate": "0001-01-01T00:00:00",
+ "HazaWasteCatgrName": null,
+ "SurplusQuantityWarning": 0,
+ "LongDayWarning": 0,
+ "DesignFloorArea": 351.0,
+ "HazaWasteName": null,
+ "EstimateFloorArea": 0.0,
+ "HazaWasteDeptName": null,
+ "SurplusFloorArea": 351.0,
+ "HazaWasteStorageDays": 0.0,
+ "StorageQty": 0.0,
+ "HazaWasteStorageQty": 0.0,
+ "positionX": 32.21459850282962,
+ "positionY": 118.75664928244586
+ },
+ {
+ "StoragePlaceId": 126.0,
+ "StoragePlaceName": "瀹夌幆绔欏簾姘旀帓鏀剧偣",
+ "HazaWasteStorageDate": "0001-01-01T00:00:00",
+ "HazaWasteCatgrName": null,
+ "SurplusQuantityWarning": 0,
+ "LongDayWarning": 1.0,
+ "DesignFloorArea": 54.0,
+ "HazaWasteName": null,
+ "EstimateFloorArea": 0.0,
+ "HazaWasteDeptName": null,
+ "SurplusFloorArea": 54.0,
+ "HazaWasteStorageDays": 0.0,
+ "StorageQty": 1.0,
+ "HazaWasteStorageQty": 0.0,
+ "positionX": 32.22176451502621,
+ "positionY": 118.75520774508638
+ }
+ ]
+ }
+}
diff --git a/src/Sgis.js b/src/Sgis.js
index dcebdb5..6e794e0 100644
--- a/src/Sgis.js
+++ b/src/Sgis.js
@@ -16,7 +16,7 @@
import './components/plugin/Editable' // 鏍囩粯鎿嶄綔
import './components/plugin/MagicMarker' // 鍔ㄧ敾Marker
import './assets/css/map/magic.min.css' // 鍔ㄧ敾Marker css
-// import './assets/css/map/leaflet.magicMarker.css' // 鍔ㄧ敾marker
+import '@/components/plugin/magicMarker.css'
import '@components/plugin/pulse/Pulse' // marker 澶栧湀娉�
import '@components/plugin/pulse/Pulse.css' // marker 澶栧湀娉� css
diff --git a/src/api/request.js b/src/api/request.js
index cb1f881..c3ce5bf 100644
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -1,11 +1,21 @@
import $http from '@utils/axios'
+import Qs from 'qs'
+// import axios from 'axios'
-// // 鍥哄簾鎺ュ彛
-export const requestSolidWaste = (url) => {
- return $http.get('./static/SolidWaste.json')
+export const QueryStoragePlaceListByCompanyAndName = (data = {}) => {
+ return $http.post('/EPInterface/DataService/EPMapService.asmx/QueryStoragePlaceListByCompanyAndName', Qs.stringify(data), {
+ headers: {
+ 'Content-Type': 'application/json'
+ }
+ })
}
-
-// 搴熸按鎺ュ彛
-export const requestWasteWater = (url) => {
- return $http.get('./static/WasteWater.json')
+// export const FlueGas = (url) => {
+// return $http.get('./static/airQuality.json')
+// }
+export function FlueGas (data = {}) {
+ return $http.post('EPInterface/DataService/EPMapService.asmx/ObtainningConInfo', Qs.stringify(data), {
+ headers: {
+ 'Content-Type': 'application/json'
+ }
+ })
}
diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue
new file mode 100644
index 0000000..003f1dc
--- /dev/null
+++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue
@@ -0,0 +1,69 @@
+<template>
+ <div class="public-bounced" v-show="flag">
+ <div class="public-bounced-title">
+ <span>{{ displayContent.Name }}</span>
+ <i class="el-icon-circle-close" @click="closePopup"></i>
+ </div>
+ <div class="public-bounced-content">
+ <span>鍐呭</span>
+ </div>
+ </div>
+</template>
+
+<script>
+
+export default {
+ name: 'PublicBounced',
+ data () {
+ return {
+ displayContent: [],
+ flag: false
+ }
+ },
+ methods: {
+ setData (data) {
+ this.displayContent = data
+ this.flag = true
+ },
+ closePopup () {
+ this.flag = false
+ }
+ }
+}
+</script>
+
+<style lang="less" scoped>
+.public-bounced {
+ width: 80%;
+ height: 450px;
+ z-index: 999;
+ position: absolute;
+ top: 25%;
+ left: 10%;
+ background-color: #002432;
+ margin: 1% auto;
+ border: 1px #a5bfd8 solid;
+
+ .public-bounced-title {
+ width: 100%;
+ border: 1px #a4c0d8 solid;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 5px 0;
+
+ span {
+ color: #f4f7ff;
+ margin: 0 15px;
+ font-size: 14px;
+ }
+
+ i {
+ color: white;
+ margin: 0 15px;
+ font-size: 22px;
+ }
+ }
+
+}
+</style>
diff --git a/src/components/BaseNav/SolidWaste/Popup.vue b/src/components/BaseNav/SolidWaste/Popup.vue
new file mode 100644
index 0000000..79a1a6d
--- /dev/null
+++ b/src/components/BaseNav/SolidWaste/Popup.vue
@@ -0,0 +1,111 @@
+<template>
+ <div class="box" @click.stop="clo_box">
+ <div class="popup_content">
+ <div class="popup_title">{{ this.title }}</div>
+ <div class="popup_center">
+ <div v-if="this.content_text">{{ this.content_text }}</div>
+ <slot></slot>
+ </div>
+ <div class="popup_bottom">
+ <button @click="popup_sub">纭畾{{ displayContent.Name }}</button>
+ <button @click="popup_clo">鍙栨秷</button>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'SolidContent',
+ data () {
+ return {
+ displayContent: []
+ }
+ },
+ props: {
+ title: {
+ type: String,
+ default: '榛樿鏍囬'
+ },
+ content_text: {
+ type: String,
+ default: ''
+ },
+ hidden: {
+ type: Boolean,
+ default: false
+ }
+ },
+ methods: {
+ // 鐐瑰嚮纭畾浜嬩欢
+ popup_sub () {
+ this.$emit('popup_sub')
+ },
+ // 鐐瑰嚮浜嗗彇娑堜簨浠�
+ popup_clo () {
+ this.$emit('popup_clo')
+ },
+ // 鐐瑰嚮浜嗗脊鍑烘浠ュ鍖哄煙
+ clo_box (e) {
+ if (e.target._prevClass === 'box') {
+ this.$emit('clo_box')
+ }
+ }
+ }
+}
+</script>
+
+<style scoped>
+.box {
+ width: 80%;
+ z-index: 999;
+ position: absolute;
+ top: 50%;
+ left: 25%;
+ background-color: rgba(128, 128, 128, 0.507);
+}
+
+.popup_content {
+ background-color: white;
+ padding: 1%;
+ border-radius: 20px;
+ width: 40%;
+ margin: 10% auto;
+}
+
+.popup_title {
+ text-align: center;
+ font-weight: 600;
+ font-size: 30px;
+}
+
+.popup_center {
+ padding: 10%;
+ font-size: 20px;
+}
+
+.popup_bottom {
+ display: flex;
+ justify-content: space-around;
+}
+
+button {
+ width: 25%;
+ height: 20%;
+ padding: 2%;
+ border: 1px solid gray;
+ border-radius: 10px;
+}
+
+button:nth-child(1) {
+ background-color: orangered;
+ color: white;
+ font-size: 20px;
+}
+
+button:nth-child(2) {
+ background-color: gray;
+ color: black;
+ font-size: 20px;
+}
+</style>
diff --git a/src/components/BaseNav/SolidWaste/SolidContent.vue b/src/components/BaseNav/SolidWaste/SolidContent.vue
index 3b6fb0b..9b55840 100644
--- a/src/components/BaseNav/SolidWaste/SolidContent.vue
+++ b/src/components/BaseNav/SolidWaste/SolidContent.vue
@@ -1,53 +1,82 @@
<template>
- <div class="solid-content">
- <div class="content-left">
- <span>{{ displayContent.StoragePlaceName }}</span>
- </div>
- <div class="content-right">
- <SolidWasteTable :displayContent="displayContent"></SolidWasteTable>
+ <div class="public-bounced" v-show="flag">
+ <div class="popup_title">{{ displayContent.Name }}</div>
+ <div class="popup_bottom">
+ <button @click="closePopup">纭畾</button>
+ <button @click="closePopup">鍙栨秷</button>
</div>
</div>
</template>
<script>
-
-import SolidWasteTable from '@components/BaseNav/SolidWaste/SolidWasteTable'
+import '@/components/BaseNav/SolidWaste/directive'
export default {
name: 'SolidContent',
- components: { SolidWasteTable },
data () {
return {
- displayContent: []
+ displayContent: [],
+ flag: false
}
},
methods: {
- setDate (data) {
- // console.log(data)
+ setData (data) {
this.displayContent = data
+ this.flag = true
+ },
+ closePopup () {
+ this.flag = false
}
}
}
</script>
-<style lang="less" scoped>
-span {
- font-size: 22px;
- color: red;
+<style scoped>
+.public-bounced {
+ width: 80%;
+ z-index: 499;
+ position: absolute;
+ top: 15%;
+ left: 10%;
+ background-color: rgba(128, 128, 128, 0.507);
+ padding: 1%;
+ border-radius: 20px;
+ margin: 10% auto;
}
-.solid-content {
- width: 100%;
+.popup_title {
+ text-align: center;
+ font-weight: 600;
+ font-size: 30px;
+}
+
+.popup_center {
+ padding: 10%;
+ font-size: 20px;
+}
+
+.popup_bottom {
display: flex;
- align-items: center;
justify-content: space-around;
+}
- .content-left {
- width: 35%;
- }
+button {
+ width: 25%;
+ height: 20%;
+ padding: 2%;
+ border: 1px solid gray;
+ border-radius: 10px;
+}
- .content-right {
- width: 60%;
- }
+button:nth-child(1) {
+ background-color: orangered;
+ color: white;
+ font-size: 20px;
+}
+
+button:nth-child(2) {
+ background-color: gray;
+ color: black;
+ font-size: 20px;
}
</style>
diff --git a/src/components/BaseNav/SolidWaste/SolidWaste.js b/src/components/BaseNav/SolidWaste/SolidWaste.js
index 616bf11..b9be819 100644
--- a/src/components/BaseNav/SolidWaste/SolidWaste.js
+++ b/src/components/BaseNav/SolidWaste/SolidWaste.js
@@ -1,4 +1,4 @@
-import { requestSolidWaste } from '@/api/request'
+import { QueryStoragePlaceListByCompanyAndName } from '@/api/request'
// 灞曠ず鍥剧墖
import defaultImg from '@assets/images/map-pages/basenav/solidwaste/voc.png'
import Setting from '@assets/images/map-pages/basenav/solidwaste/gf_green.png'
@@ -16,8 +16,8 @@
}
// 璇锋眰鏁版嵁 data 涓哄弬鏁帮紝 璇锋眰鍚庡彴鏁版嵁鏃� 鎼哄甫data鍙傛暟
- requestData () {
- requestSolidWaste().then(res => {
+ requestData (data) {
+ QueryStoragePlaceListByCompanyAndName(data).then(res => {
// console.log(res)
this.DrawTheSolidWasteContent(res.Result.DataInfo)
}).catch(err => {
@@ -28,7 +28,7 @@
// 鏍规嵁鑾峰彇鏁版嵁 鐢诲嚭 鍐呭
DrawTheSolidWasteContent (data) {
// 鍥炬爣鏍峰紡鎵╁睍
- const SolidWasteIcon = this.SolidWasteIcon()
+ var SolidWasteIcon = this.SolidWasteIcon()
// //鍔犺浇鏁版嵁鍓嶅鏋滃瓨鍦ㄥ浘灞傜粍 閭ｄ箞娓呴櫎鎺�
if (this.SolidWasteLayerGroup) {
@@ -36,51 +36,44 @@
}
for (let i = 0; i < data.length; i++) {
// 缁忕含搴� 浣嶇疆
- const positionX = data[i].positionX
- const positionY = data[i].positionY
+ const positionX = data[i].Latitude
+ const positionY = data[i].Longitude
// 鍒ゆ柇 缁忕含搴︿綅缃俊鎭槸鍚﹀瓨鍦�
- // if (positionX != null && positionY != null) {
- // 鐢ㄤ簬 鍒ゆ柇 => 鍒ゆ柇鏄惁灞曠ず鑴夊啿鏁堟灉 => temp(涓存椂)
- const determineValueOne = data[i].LongDayWarning
- const determineValueTwo = data[i].StorageQty
- const positionArea = [positionX, positionY]
+ if (positionX != null && positionY != null) {
+ // 鐢ㄤ簬 鍒ゆ柇 => 鍒ゆ柇鏄惁灞曠ず鑴夊啿鏁堟灉 => temp(涓存椂)
+ const determineValueOne = data[i].LongDayWarning
+ var determineValueTwo = data[i].StorageQty
+ const positionArea = [positionX, positionY]
- // 鍥炬爣灞曠ず
- const iconUrl = this.SolidWasteIconUrl(determineValueOne, determineValueTwo, positionArea)
- const Icon = new SolidWasteIcon({ iconUrl: iconUrl })
- // let url = Icon.options.iconUrl
+ // 鍥炬爣灞曠ず
+ var iconUrl = this.SolidWasteIconUrl(determineValueOne, determineValueTwo, positionArea)
+ var Icon = new SolidWasteIcon({ iconUrl: iconUrl })
+ // var url = Icon.options.iconUrl
- const marker = this.L.marker([positionX, positionY], { icon: Icon })
+ const marker = this.L.marker([positionX, positionY], { icon: Icon })
- marker.bindPopup(() => {
- return this.SolidWastePopup.$el
- }, {
- className: 's-map-popup',
- minWidth: 600,
- closeButton: true,
- autoClose: false
- })
- // 鍒掕繃鍑虹幇 灞曠ず鏁版嵁
- marker.bindTooltip(data[i].StoragePlaceName, {
- permanent: true,
- offset: [0, -16],
- direction: 'top',
- className: ''
- })
- // 鐐瑰嚮 浜嬩欢
- marker.on('click', (e) => {
- try {
- // console.log(e)
- this.EffectOfPulse(e.target.getLatLng())
- this.SolidWastePopup.setDate(data[i])
- } catch (error) {
- console.log(error)
- }
- })
- // 璁剧疆鍐呭娣诲姞鍒板浘灞�
- this.SolidWasteLayerGroup.addLayer(marker)
- // }
+ // 鍒掕繃鍑虹幇 灞曠ず鏁版嵁
+ marker.bindTooltip(data[i].Name, {
+ permanent: true,
+ offset: [0, 16],
+ direction: 'bottom',
+ className: ''
+ })
+ // 鐐瑰嚮 浜嬩欢
+ marker.on('click', (e) => {
+ try {
+ // console.log(e)
+ this.EffectOfPulse(e.target.getLatLng())
+ this.SolidWastePopup.setData(data[i])
+ return this.SolidWastePopup.$el
+ } catch (error) {
+ console.log(error)
+ }
+ })
+ // 璁剧疆鍐呭娣诲姞鍒板浘灞�
+ this.SolidWasteLayerGroup.addLayer(marker)
+ }
}
}
@@ -101,7 +94,7 @@
// 鏍规嵁绫诲瀷杩斿洖鍥剧墖鍔犺浇url
SolidWasteIconUrl (determineValueOne, determineValueTwo, position) {
- let EffectOfChange
+ var EffectOfChange
if (determineValueOne === 1 || determineValueTwo === 1) {
EffectOfChange = defaultImg
this.EffectOfPulse(position, this.solidWasteMarkersLabels, this.SolidWasteLayerGroup)
@@ -114,28 +107,28 @@
// 鑴夊啿鏁堟灉璁剧疆瀹炵幇
EffectOfPulse (position, markers, layerGroup) {
// // 鍖哄垎鐩存帴鎵ц 鍜屽垽鏂墽琛岀殑涓嶅悓鍖哄埆
- let differentColor = ''
+ var differentColor = ''
if (markers) {
differentColor = '#ff0000'
} else {
differentColor = '#98FB98'
}
// 鍧愭爣鏁版嵁锛氭姤璀︿紶杩涙潵鐨勬槸鏁扮粍 / 鐐瑰嚮浼犺繘鏉ョ殑鏄痮bject
- const FinalPosition = position instanceof Array ? {
+ var FinalPosition = position instanceof Array ? {
lat: position[0],
lng: position[1]
} : position
// 鎻掍欢 鏁堟灉瀹炵幇
- const pulsingIcon = this.L.icon.pulse({
+ var pulsingIcon = this.L.icon.pulse({
iconSize: [20, 20],
color: differentColor,
fillColor: ''
})
if (markers) {
- markers.push(this.L.marker(FinalPosition, { icon: pulsingIcon }))
- this.L.layerGroup(markers).addLayer(layerGroup)
+ // markers.push(this.L.marker(FinalPosition, { icon: pulsingIcon }))
+ // this.L.layerGroup(markers).addLayer(layerGroup)
} else {
- const picGroupMarker = new this.L.FeatureGroup()
+ var picGroupMarker = new this.L.FeatureGroup()
this.L.marker(FinalPosition, { icon: pulsingIcon }).addTo(picGroupMarker)
this.pulseHeighLightMarker = picGroupMarker.addTo(this.SolidWasteLayerGroup)
this.PulseCountSetting()
@@ -144,9 +137,10 @@
// 瀵瑰浘鏍囪剦鍐� 杩涜set璁剧疆 // 楂樹寒鍥惧眰
PulseCountSetting () {
- const HeightLightTime = 5
- let PulseNumber = 5
- const pulseinterver = setInterval(() => {
+ var HeightLightTime = 5
+ var PulseNumber = 5
+ const pulseinterver = setInterval((e) => {
+ console.log(e)
if (PulseNumber > 0) {
PulseNumber--
} else {
diff --git a/src/components/BaseNav/WireSurface/index.js b/src/components/BaseNav/WireSurface/index.js
new file mode 100644
index 0000000..3021c37
--- /dev/null
+++ b/src/components/BaseNav/WireSurface/index.js
@@ -0,0 +1,22 @@
+// // 寮曞叆鐢ㄤ簬澶勭悊鎺ュ彛鏁版嵁鑾峰彇鐨勬柟娉�
+// import {} from '@src/api/request'
+//
+// class initWireSurface {
+// constructor (options) {
+// this.map = options.map
+// this.L = window.L
+// this.initWireSurfaceMap = new Map()
+// this.initWireSurfacePopup = this.L.layerGroup().addTo(this.map)
+// }
+//
+// // 鑾峰彇椤甸潰绾�/闈㈡暟鎹�
+// getDataInitWireSurface () {
+// ().then(res => {
+// console.log(res)
+// }).catch(error => {
+// console.log(error)
+// })
+// }
+// }
+//
+// export default initWireSurface
diff --git a/src/components/flueGas/GasComponents/GasECharts.vue b/src/components/flueGas/GasComponents/GasECharts.vue
new file mode 100644
index 0000000..d6e3909
--- /dev/null
+++ b/src/components/flueGas/GasComponents/GasECharts.vue
@@ -0,0 +1,107 @@
+<template>
+ <div id="echarts" style="width:300px;height:222px" ref="main"></div>
+</template>
+
+<script>
+export default {
+ name: 'GasECharts',
+ methods: {
+ drawChart: function () {
+ const myChart = this.$echarts.init(this.$refs.main)
+ const option = {
+ title: {
+ text: '鎶樼嚎鍥惧爢鍙�'
+ },
+ // color: '#fff',
+ tooltip: {
+ trigger: 'axis'
+ },
+ legend: {
+ data: ['閭欢钀ラ攢', '鑱旂洘骞垮憡', '瑙嗛骞垮憡', '鐩存帴璁块棶', '鎼滅储寮曟搸']
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ toolbox: {
+ feature: {
+ saveAsImage: {}
+ }
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄦ棩'],
+ axisLabel: {
+ textStyle: {
+ color: '#7edae8' // 鍧愭爣鐨勫瓧浣撻鑹�
+ }
+ },
+ axisLine: {
+ show: false, // 闅愯棌鍧愭爣杞�
+ lineStyle: {
+ color: '#00eeff' // 鍧愭爣杞寸殑棰滆壊
+ }
+ }
+ },
+ yAxis: [{
+ type: 'value',
+ axisLabel: {
+ textStyle: {
+ color: '#7edae8' // 鍧愭爣鐨勫瓧浣撻鑹�
+ }
+ },
+ axisLine: {
+ show: false, // 闅愯棌鍧愭爣杞�
+ lineStyle: {
+ color: '#00eeff' // 鍧愭爣杞寸殑棰滆壊
+ }
+ }
+ }],
+ series: [
+ {
+ name: '閭欢钀ラ攢',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [120, 132, 101, 134, 90, 230, 210]
+ },
+ {
+ name: '鑱旂洘骞垮憡',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [220, 182, 191, 234, 290, 330, 310]
+ },
+ {
+ name: '瑙嗛骞垮憡',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [150, 232, 201, 154, 190, 330, 410]
+ },
+ {
+ name: '鐩存帴璁块棶',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [320, 332, 301, 334, 390, 330, 320]
+ },
+ {
+ name: '鎼滅储寮曟搸',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [820, 932, 901, 934, 1290, 1330, 1320]
+ }
+ ]
+ }
+ myChart.setOption(option)
+ }
+ },
+ mounted () {
+ this.drawChart()
+ }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>
diff --git a/src/components/flueGas/GasComponents/GasTable.vue b/src/components/flueGas/GasComponents/GasTable.vue
new file mode 100644
index 0000000..d4f11da
--- /dev/null
+++ b/src/components/flueGas/GasComponents/GasTable.vue
@@ -0,0 +1,46 @@
+<template>
+ <el-row>
+ <el-row>
+ <el-col :span="8">鐩戞祴鐐瑰悕绉�:{{name}}</el-col>
+ <el-col :span="8">鐢熶骇鍗曚綅:{{ DeptSname }}</el-col>
+ <el-col :span="8">鎺掓斁绫诲瀷鍔犺浇:{{EmissTypeName}}</el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="8">鎺掓斁鍘诲悜:{{EmissTypeDirectName}}</el-col>
+ <el-col :span="8">鎺у埗绾у埆鍚嶇О:{{ContrLevelShowName}}</el-col>
+ <el-col :span="8">鍐�/澶栨帓鍙�:{{OrOutPortName}}</el-col>
+ </el-row>
+ </el-row>
+</template>
+
+<script>
+export default {
+ name: 'GasTable',
+ props: ['displayContent'],
+ data () {
+ return {
+ name: '鑱氶叝鐑獟鐐�03鐑熸皵鎺掓斁鍙�',
+ DeptSname: '澶ц姵鐑冭缃�',
+ EmissTypeName: '搴熸皵',
+ EmissTypeDirectName: '澶ф皵',
+ ContrLevelShowName: '甯傛帶',
+ OrOutPortName: '澶栨帓'
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+.el-row {
+ color: #00d0f9;
+ .el-col{
+ width: 240px;
+ height: 28px;
+ background-color: #243a55;
+ border-radius: 0.05rem;
+ margin: 5px;
+ text-align: center;
+ line-height: 28px;
+ }
+}
+</style>
diff --git a/src/components/flueGas/GasComponents/GasVideo.vue b/src/components/flueGas/GasComponents/GasVideo.vue
new file mode 100644
index 0000000..b317b1c
--- /dev/null
+++ b/src/components/flueGas/GasComponents/GasVideo.vue
@@ -0,0 +1,24 @@
+<template>
+<div>
+<!-- <video>-->
+ <video width="100%" height="100%" controls>
+ <source src="movie.mp4" type="video/mp4">
+ <source src="movie.ogg" type="video/ogg">
+<!-- 鎮ㄧ殑娴忚鍣ㄤ笉鏀寔 HTML5 video 鏍囩銆�-->
+ </video>
+<!-- <span class="ico ico-sound" :class="{ active: isMute }" v-on:click="closeSoundClick()"></span>-->
+<!-- <span class="ico ico-skip"></span>-->
+<!-- <span class="ico ico-video" :class="{ hide: isPlay }" v-on:click="playClick()"></span>-->
+<!-- </video>-->
+</div>
+</template>
+
+<script>
+export default {
+ name: 'GasVideo'
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/components/flueGas/flueGas.js b/src/components/flueGas/flueGas.js
new file mode 100644
index 0000000..62f103f
--- /dev/null
+++ b/src/components/flueGas/flueGas.js
@@ -0,0 +1,176 @@
+import { FlueGas } from '@/api/request'
+import defaultImg from '@components/flueGas/green_airquality_2.png'
+import Setting from '@components/flueGas/green_airquality_3.png'
+// 鍥剧墖
+
+class AddGasHelper {
+ constructor (options) {
+ this.map = options.map
+ this.L = window.L
+ this.FlueGasLayerGroup = this.L.layerGroup().addTo(this.map)
+ this.FlueGasPopup = null
+ this.L.sgis = this.L.sgis || this.L
+ this.FlueGasMarkersLabels = []
+ this.pulseHeighLightMarker = null
+ }
+
+ // 鑾峰彇鏁版嵁
+ requestData (data) {
+ FlueGas(data).then(res => {
+ console.log(res)
+ this.DrawFlueGasContent(res.Result.DataInfo)
+ }).catch(err => {
+ console.log(err)
+ })
+ }
+
+ // 鏍规嵁鑾峰彇鏁版嵁 鐢诲嚭 鍐呭
+ DrawFlueGasContent (data) {
+ // 鍥炬爣鏍峰紡鎵╁睍
+ var FlueGasIcon = this.PlueGasIcon()
+
+ // //鍔犺浇鏁版嵁鍓嶅鏋滃瓨鍦ㄥ浘灞傜粍 閭ｄ箞娓呴櫎鎺�
+ if (this.FlueGasLayerGroup) {
+ this.FlueGasLayerGroup.clearLayers()
+ }
+ for (let i = 0; i < data.length; i++) {
+ // 缁忕含搴� 浣嶇疆
+ const positionX = data[i].Latitude
+ const positionY = data[i].Longitude
+
+ // 鍒ゆ柇 缁忕含搴︿綅缃俊鎭槸鍚﹀瓨鍦�
+ // if (positionX != null && positionY != null) {
+ // 鐢ㄤ簬 鍒ゆ柇 => 鍒ゆ柇鏄惁灞曠ず鑴夊啿鏁堟灉 => temp(涓存椂)
+ const determineValueOne = data[i].LongDayWarning
+ var determineValueTwo = data[i].StorageQty
+ const positionArea = [positionX, positionY]
+
+ // 鍥炬爣灞曠ず
+ var iconUrl = this.PlueGasIconUrl(determineValueOne, determineValueTwo, positionArea)
+ var Icon = new FlueGasIcon({ iconUrl: iconUrl })
+ // var url = Icon.options.iconUrl
+
+ const marker = this.L.marker([positionX, positionY], { icon: Icon })
+ // const latlngs = positionArea[2]
+ // // 绾�
+ // var polyline = this.L.polyline(latlngs, { color: 'red' }).addTo(this.map)
+ // console.log(polyline)
+ marker.bindPopup(() => {
+ return this.FlueGasPopup.$el
+ }, {
+ className: 's-map-popup',
+ minWidth: 1548,
+ closeButton: true,
+ autoClose: false
+ })
+ // 鍒掕繃鍑虹幇 灞曠ず鏁版嵁
+ marker.bindTooltip(data[i].porltName, {
+ permanent: true,
+ offset: [0, -16],
+ direction: 'top',
+ className: ''
+ })
+ // 鐐瑰嚮 浜嬩欢
+ marker.on('click', (e) => {
+ try {
+ // console.log(e)
+ this.EffectOfPulse(e.target.getLatLng())
+ this.FlueGasPopup.setDate(data[i])
+ } catch (error) {
+ console.log(error)
+ }
+ })
+ // 璁剧疆鍐呭娣诲姞鍒板浘灞�
+ this.FlueGasLayerGroup.addLayer(marker)
+ // }
+ }
+ }
+
+ // 鐐瑰嚮杩涜鐨� 鍐呭鐨勮缃�
+ SetPlueGasContent (config, containerPopup) {
+ this.FlueGasPopup = containerPopup
+ }
+
+ // 鍥炬爣鏍峰紡鎵╁睍 => 鍏夊湀 鍥炬爣鑴夊啿
+ PlueGasIcon () {
+ return this.L.Icon.extend({
+ options: {
+ iconSize: [50, 50],
+ iconAnchor: [25, 25]
+ }
+ })
+ }
+
+ // 鏍规嵁绫诲瀷杩斿洖鍥剧墖鍔犺浇url
+ PlueGasIconUrl (determineValueOne, determineValueTwo, position) {
+ var EffectOfChange
+ if (determineValueOne === 1 || determineValueTwo === 1) {
+ EffectOfChange = defaultImg
+ this.EffectOfPulse(position, this.FlueGasMarkersLabels, this.pulseHeighLightMarker)
+ } else {
+ EffectOfChange = Setting
+ }
+ return EffectOfChange
+ }
+
+ // 鑴夊啿鏁堟灉璁剧疆瀹炵幇
+ EffectOfPulse (position, markers, layerGroup) {
+ // // 鍖哄垎鐩存帴鎵ц 鍜屽垽鏂墽琛岀殑涓嶅悓鍖哄埆
+ let differentColor = ''
+ if (markers) {
+ differentColor = '#ff0000'
+ } else {
+ differentColor = '#98FB98'
+ }
+ // 鍧愭爣鏁版嵁锛氭姤璀︿紶杩涙潵鐨勬槸鏁扮粍 / 鐐瑰嚮浼犺繘鏉ョ殑鏄痮bject
+ var FinalPosition = position instanceof Array ? {
+ lat: position[0],
+ lng: position[1]
+ } : position
+ // 鎻掍欢 鏁堟灉瀹炵幇
+ var pulsingIcon = this.L.icon.pulse({
+ iconSize: [20, 20],
+ color: differentColor,
+ fillColor: ''
+ })
+ if (markers) {
+ // markers.push(this.L.marker(FinalPosition, { icon: pulsingIcon }))
+ // this.L.layerGroup(markers).addLayer(layerGroup)
+ } else {
+ var picGroupMarker = new this.L.FeatureGroup()
+ this.L.marker(FinalPosition, { icon: pulsingIcon }).addTo(picGroupMarker)
+ this.pulseHeighLightMarker = picGroupMarker.addTo(this.FlueGasLayerGroup)
+ this.PulseCountSetting()
+ }
+ }
+
+ PulseCountSetting () {
+ var HeightLightTime = 5
+ var PulseNumber = 5
+ const pulseinterver = setInterval(() => {
+ if (PulseNumber > 0) {
+ PulseNumber--
+ } else {
+ this.pulseClear(pulseinterver)
+ PulseNumber = HeightLightTime
+ }
+ }, 1000)
+ }
+
+ // 娓呴櫎 鍥惧眰
+ pulseClear (pulseinterver) {
+ clearInterval(pulseinterver)
+ pulseinterver = null
+
+ if (this.PlueGasLayerGroup) {
+ // this.PlueGasLayerGroup.clearLayers()
+ } else {
+ this.PlueGasLayerGroup = this.L.layerGroup().addTo(this.map)
+ }
+ if ((this.pulseHeighLightMarker)) {
+ this.pulseHeighLightMarker.remove()
+ }
+ }
+}
+
+export default AddGasHelper
diff --git a/src/components/flueGas/green_airquality_2.png b/src/components/flueGas/green_airquality_2.png
new file mode 100644
index 0000000..ca7b11b
--- /dev/null
+++ b/src/components/flueGas/green_airquality_2.png
Binary files differ
diff --git a/src/components/flueGas/green_airquality_3.png b/src/components/flueGas/green_airquality_3.png
new file mode 100644
index 0000000..d5f6a73
--- /dev/null
+++ b/src/components/flueGas/green_airquality_3.png
Binary files differ
diff --git a/src/components/flueGas/popup-gas.vue b/src/components/flueGas/popup-gas.vue
new file mode 100644
index 0000000..a883d48
--- /dev/null
+++ b/src/components/flueGas/popup-gas.vue
@@ -0,0 +1,54 @@
+<template>
+ <div v-if="!isShow" class="popupGas">
+ <el-row>
+ <el-col :span="12">
+ <el-row>
+ <gas-table :displayContent="displayContent"></gas-table>
+ </el-row>
+ <el-row>
+ <gas-e-charts></gas-e-charts>
+ </el-row>
+ </el-col>
+ <el-col :span="12">
+ <gas-video></gas-video>
+ </el-col>
+ </el-row>
+ </div>
+</template>
+
+<script>
+import GasTable from '@components/flueGas/GasComponents/GasTable'
+import GasECharts from '@components/flueGas/GasComponents/GasECharts'
+import GasVideo from '@components/flueGas/GasComponents/GasVideo'
+
+export default {
+ name: 'popup-gas',
+ components: {
+ GasTable,
+ GasECharts,
+ GasVideo
+ },
+ data: function () {
+ return {
+ isShow: false,
+ displayContent: []
+ }
+ },
+ methods: {
+ setDate (data) {
+ console.log(data)
+ this.displayContent = data
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+/deep/ .popupGas {
+ color: #fff;
+
+ .leaflet-popup-content-wrapper {
+ width: 100% !important;
+ }
+}
+</style>
diff --git a/src/conf/MapConfig.js b/src/conf/MapConfig.js
index 0b6c329..a039e8f 100644
--- a/src/conf/MapConfig.js
+++ b/src/conf/MapConfig.js
@@ -2,6 +2,7 @@
import TDT from './TDT'
import { LayerSewersLine, LayerSewersPoint } from './LayerSewers'
import { LayerWasteWater } from './LayerWasteWater'
+
const curWwwPath = window.document.location.href
const pathname = window.document.location.pathname
const pos = curWwwPath.indexOf(pathname)
@@ -22,7 +23,7 @@
minZoom: 3,
maxZoom: 18,
// center: [26, 104],
- center: [32.224016189575195, 118.77070426940918],
+ center: [38.828558921813965, 117.41676807403564],
zoom: 14,
worldCopyJump: true,
inertia: true,
@@ -38,7 +39,10 @@
// defaultBasemapCode: 'tianditu_img', // 榛樿鏄剧ず 鍦板浘绫诲瀷
IntranetBaseMaps: TDT.intranet,
InternetBaseMaps: TDT.internet,
- Layers: { LayerSewersLine: [LayerSewersLine, LayerWasteWater], layerSewersPoint: LayerSewersPoint } // 姹￠洦姘村浘灞傞厤缃�
+ Layers: {
+ LayerSewersLine: [LayerSewersLine, LayerWasteWater],
+ layerSewersPoint: LayerSewersPoint
+ } // 姹￠洦姘村浘灞傞厤缃�
}
/**
diff --git a/src/main.js b/src/main.js
index 0ce6953..e4615a1 100644
--- a/src/main.js
+++ b/src/main.js
@@ -21,7 +21,8 @@
Vue.use(ElementUI)
Vue.prototype.$cancels = []
Vue.prototype.L = L
-// 娉ㄥ唽鎸囦护
+Vue.prototype.$echarts = echarts // 鎸傝浇echarts
+// 娉ㄥ唽鎸囦护7
// registerDirectives(Vue)
// 娉ㄥ唽echarts鐨偆
diff --git a/src/utils/axios.js b/src/utils/axios.js
index 20047e2..7f944e8 100644
--- a/src/utils/axios.js
+++ b/src/utils/axios.js
@@ -83,7 +83,8 @@
// 鍒涘缓axios瀹炰緥
const Service = axios.create({
- timeout: 1000
+ timeout: 5000,
+ baseURL: 'http://10.246.162.140:8080/'
})
const CancelToken = axios.CancelToken
diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue
index be50061..540e1b9 100644
--- a/src/views/MapTemplate.vue
+++ b/src/views/MapTemplate.vue
@@ -20,6 +20,10 @@
<SolidContent ref="SolidWastePopup"></SolidContent>
<el-button type="primary" @click="ChangeWaterState" class="Waste-water">搴熸按</el-button>
<WasteWaterContent ref="WasteWaterPopup"></WasteWaterContent>
+<!-- <SolidContent ref="SolidWastePopup"></SolidContent>-->
+ <el-button type="primary" @click="AddGasHelper" class="flue-gas">搴熸皵</el-button>
+ <popup-gas ref="FlueGas"></popup-gas>
+ <PublicBounced ref="PublicBounced"></PublicBounced>
</div>
</template>
@@ -44,6 +48,12 @@
import AddSolidWasteHelper from '@components/BaseNav/SolidWaste/SolidWaste'
import AddWasteWaterHelper from '@components/BaseNav/WasteWater/WasteWater'
+// import SolidContent from '@components/SolidWaste/SolidContent'
+// 搴熸皵
+import AddGasHelper from '@components/flueGas/flueGas'
+import PopupGas from '@/components/flueGas/popup-gas'
+// // 鍏叡灞曠ず鏁版嵁
+import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'
export default {
name: 'MapTemplate',
components: {
@@ -60,10 +70,14 @@
summarySheets,
SolidContent,
WasteWaterContent
+ // SolidContent,
+ PopupGas,
+ PublicBounced
},
data () {
return {
show: true,
+ // isShowBtn: false,
map: null,
lcServiceLayerVisible: false,
basemapHelper: {},
@@ -82,7 +96,33 @@
})
},
methods: {
+ AddGasHelper () {
+ const data = {
+ companyId: 3900100145,
+ id: '',
+ monType: 2,
+ userCode: 'wenchun.deng',
+ monDuration: '',
+ epName: '',
+ secdDeptId: '',
+ contrLevel: '',
+ dataStatus: '',
+ dataFlag: '',
+ runStatus: '',
+ emissTypeId: ''
+ }
+ const AddGas = new AddGasHelper({ map: this.map })
+ AddGas.requestData(data)
+ AddGas.SetPlueGasContent(this.config, this.$refs.PublicBounced)
+ },
ChangeState () {
+ const data = {
+ companyId: 3900100145,
+ userCode: 'wenchun.deng',
+ name: '',
+ marginWarr: '',
+ longDayWarr: ''
+ }
const AddSolidWaste = new AddSolidWasteHelper({ map: this.map })
AddSolidWaste.requestData()
AddSolidWaste.SetSolidWasteContent(this.config, this.$refs.SolidWastePopup)
@@ -93,6 +133,8 @@
AddWasteWater.requestData()
AddWasteWater.SetWasteWaterContent(this.config, this.$refs.WasteWaterPopup)
}
+ AddSolidWaste.requestData(data)
+ AddSolidWaste.SetSolidWasteContent(this.config, this.$refs.PublicBounced)
},
// isShowHidden () {
// this.isShowBtn = !this.isShowBtn
@@ -121,6 +163,8 @@
this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵�
this.vectorLayerHelper.initVectorLayers(this.config)
+ // this.ChangeState()
+ // this.AddGasHelper()
// this.ChangeState()
// this.ChangeWaterState()
@@ -171,7 +215,12 @@
</script>
<style lang="less">
-
+.flue-gas {
+ position:fixed;
+ top: 88px;
+ left: 180px;
+ z-index: 500;
+}
.solid-waste {
position: absolute;
top: 88px;
@@ -182,7 +231,7 @@
.Waste-water {
position: absolute;
top: 88px;
- left: 180px;
+ left: 380px;
z-index: 999;
}
diff --git a/vue.config.js b/vue.config.js
index 07df932..64bf2b6 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -27,7 +27,7 @@
devServer: {
// host: 'localhost',
// open: true,
- port: 8888,
+ port: 8080,
// overlay: false,
overlay: {
warnings: true,
--
Gitblit v1.8.0