From 4df0471b7dff0494625ff09969b1a13b5359a26e Mon Sep 17 00:00:00 2001 From: XingChuan <m17600301067@163.com> Date: 星期一, 31 五月 2021 22:41:47 +0800 Subject: [PATCH] 统计表弹框UI优化;增加点击企业名称缩放至企业;二级表展示功能优化。 --- src/views/MapTemplate.vue | 129 ++++++++++++++++++++++++------------------ 1 files changed, 74 insertions(+), 55 deletions(-) diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index a98e84c..56d30b8 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -1,18 +1,19 @@ <template> <div class="full-screen"> - <popup ref="popup" @callPopup="callPopup"></popup> + <!--<popup ref="popup" @callPopup="callPopup"></popup>--> <div id="map" ref="rootmap"> </div> - <sgis-layer-controller :preset="'warningPreset'"> - <lc-basemap></lc-basemap> - <!-- <div class="barline"></div>--> - <lc-service-layer class="barline" v-if="lcServiceLayerVisible"></lc-service-layer> - </sgis-layer-controller> + <sgis-layer-controller></sgis-layer-controller> <monitor-panel></monitor-panel> <!-- <top-enterprise-panel></top-enterprise-panel>--> - <tool-box-panel :map="this.map"></tool-box-panel> - <menu-special></menu-special> + <tool-box-panel ref="toolBox"></tool-box-panel> + <!-- <menu-special></menu-special>--> <legend-panel></legend-panel> + <!-- <summary-sheets></summary-sheets>--> + <SummarySheet></SummarySheet> + <Emergency ref="Emergency"></Emergency> + <Message></Message> + <event-handling></event-handling> </div> </template> @@ -21,27 +22,33 @@ import Sgis from '@src/Sgis' // import mapConfig from '@/conf/MapConfig' import SgisLayerController from '@components/LayerController/LayerController' -import LcBasemap from '@components/LayerController/modules/LcBaseMap' -import LcServiceLayer from '@components/LayerController/modules/LcServiceLayer' import MonitorPanel from '@components/panel/RightSearchPanel' // import TopEnterprisePanel from '@components/panel/TopEnterprisePanel' +// import summarySheets from '@components/table/summarySheets.vue'SummarySheet +import SummarySheet from '@components/table/summarySheets' import ToolBoxPanel from '@components/panel/ToolBoxPanel' -import Popup from '@views/popup/Popup' -import MenuSpecial from '@components/panel/MenuTopic' import LegendPanel from '@components/panel/LegendPanel' +import LayerFactory from '@components/LayerController/service/LayerFactory' +import Emergency from '@components/emergency/index' +import MapManager from '../components/helpers/MapManager' +import Message from '@components/message/index' +import EventHandling from '../components/base-page/enterprise-emergency/event-handling/EventHandling' export default { name: 'MapTemplate', components: { + EventHandling, + // Enterprise, LegendPanel, - MenuSpecial, + // MenuSpecial, ToolBoxPanel, // TopEnterprisePanel, SgisLayerController, MonitorPanel, - LcBasemap, - LcServiceLayer, - Popup + // summarySheets, + SummarySheet, + Emergency, + Message }, data () { return { @@ -49,7 +56,8 @@ lcServiceLayerVisible: false, basemapHelper: {}, serviceLayerHelper: {}, - vectorLayerHelper: {} + vectorLayerHelper: {}, + toolBoxVisible: false } }, computed: { @@ -75,55 +83,31 @@ init () { const mapcontainer = this.$refs.rootmap this.map = Sgis.initMap(mapcontainer) + this.$refs.toolBox.map = this.map + + window.popupComp = this.$refs.popup this.basemapHelper = Sgis.initBasemapsHelper(this.map) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 this.basemapHelper.initBasemap(this.config, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 - - this.serviceLayerHelper = Sgis.initTileLayersHelper(this.map) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� - console.log(this.$refs.popup.$el) - this.serviceLayerHelper.initServiceLayers(this.config, this.$refs.popup) - this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� this.vectorLayerHelper.initVectorLayers(this.config) + // this.AddGasHelper() + // this.ChangeWaterState() + var layerFactory = new LayerFactory({ + L: window.L, + map: this.map + }) + layerFactory.init(this.$store.state.map.serviceLayers.LayerSewersLine) + layerFactory.initEvent(this.$store.state.map.serviceLayers.LayerSewersLine) + window.layerFactory = layerFactory + window.mapManager = new MapManager() + window.mapManager.mapClickListener() this.saveMapStatus() // this.setMapObj(this.mapObj) // this.setBasemapHelper(this.basemapHelper) // this.setServiceLayerHelper(this.serviceLayerHelper) // this.setVectorLayerHelper(this.vectorLayerHelper) - this.addMarker() - }, - addMarker () { - const L = this.L - var icon = new L.Icon({ - iconUrl: 'assets/images/map/marker-icon.png', - shadowUrl: 'assets/images/map/marker-shadow.png', - iconSize: [25, 41], - iconAnchor: [12, 41], - popupAnchor: [1, -34], - shadowSize: [41, 41] - }) - var marker = L.marker([32.2221, 118.7843], { - icon: icon - }).addTo(this.map) - .bindPopup(() => this.$refs.popup.$el, { - className: 's-map-popup', - minWidth: 300, - closeButton: false, - autoClose: false - }) - .bindTooltip('瀛椾綋鍏夋檿鏁堟灉t.', { - // permanent : true, - offset: [0, 0], // 鍋忕Щ - direction: 'right', // 鏀剧疆浣嶇疆 - // sticky:true,//鏄惁鏍囪鍦ㄧ偣涓婇潰 - className: 'anim-tooltip'// CSS鎺у埗 - }) - - marker.on('popupopen', this.onLayerClick) - }, - onLayerClick () { - this.$refs.popup.setShow() }, callPopup (val) { console.log(val) @@ -133,6 +117,19 @@ </script> <style lang="less"> +.flue-gas { + position: fixed; + top: 88px; + left: 180px; + z-index: 500; +} + +.solid-waste { + position: absolute; + top: 88px; + left: 88px; + z-index: 999; +} .full-screen { width: 100%; @@ -152,5 +149,27 @@ //background-color: #0661AE; border-top: 1px solid #0661AE; } + + #map-btn { + position: fixed; + top: 20px; + left: 100px; + z-index: 9999; + } + + .leaflet-custom-icon { + background: white; + } + + .leaflet-marker-icon { + background: none; + } + + #migic { + width: 48px; + height: 48px; + margin: -18px -20px; + z-index: 999; + } } </style> -- Gitblit v1.8.0