164个文件已删除
12个文件已添加
1个文件已修改
| New file |
| | |
|---|
| | | { |
|---|
| | | "Result": { |
|---|
| | | "IsSuccess": 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.22118377685547, |
|---|
| | | "positionY": 118.78057479858398 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "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.23122596740723, |
|---|
| | | "positionY": 118.7743091583252 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "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.222299575805664, |
|---|
| | | "positionY": 118.74950408935547 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "StoragePlaceId": 126.0, |
|---|
| | | "StoragePlaceName": "ç¯çé¨å±é©åºç©æåç¹", |
|---|
| | | "HazaWasteStorageDate": "0001-01-01T00:00:00", |
|---|
| | | "HazaWasteCatgrName": null, |
|---|
| | | "SurplusQuantityWarning": 0, |
|---|
| | | "LongDayWarning": 1, |
|---|
| | | "DesignFloorArea": 54.0, |
|---|
| | | "HazaWasteName": null, |
|---|
| | | "EstimateFloorArea": 0.0, |
|---|
| | | "HazaWasteDeptName": null, |
|---|
| | | "SurplusFloorArea": 54.0, |
|---|
| | | "HazaWasteStorageDays": 0.0, |
|---|
| | | "StorageQty": 1, |
|---|
| | | "HazaWasteStorageQty": 0.0, |
|---|
| | | "positionX": 32.23092555999756, |
|---|
| | | "positionY": 118.75735759735107 |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | } |
|---|
| New file |
| | |
|---|
| | | import $http from '@utils/axios' |
|---|
| | | |
|---|
| | | // // åºåºæ¥å£ |
|---|
| | | // export const requestSolidWaste = (url, data = {}) => { |
|---|
| | | // return $http.post('./static/SolidWaste.json', data) |
|---|
| | | // } |
|---|
| | | export const requestSolidWaste = (url) => { |
|---|
| | | return $http.get('./static/SolidWaste.json') |
|---|
| | | } |
|---|
| New file |
| | |
|---|
| | | .leaflet-pulsing-icon { |
|---|
| | | border-radius: 100%; |
|---|
| | | box-shadow: 1px 1px 8px 0 rgba(0,0,0,0.75); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .leaflet-pulsing-icon:after { |
|---|
| | | content: ""; |
|---|
| | | border-radius: 100%; |
|---|
| | | height: 300%; |
|---|
| | | width: 300%; |
|---|
| | | position: absolute; |
|---|
| | | margin: -100% 0 0 -100%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | @keyframes pulsate { |
|---|
| | | 0% { |
|---|
| | | transform: scale(0.1, 0.1); |
|---|
| | | opacity: 0; |
|---|
| | | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
|---|
| | | filter: alpha(opacity=0); |
|---|
| | | } |
|---|
| | | 50% { |
|---|
| | | opacity: 1; |
|---|
| | | -ms-filter: none; |
|---|
| | | filter: none; |
|---|
| | | } |
|---|
| | | 100% { |
|---|
| | | transform: scale(1.2, 1.2); |
|---|
| | | opacity: 0; |
|---|
| | | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; |
|---|
| | | filter: alpha(opacity=0); |
|---|
| | | } |
|---|
| | | } |
|---|
| New file |
| | |
|---|
| | | /* eslint-disable */ |
|---|
| | | (function (window) { |
|---|
| | | |
|---|
| | | L.Icon.Pulse = L.DivIcon.extend({ |
|---|
| | | |
|---|
| | | options: { |
|---|
| | | className: '', |
|---|
| | | iconSize: [12, 12], |
|---|
| | | fillColor: 'red', |
|---|
| | | color: 'red', |
|---|
| | | animate: true, |
|---|
| | | heartbeat: 1, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | initialize: function (options) { |
|---|
| | | L.setOptions(this, options) |
|---|
| | | |
|---|
| | | // css |
|---|
| | | |
|---|
| | | var uniqueClassName = 'lpi-' + new Date().getTime() + '-' + Math.round(Math.random() * 100000) |
|---|
| | | |
|---|
| | | var before = ['background-color: ' + this.options.fillColor] |
|---|
| | | var after = [ |
|---|
| | | |
|---|
| | | 'box-shadow: 0 0 6px 2px ' + this.options.color, |
|---|
| | | |
|---|
| | | 'animation: pulsate ' + this.options.heartbeat + 's ease-out', |
|---|
| | | 'animation-iteration-count: infinite', |
|---|
| | | 'animation-delay: ' + (this.options.heartbeat + .1) + 's', |
|---|
| | | ] |
|---|
| | | |
|---|
| | | if (!this.options.animate) { |
|---|
| | | after.push('animation: none') |
|---|
| | | after.push('box-shadow:none') |
|---|
| | | } |
|---|
| | | |
|---|
| | | var css = [ |
|---|
| | | '.' + uniqueClassName + '{' + before.join(';') + ';}', |
|---|
| | | '.' + uniqueClassName + ':after{' + after.join(';') + ';}', |
|---|
| | | ].join('') |
|---|
| | | |
|---|
| | | var el = document.createElement('style') |
|---|
| | | if (el.styleSheet) { |
|---|
| | | el.styleSheet.cssText = css |
|---|
| | | } else { |
|---|
| | | el.appendChild(document.createTextNode(css)) |
|---|
| | | } |
|---|
| | | |
|---|
| | | document.getElementsByTagName('head')[0].appendChild(el) |
|---|
| | | |
|---|
| | | // apply css class |
|---|
| | | |
|---|
| | | this.options.className = this.options.className + ' leaflet-pulsing-icon ' + uniqueClassName |
|---|
| | | |
|---|
| | | // initialize icon |
|---|
| | | |
|---|
| | | L.DivIcon.prototype.initialize.call(this, options) |
|---|
| | | |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | L.icon.pulse = function (options) { |
|---|
| | | return new L.Icon.Pulse(options) |
|---|
| | | } |
|---|
| | | |
|---|
| | | L.Marker.Pulse = L.Marker.extend({ |
|---|
| | | initialize: function (latlng, options) { |
|---|
| | | options.icon = L.icon.pulse(options) |
|---|
| | | L.Marker.prototype.initialize.call(this, latlng, options) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | L.marker.pulse = function (latlng, options) { |
|---|
| | | return new L.Marker.Pulse(latlng, options) |
|---|
| | | } |
|---|
| | | |
|---|
| | | })(window) |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div class="solid-content"> |
|---|
| | | <div class="content-left"> |
|---|
| | | <span>{{ displayContent.StoragePlaceName }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="content-right"> |
|---|
| | | <SolidWasteTable :displayContent="displayContent"></SolidWasteTable> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | |
|---|
| | | import SolidWasteTable from '@components/BaseNav/SolidWasteTable' |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: 'SolidContent', |
|---|
| | | components: { SolidWasteTable }, |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | displayContent: [] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | setDate (data) { |
|---|
| | | // console.log(data) |
|---|
| | | this.displayContent = data |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | span { |
|---|
| | | font-size: 22px; |
|---|
| | | color: red; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .solid-content { |
|---|
| | | width: 100%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-around; |
|---|
| | | |
|---|
| | | .content-left { |
|---|
| | | width: 35%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .content-right { |
|---|
| | | width: 60%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import { requestSolidWaste } from '@/api/request' |
|---|
| | | // å±ç¤ºå¾ç |
|---|
| | | import defaultImg from '@components/BaseNav/magicMarker.png' |
|---|
| | | import Setting from '@components/BaseNav/voc.png' |
|---|
| | | |
|---|
| | | // åºå¾ä¸å¡å±ç¤ºç¹ |
|---|
| | | class AddSolidWasteHelper { |
|---|
| | | constructor (options) { |
|---|
| | | this.map = options.map |
|---|
| | | this.L = window.L |
|---|
| | | this.SolidWasteLayerGroup = this.L.layerGroup().addTo(this.map) |
|---|
| | | this.SolidWastePopup = null |
|---|
| | | this.L.sgis = this.L.sgis || this.L |
|---|
| | | this.solidWasteMarkersLabels = [] |
|---|
| | | this.pulseHeighLightMarker = null |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 请æ±æ°æ® data 为åæ°ï¼ 请æ±åå°æ°æ®æ¶ æºå¸¦dataåæ° |
|---|
| | | requestData () { |
|---|
| | | requestSolidWaste().then(res => { |
|---|
| | | // console.log(res) |
|---|
| | | this.DrawTheSolidWasteContent(res.Result.DataInfo) |
|---|
| | | }).catch(err => { |
|---|
| | | console.log(err) |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // æ ¹æ®è·åæ°æ® ç»åº å
容 |
|---|
| | | DrawTheSolidWasteContent (data) { |
|---|
| | | // å¾æ æ ·å¼æ©å± |
|---|
| | | var SolidWasteIcon = this.SolidWasteIcon() |
|---|
| | | |
|---|
| | | // //å è½½æ°æ®åå¦æåå¨å¾å±ç» é£ä¹æ¸
é¤æ |
|---|
| | | if (this.SolidWasteLayerGroup) { |
|---|
| | | this.SolidWasteLayerGroup.clearLayers() |
|---|
| | | } |
|---|
| | | for (let i = 0; i < data.length; i++) { |
|---|
| | | // ç»çº¬åº¦ ä½ç½® |
|---|
| | | const positionX = data[i].positionX |
|---|
| | | const positionY = data[i].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 |
|---|
| | | |
|---|
| | | 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) |
|---|
| | | // } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // åºåºç¹å»è¿è¡ç å
容ç设置 |
|---|
| | | SetSolidWasteContent (config, containerPopup) { |
|---|
| | | this.SolidWastePopup = containerPopup |
|---|
| | | } |
|---|
| | | |
|---|
| | | // å¾æ æ ·å¼æ©å± => å
å å¾æ èå² |
|---|
| | | SolidWasteIcon () { |
|---|
| | | return this.L.Icon.extend({ |
|---|
| | | options: { |
|---|
| | | iconSize: [50, 50], |
|---|
| | | iconAnchor: [25, 25] |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // æ ¹æ®ç±»åè¿åå¾çå è½½url |
|---|
| | | SolidWasteIconUrl (determineValueOne, determineValueTwo, position) { |
|---|
| | | var EffectOfChange |
|---|
| | | if (determineValueOne === 1 || determineValueTwo === 1) { |
|---|
| | | EffectOfChange = defaultImg |
|---|
| | | this.EffectOfPulse(position, this.solidWasteMarkersLabels, this.SolidWasteLayerGroup) |
|---|
| | | } else { |
|---|
| | | EffectOfChange = Setting |
|---|
| | | } |
|---|
| | | return EffectOfChange |
|---|
| | | } |
|---|
| | | |
|---|
| | | // èå²ææ设置å®ç° |
|---|
| | | EffectOfPulse (position, markers, layerGroup) { |
|---|
| | | // // åºåç´æ¥æ§è¡ åå¤ææ§è¡çä¸ååºå« |
|---|
| | | var differentColor = '' |
|---|
| | | if (markers) { |
|---|
| | | differentColor = '#ff0000' |
|---|
| | | } else { |
|---|
| | | differentColor = '#98FB98' |
|---|
| | | } |
|---|
| | | // åæ æ°æ®ï¼æ¥è¦ä¼ è¿æ¥çæ¯æ°ç» / ç¹å»ä¼ è¿æ¥çæ¯object |
|---|
| | | 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.SolidWasteLayerGroup) |
|---|
| | | this.PulseCountSetting() |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 对å¾æ èå² è¿è¡set设置 // é«äº®å¾å± |
|---|
| | | 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.SolidWasteLayerGroup) { |
|---|
| | | // this.SolidWasteLayerGroup.clearLayers() |
|---|
| | | } else { |
|---|
| | | this.SolidWasteLayerGroup = this.L.layerGroup().addTo(this.map) |
|---|
| | | } |
|---|
| | | if ((this.pulseHeighLightMarker)) { |
|---|
| | | this.pulseHeighLightMarker.remove() |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | export default AddSolidWasteHelper |
|---|
| New file |
| | |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // import { requestSolidWaste } from '@/api/request' |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // import '@components/BaseNav/style.css' |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // // å±ç¤ºå¾ç |
|---|
| | | // import defaultImg from '@components/BaseNav/magicMarker.png' |
|---|
| | | // import Setting from '@components/BaseNav/voc.png' |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // åºå¾ä¸å¡å±ç¤ºç¹ |
|---|
| | | // class AddSolidWasteHelper { |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // constructor (options) { |
|---|
| | | // this.map = options.map |
|---|
| | | // this.L = window.L |
|---|
| | | // this.SolidWasteLayerGroup = this.L.layerGroup().addTo(this.map) |
|---|
| | | // this.SolidWastePopup = null |
|---|
| | | // this.L.sgis = this.L.sgis || this.L |
|---|
| | | // this.solidWasteMarkersLabels = [] |
|---|
| | | // this.pulseHeighLightMarker = null |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // 请æ±æ°æ® data 为åæ°ï¼ 请æ±åå°æ°æ®æ¶ æºå¸¦dataåæ° |
|---|
| | | // requestData () { |
|---|
| | | // requestSolidWaste().then(res => { |
|---|
| | | // // console.log(res) |
|---|
| | | // this.DrawTheSolidWasteContent(res.Result.DataInfo) |
|---|
| | | // }).catch(err => { |
|---|
| | | // console.log(err) |
|---|
| | | // }) |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // æ ¹æ®è·åæ°æ® ç»åº å
容 |
|---|
| | | // DrawTheSolidWasteContent (data) { |
|---|
| | | // // å¾æ æ ·å¼æ©å± |
|---|
| | | // var SolidWasteIcon = this.SolidWasteIcon() |
|---|
| | | // |
|---|
| | | // // //å è½½æ°æ®åå¦æåå¨å¾å±ç» é£ä¹æ¸
é¤æ |
|---|
| | | // if (this.SolidWasteLayerGroup) { |
|---|
| | | // this.SolidWasteLayerGroup.clearLayers() |
|---|
| | | // } |
|---|
| | | // for (let i = 0; i < data.length; i++) { |
|---|
| | | // // ç»çº¬åº¦ ä½ç½® |
|---|
| | | // const positionX = data[i].positionX |
|---|
| | | // const positionY = data[i].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 |
|---|
| | | // |
|---|
| | | // // å¼¹åºæ¡divå
容 |
|---|
| | | // // var storevoinfo=null,storevodelinfo=[]; |
|---|
| | | // // for(var j=0;j<storevo.length;j++){ |
|---|
| | | // // if(itm.StoragePlaceId==storevo[j].StoragePlaceId){ |
|---|
| | | // // storevoinfo=storevo[j]; |
|---|
| | | // // } |
|---|
| | | // // } |
|---|
| | | // // for(var k=0;k<storedel.length;k++){ |
|---|
| | | // // if(itm.StoragePlaceId==storedel[k].StoragePlaceId){ |
|---|
| | | // // storevodelinfo.push(storedel[k]); |
|---|
| | | // // } |
|---|
| | | // // } |
|---|
| | | // const content = this.solidWastePpopupContent(data[i], 'c', 'z') |
|---|
| | | // // console.log(content) |
|---|
| | | // |
|---|
| | | // const marker = this.L.marker([positionX, positionY], { icon: Icon }) |
|---|
| | | // |
|---|
| | | // marker.bindPopup(content, () => { |
|---|
| | | // return this.SolidWastePopup.$el |
|---|
| | | // }, { |
|---|
| | | // className: 's-map-popup', |
|---|
| | | // minWidth: 200, |
|---|
| | | // 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.SolidWastePopup.SetDisplayContent(content) |
|---|
| | | // this.EffectOfPulse(e.target.getLatLng()) |
|---|
| | | // } catch (error) { |
|---|
| | | // console.log(error) |
|---|
| | | // } |
|---|
| | | // }) |
|---|
| | | // marker.on('popupopen', (e) => { |
|---|
| | | // try { |
|---|
| | | // this.solidWastePpopupContent(content) |
|---|
| | | // } catch (e) { |
|---|
| | | // console.log(e) |
|---|
| | | // } |
|---|
| | | // }) |
|---|
| | | // // 设置å
容添å å°å¾å± |
|---|
| | | // // this.solidWasteMarkersLabels.push(marker) |
|---|
| | | // this.SolidWasteLayerGroup.addLayer(marker) |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // åºåºç¹å»è¿è¡ç å
容ç设置 |
|---|
| | | // SetSolidWasteContent (config, containerPopup) { |
|---|
| | | // this.SolidWastePopup = containerPopup |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // å¾æ æ ·å¼æ©å± => å
å å¾æ èå² |
|---|
| | | // SolidWasteIcon () { |
|---|
| | | // return this.L.Icon.extend({ |
|---|
| | | // options: { |
|---|
| | | // iconSize: [40, 40], |
|---|
| | | // iconAnchor: [20, 20] |
|---|
| | | // } |
|---|
| | | // }) |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // æ ¹æ®ç±»åè¿åå¾çå è½½url |
|---|
| | | // SolidWasteIconUrl (determineValueOne, determineValueTwo, position) { |
|---|
| | | // var EffectOfChange |
|---|
| | | // if (determineValueOne === 1 || determineValueTwo === 1) { |
|---|
| | | // EffectOfChange = defaultImg |
|---|
| | | // this.EffectOfPulse(position, 'SolidWaste', this.solidWasteMarkersLabels, this.SolidWasteLayerGroup) |
|---|
| | | // } else { |
|---|
| | | // EffectOfChange = Setting |
|---|
| | | // } |
|---|
| | | // return EffectOfChange |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // èå²ææ设置å®ç° |
|---|
| | | // EffectOfPulse (position, name, markers, layerGroup) { |
|---|
| | | // // // åºåç´æ¥æ§è¡ åå¤ææ§è¡çä¸ååºå« |
|---|
| | | // var differentColor = '' |
|---|
| | | // if (markers) { |
|---|
| | | // differentColor = '#ff0000' // æå
容 ï¼ç´æ¥ä¸ºæ¥è¦ æ§è¡æ¥è¦çå
容 |
|---|
| | | // } else { |
|---|
| | | // differentColor = '#98FB98' // å¦å 为ç¹å»æ§è¡ |
|---|
| | | // } |
|---|
| | | // // åæ æ°æ®ï¼æ¥è¦ä¼ è¿æ¥çæ¯æ°ç» / ç¹å»ä¼ è¿æ¥çæ¯object |
|---|
| | | // var FinalPosition = position instanceof Array ? { |
|---|
| | | // lat: position[0], |
|---|
| | | // lng: position[1] |
|---|
| | | // } : position |
|---|
| | | // // æ件 ææå®ç° |
|---|
| | | // var pulsingIcon = this.L.icon.pulse({ |
|---|
| | | // iconSize: [25, 25], |
|---|
| | | // 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.SolidWasteLayerGroup) |
|---|
| | | // this.PulseCountSetting() |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // 对å¾æ èå² è¿è¡set设置 // é«äº®å¾å± |
|---|
| | | // PulseCountSetting () { |
|---|
| | | // var HeightLightTime = 1 |
|---|
| | | // 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.SolidWasteLayerGroup) { |
|---|
| | | // // this.SolidWasteLayerGroup.clearLayers() |
|---|
| | | // } else { |
|---|
| | | // this.SolidWasteLayerGroup = this.L.layerGroup().addTo(this.map) |
|---|
| | | // } |
|---|
| | | // if ((this.pulseHeighLightMarker)) { |
|---|
| | | // this.pulseHeighLightMarker.remove() |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // |
|---|
| | | // // ç¹å»ä¸å¡å
容 å¼¹åºæ°æ®çæ°æ®è¿è¡ä¿®æ¹ |
|---|
| | | // solidWastePpopupContent (data) { |
|---|
| | | // console.log(data) |
|---|
| | | // const html = data.StoragePlaceName |
|---|
| | | // return html |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // /* -------------------------------------------------------------------------------------------------------------------------- */ |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // export default AddSolidWasteHelper |
|---|
| | | |
|---|
| | | // <template> |
|---|
| | | // <div class="full-screen"> |
|---|
| | | // <div id="map" ref="rootmap"></div> |
|---|
| | | // <el-button type="primary" @click="ChangeState">åºåº</el-button> |
|---|
| | | // <SolidContent ref="SolidWastePopup" @callPopup="callPopup"></SolidContent> |
|---|
| | | // </div> |
|---|
| | | // </template> |
|---|
| | | // |
|---|
| | | // <script> |
|---|
| | | // import 'leaflet/dist/leaflet.css' |
|---|
| | | // import Sgis from '@/Sgis' |
|---|
| | | // |
|---|
| | | // // åºå¾ä¸å¡jsé»è¾ |
|---|
| | | // import AddSolidWasteHelper from '@components/BaseNav/SolidWaste' |
|---|
| | | // |
|---|
| | | // // åºå¾ç»å® ç¹å» å¼¹åºçæ°æ® |
|---|
| | | // import SolidContent from '@components/BaseNav/SolidContent' |
|---|
| | | // |
|---|
| | | // export default { |
|---|
| | | // name: 'HomePage', |
|---|
| | | // components: { |
|---|
| | | // SolidContent |
|---|
| | | // }, |
|---|
| | | // data () { |
|---|
| | | // return { |
|---|
| | | // map: null, |
|---|
| | | // lcServiceLayerVisible: false, |
|---|
| | | // basemapHelper: {}, |
|---|
| | | // serviceLayerHelper: {}, |
|---|
| | | // vectorLayerHelper: {} |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // computed: { |
|---|
| | | // config () { |
|---|
| | | // return this.$store.state.map.config |
|---|
| | | // }, |
|---|
| | | // SolidWasteConfig () { |
|---|
| | | // return this.$store.state.map.SolidWasteConfig |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // beforeMount () { |
|---|
| | | // this.$nextTick(() => { |
|---|
| | | // this.init() |
|---|
| | | // }) |
|---|
| | | // }, |
|---|
| | | // methods: { |
|---|
| | | // init () { |
|---|
| | | // const mapcontainer = this.$refs.rootmap |
|---|
| | | // this.map = Sgis.initMap(mapcontainer) |
|---|
| | | // |
|---|
| | | // this.basemapHelper = Sgis.initBasemapsHelper(this.map) // åå§ååºç¡åºå¾å©æ |
|---|
| | | // this.basemapHelper.initBasemap(this.config, false) // 第äºä¸ªåæ°ï¼è¡¨ç¤ºæ¯å¦å
ç½åºå¾ |
|---|
| | | // |
|---|
| | | // this.ChangeState() |
|---|
| | | // }, |
|---|
| | | // ChangeState () { |
|---|
| | | // // 请æ±æ°æ® æºå¸¦åæ° data |
|---|
| | | // // const data = { |
|---|
| | | // // // companyId: 3900100145, |
|---|
| | | // // // companyCode: 31800000, |
|---|
| | | // // // monDuration: 4 |
|---|
| | | // // } |
|---|
| | | // // å¼å
¥ä¸å¡é»è¾ js |
|---|
| | | // const AddSolidWaste = new AddSolidWasteHelper({ map: this.map }) |
|---|
| | | // // ä¸å¡é»è¾js ç请æ±æ°æ® // 并ä¸ä¼ éå¾ç ç¨äºå建ç¹ç icon |
|---|
| | | // AddSolidWaste.requestData() |
|---|
| | | // // // ç¹å» 设置 å¼¹åºå
容äºä»¶ de 设置 console.log(this.$refs.popup.$el) |
|---|
| | | // // AddSolidWaste.SetSolidWasteContent(this.SolidWasteConfig, this.$refs.SolidWastePopup) |
|---|
| | | // }, |
|---|
| | | // callPopup (val) { |
|---|
| | | // console.log(val) |
|---|
| | | // }, |
|---|
| | | // displayDefault () { |
|---|
| | | // // this.serviceLayerHelper = Sgis.initTileLayersHelper(this.map) // åå§åä¸å¡åºå¾å©æ |
|---|
| | | // // this.serviceLayerHelper.initServiceLayers(this.config, this.$refs.popup) |
|---|
| | | // |
|---|
| | | // // this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // åå§åå¨æè¦ç´ å¾å±å©æ |
|---|
| | | // // this.vectorLayerHelper.initVectorLayers(this.config) |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // </script> |
|---|
| | | // |
|---|
| | | // <style lang="less"> |
|---|
| | | // |
|---|
| | | // .leaflet-div-icon { |
|---|
| | | // background: none; |
|---|
| | | // border: none; |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // .full-screen { |
|---|
| | | // width: 100%; |
|---|
| | | // height: 100%; |
|---|
| | | // margin: 0; |
|---|
| | | // padding: 0; |
|---|
| | | // position: absolute; |
|---|
| | | // |
|---|
| | | // button { |
|---|
| | | // position: absolute; |
|---|
| | | // top: 88px; |
|---|
| | | // left: 88px; |
|---|
| | | // z-index: 999; |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // #map { |
|---|
| | | // height: 100%; |
|---|
| | | // width: 100%; |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // .barline { |
|---|
| | | // //width: 100%; |
|---|
| | | // //height: 1px; |
|---|
| | | // //background-color: #0661AE; |
|---|
| | | // border-top: 1px solid #0661AE; |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // #map-btn { |
|---|
| | | // position: fixed; |
|---|
| | | // top: 20px; |
|---|
| | | // left: 100px; |
|---|
| | | // z-index: 9999; |
|---|
| | | // } |
|---|
| | | // |
|---|
| | | // .leaflet-custom-icon { |
|---|
| | | // background: white; |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <el-tabs> |
|---|
| | | <el-tab-pane :label="displayContent.StoragePlaceName" name=""> |
|---|
| | | <el-table |
|---|
| | | :data="tableData" :fit="true"> |
|---|
| | | <el-table-column |
|---|
| | | type="index" |
|---|
| | | label="åºå·"> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | type="index" |
|---|
| | | label="åºå·"> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | type="index" |
|---|
| | | label="åºå·"> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column label="åºåº(t)"> |
|---|
| | | <el-table-column |
|---|
| | | prop="province" |
|---|
| | | label="累计产çé"> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | prop="city" |
|---|
| | | label="å½æ产çé"> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | </el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | name: 'SolidWasteTable', |
|---|
| | | props: ['displayContent'], |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | tableData: [{ |
|---|
| | | date: 'éå¢å
¬å¸', |
|---|
| | | name: '35', |
|---|
| | | province: '23', |
|---|
| | | city: '11', |
|---|
| | | address: 235, |
|---|
| | | zip: 23 |
|---|
| | | }, { |
|---|
| | | date: '天津ç³å', |
|---|
| | | name: 32, |
|---|
| | | province: 33, |
|---|
| | | city: 44, |
|---|
| | | address: 53, |
|---|
| | | zip: 200333 |
|---|
| | | }, { |
|---|
| | | date: 'æµåç¼å', |
|---|
| | | name: 35, |
|---|
| | | province: 13, |
|---|
| | | city: 33, |
|---|
| | | address: 44, |
|---|
| | | zip: 200333 |
|---|
| | | }] |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | import Vue from 'vue' |
|---|
| | | |
|---|
| | | // èªå®ä¹å
ç´ å®ç°å¼¹æ¡ææ½[éç¹] |
|---|
| | | Vue.directive('draw', { |
|---|
| | | inserted: function (el, binding, vNode) { |
|---|
| | | el.setAttribute('style', 'position: fixed; z-index: 9999') |
|---|
| | | }, |
|---|
| | | bind: function (el, bindding, vNode) { |
|---|
| | | el.setAttribute('draggable', true) |
|---|
| | | let left, top, width, height |
|---|
| | | el._dragstart = function (event) { |
|---|
| | | event.stopPropagation() |
|---|
| | | left = event.clientX - el.offsetLeft |
|---|
| | | top = event.clientY - el.offsetTop |
|---|
| | | width = el.offsetWidth |
|---|
| | | height = el.offsetHeight |
|---|
| | | } |
|---|
| | | el._checkPosition = function () { // é²æ¢è¢«æåºè¾¹ç |
|---|
| | | const width = el.offsetWidth |
|---|
| | | const height = el.offsetHeight |
|---|
| | | let left = Math.min(el.offsetLeft, document.body.clientWidth - width) |
|---|
| | | left = Math.max(0, left) |
|---|
| | | let top = Math.min(el.offsetTop, document.body.clientHeight - height) |
|---|
| | | top = Math.max(0, top) |
|---|
| | | el.style.left = left + 'px' |
|---|
| | | el.style.top = top + 'px' |
|---|
| | | el.style.width = width + 'px' |
|---|
| | | el.style.height = height + 'px' |
|---|
| | | } |
|---|
| | | el._dragEnd = function (event) { |
|---|
| | | event.stopPropagation() |
|---|
| | | left = event.clientX - left |
|---|
| | | top = event.clientY - top |
|---|
| | | el.style.left = left + 'px' |
|---|
| | | el.style.top = top + 'px' |
|---|
| | | el.style.width = width + 'px' |
|---|
| | | el.style.height = height + 'px' |
|---|
| | | el._checkPosition() |
|---|
| | | } |
|---|
| | | el._documentAllowDraop = function (event) { |
|---|
| | | event.preventDefault() |
|---|
| | | } |
|---|
| | | document.body.addEventListener('dragover', el._documentAllowDraop) |
|---|
| | | el.addEventListener('dragstart', el._dragstart) |
|---|
| | | el.addEventListener('dragend', el._dragEnd) |
|---|
| | | window.addEventListener('resize', el._checkPosition) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | unbind: function (el, bindding, vNode) { |
|---|
| | | document.body.removeEventListener('dragover', el._documentAllowDraop) |
|---|
| | | el.removeEventListener('dragstart', el._dragstart) |
|---|
| | | el.removeEventListener('dragend', el._dragEnd) |
|---|
| | | window.removeEventListener('resize', el._checkPosition) |
|---|
| | | delete el._documentAllowDraop |
|---|
| | | delete el._dragstart |
|---|
| | | delete el._dragEnd |
|---|
| | | delete el._checkPosition |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // v-dialogDrag: å¼¹çªææ½ |
|---|
| | | Vue.directive('dialogDrag', { |
|---|
| | | bind (el, binding, vnode, oldVnode) { |
|---|
| | | const dialogHeaderEl = el.querySelector('.el-dialog__header') |
|---|
| | | const dragDom = el.querySelector('.el-dialog') |
|---|
| | | dialogHeaderEl.style.cursor = 'move' |
|---|
| | | |
|---|
| | | // è·ååæå±æ§ ie domå
ç´ .currentStyle ç«çè°·æ window.getComputedStyle(domå
ç´ , null); |
|---|
| | | const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null) |
|---|
| | | |
|---|
| | | dialogHeaderEl.onmousedown = (e) => { |
|---|
| | | // é¼ æ æä¸ï¼è®¡ç®å½åå
ç´ è·ç¦»å¯è§åºçè·ç¦» |
|---|
| | | const disX = e.clientX - dialogHeaderEl.offsetLeft |
|---|
| | | const disY = e.clientY - dialogHeaderEl.offsetTop |
|---|
| | | |
|---|
| | | // è·åå°çå¼å¸¦px æ£åå¹é
æ¿æ¢ |
|---|
| | | let styL, styT |
|---|
| | | |
|---|
| | | // 注æå¨ieä¸ ç¬¬ä¸æ¬¡è·åå°çå¼ä¸ºç»ä»¶èªå¸¦50% 移å¨ä¹åèµå¼ä¸ºpx |
|---|
| | | if (sty.left.includes('%')) { |
|---|
| | | styL = +document.body.clientWidth * (+sty.left.replace(/%/g, '') / 100) |
|---|
| | | styT = +document.body.clientHeight * (+sty.top.replace(/%/g, '') / 100) |
|---|
| | | } else { |
|---|
| | | styL = +sty.left.replace(/px/g, '') |
|---|
| | | styT = +sty.top.replace(/px/g, '') |
|---|
| | | } |
|---|
| | | |
|---|
| | | document.onmousemove = function (e) { |
|---|
| | | // éè¿äºä»¶å§æï¼è®¡ç®ç§»å¨çè·ç¦» |
|---|
| | | const l = e.clientX - disX |
|---|
| | | const t = e.clientY - disY |
|---|
| | | |
|---|
| | | // 移å¨å½åå
ç´ |
|---|
| | | dragDom.style.left = `${l + styL}px` |
|---|
| | | dragDom.style.top = `${t + styT}px` |
|---|
| | | |
|---|
| | | // å°æ¤æ¶çä½ç½®ä¼ åºå» |
|---|
| | | // binding.value({x:e.pageX,y:e.pageY}) |
|---|
| | | } |
|---|
| | | |
|---|
| | | document.onmouseup = function (e) { |
|---|
| | | document.onmousemove = null |
|---|
| | | document.onmouseup = null |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // v-dialogDragWidth: å¼¹çªå®½åº¦æ大 æå° |
|---|
| | | Vue.directive('dialogDragWidth', { |
|---|
| | | bind (el, binding, vnode, oldVnode) { |
|---|
| | | const dragDom = binding.value.$el.querySelector('.el-dialog') |
|---|
| | | |
|---|
| | | el.onmousedown = (e) => { |
|---|
| | | // é¼ æ æä¸ï¼è®¡ç®å½åå
ç´ è·ç¦»å¯è§åºçè·ç¦» |
|---|
| | | const disX = e.clientX - el.offsetLeft |
|---|
| | | |
|---|
| | | document.onmousemove = function (e) { |
|---|
| | | e.preventDefault() // 移å¨æ¶ç¦ç¨é»è®¤äºä»¶ |
|---|
| | | |
|---|
| | | // éè¿äºä»¶å§æï¼è®¡ç®ç§»å¨çè·ç¦» |
|---|
| | | const l = e.clientX - disX |
|---|
| | | dragDom.style.width = `${l}px` |
|---|
| | | } |
|---|
| | | |
|---|
| | | document.onmouseup = function (e) { |
|---|
| | | document.onmousemove = null |
|---|
| | | document.onmouseup = null |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| New file |
| | |
|---|
| | | .s-map-popup { |
|---|
| | | background: red; |
|---|
| | | height: 100px; |
|---|
| | | } |
|---|
| | |
|---|
| | | <monitor-panel></monitor-panel> |
|---|
| | | <!-- <top-enterprise-panel></top-enterprise-panel>--> |
|---|
| | | <tool-box-panel ref="toolBox"></tool-box-panel> |
|---|
| | | <!-- <menu-special></menu-special>--> |
|---|
| | | <!-- <menu-special></menu-special>--> |
|---|
| | | <legend-panel></legend-panel> |
|---|
| | | <summary-sheets></summary-sheets> |
|---|
| | | <enterprise></enterprise> |
|---|
| | | <!-- <el-button id="map-btn" el-icon-c-scale-to-original icon="el-icon-c-scale-to-original" circle @click="isShowHidden"></el-button>--> |
|---|
| | | <!-- <el-button id="map-btn" el-icon-c-scale-to-original icon="el-icon-c-scale-to-original" circle @click="isShowHidden"></el-button>--> |
|---|
| | | <el-button type="primary" @click="ChangeState" class="solid-waste">åºåº</el-button> |
|---|
| | | <SolidContent ref="SolidWastePopup"></SolidContent> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | |
|---|
| | | // import MenuSpecial from '@components/panel/MenuTopic' |
|---|
| | | import LegendPanel from '@components/panel/LegendPanel' |
|---|
| | | import Enterprise from '../components/table/enterprise' |
|---|
| | | import SolidContent from '@components/BaseNav/SolidContent' |
|---|
| | | // åºå¾ä¸å¡jsé»è¾ |
|---|
| | | import AddSolidWasteHelper from '@components/BaseNav/SolidWaste' |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: 'MapTemplate', |
|---|
| | |
|---|
| | | LcBasemap, |
|---|
| | | LcServiceLayer, |
|---|
| | | Popup, |
|---|
| | | summarySheets |
|---|
| | | summarySheets, |
|---|
| | | SolidContent |
|---|
| | | }, |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | ChangeState () { |
|---|
| | | const AddSolidWaste = new AddSolidWasteHelper({ map: this.map }) |
|---|
| | | AddSolidWaste.requestData() |
|---|
| | | AddSolidWaste.SetSolidWasteContent(this.config, this.$refs.SolidWastePopup) |
|---|
| | | }, |
|---|
| | | isShowHidden () { |
|---|
| | | this.isShowBtn = !this.isShowBtn |
|---|
| | | }, |
|---|
| | |
|---|
| | | |
|---|
| | | this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // åå§åå¨æè¦ç´ å¾å±å©æ |
|---|
| | | this.vectorLayerHelper.initVectorLayers(this.config) |
|---|
| | | |
|---|
| | | // this.ChangeState() |
|---|
| | | |
|---|
| | | this.saveMapStatus() |
|---|
| | | // this.setMapObj(this.mapObj) |
|---|
| | |
|---|
| | | |
|---|
| | | <style lang="less"> |
|---|
| | | |
|---|
| | | .solid-waste { |
|---|
| | | position: absolute; |
|---|
| | | top: 88px; |
|---|
| | | left: 88px; |
|---|
| | | z-index: 999; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .full-screen { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | |
|---|
| | | //background-color: #0661AE; |
|---|
| | | border-top: 1px solid #0661AE; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #map-btn { |
|---|
| | | position: fixed; |
|---|
| | | top: 20px; |
|---|
| | | left: 100px; |
|---|
| | | z-index: 9999; |
|---|
| | | } |
|---|
| | | .leaflet-custom-icon{ |
|---|
| | | |
|---|
| | | .leaflet-custom-icon { |
|---|
| | | background: white; |
|---|
| | | } |
|---|
| | | } |
|---|
