From 07a0b054953d628a1e4b34c88b974166927ea62d Mon Sep 17 00:00:00 2001
From: chenzeping <ChenZeping02609@163.com>
Date: 星期二, 30 三月 2021 11:37:46 +0800
Subject: [PATCH] 弹框修改
---
src/components/BaseNav/SolidWaste/SolidWaste.js | 103 +++++++++++++++++++++++++++------------------------
1 files changed, 55 insertions(+), 48 deletions(-)
diff --git a/src/components/BaseNav/SolidWaste/SolidWaste.js b/src/components/BaseNav/SolidWaste/SolidWaste.js
index 3346804..6df5e3e 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 => {
@@ -36,52 +36,59 @@
}
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
- var 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]
- // 鍥炬爣灞曠ず
- var iconUrl = this.SolidWasteIconUrl(determineValueOne, determineValueTwo, positionArea)
- var Icon = new SolidWasteIcon({ iconUrl: iconUrl })
- // var 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 })
-
- 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)
- // }
+ const marker = this.L.marker([positionX, positionY], { icon: Icon })
+ // 鍒掕繃鍑虹幇 灞曠ず鏁版嵁
+ marker.bindTooltip(data[i].Name, {
+ permanent: true,
+ offset: [0, -16],
+ direction: 'top',
+ className: ''
+ })
+ // 鐐瑰嚮 浜嬩欢
+ marker.on('click', (e) => {
+ try {
+ // console.log(e)
+ // console.log(this.map.getCenter())
+ // console.log(this.map.setCenter([e.target.getLatLng().lat, e.target.getLatLng().lng]))
+ // this.map.flyTo([e.target.getLatLng().lat, e.target.getLatLng().lng])
+ // this.map.panTo([e.target.getLatLng().lat, e.target.getLatLng().lng], 100)
+ this.setPanTo(e.target.getLatLng(), 30)
+ this.EffectOfPulse(e.target.getLatLng())
+ this.SolidWastePopup.setData(data[i], 'gufei')
+ return this.SolidWastePopup.$el
+ } catch (error) {
+ console.log(error)
+ }
+ })
+ // 璁剧疆鍐呭娣诲姞鍒板浘灞�
+ this.SolidWasteLayerGroup.addLayer(marker)
+ }
}
+ }
+
+ // panTo
+ setPanTo (pos, value) {
+ var position = pos
+ position = this.map.latLngToLayerPoint(position)
+ position.y += value
+ position = this.map.layerPointToLatLng(position)
+ this.map.setView(position)
+ // this.map.flyTo(position)
}
// 鍥哄簾鐐瑰嚮杩涜鐨� 鍐呭鐨勮缃�
@@ -113,7 +120,7 @@
// 鑴夊啿鏁堟灉璁剧疆瀹炵幇
EffectOfPulse (position, markers, layerGroup) {
- // // 鍖哄垎鐩存帴鎵ц 鍜屽垽鏂墽琛岀殑涓嶅悓鍖哄埆
+ // 鍖哄垎鐩存帴鎵ц 鍜屽垽鏂墽琛岀殑涓嶅悓鍖哄埆
var differentColor = ''
if (markers) {
differentColor = '#ff0000'
@@ -132,8 +139,8 @@
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 {
var picGroupMarker = new this.L.FeatureGroup()
this.L.marker(FinalPosition, { icon: pulsingIcon }).addTo(picGroupMarker)
@@ -146,7 +153,7 @@
PulseCountSetting () {
var HeightLightTime = 5
var PulseNumber = 5
- const pulseinterver = setInterval(() => {
+ const pulseinterver = setInterval((e) => {
if (PulseNumber > 0) {
PulseNumber--
} else {
--
Gitblit v1.8.0