From bf3323fcbe32918dda7099f05be56aa7151b1e26 Mon Sep 17 00:00:00 2001 From: 徐旺旺 <11530253@qq.com> Date: 星期四, 14 一月 2021 15:56:11 +0800 Subject: [PATCH] 细节 --- src/views/MapTemplate.vue | 119 ++++++++++++++++++++++++++++++++++++++++------------------- 1 files changed, 81 insertions(+), 38 deletions(-) diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index 9dfea6c..8b3b26c 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -1,67 +1,110 @@ <template> <div class="full-screen"> - <div id="map" ref="rootmap"></div> - <sgis-layer-controller :preset="'warningPreset'"></sgis-layer-controller> - <monitor-panel></monitor-panel> + <div id="map" ref="rootmap"></div> + <sgis-layer-controller :preset="'warningPreset'"> + <lc-basemap></lc-basemap> + <!-- <div class="barline"></div>--> + <lc-service-layer class="barline"></lc-service-layer> + </sgis-layer-controller> + <lc-service-layer-filter v-show="showServiceLayerFilter" ref="serviceLayerFilter"></lc-service-layer-filter> + <monitor-panel></monitor-panel> + <top-enterprise-panel></top-enterprise-panel> + <tool-box-panel></tool-box-panel> </div> </template> <script> import 'leaflet/dist/leaflet.css' import Sgis from '@src/Sgis' -import mapConfig from '@/conf/MapConfig' +// import mapConfig from '@/conf/MapConfig' import SgisLayerController from '@components/LayerController/LayerController' -import MonitorPanel from '@components/panel/MonitorPanel' -import { mapMutations, mapState } from 'vuex' +import LcBasemap from '@components/LayerController/modules/LcBaseMap' +import LcServiceLayer from '@components/LayerController/modules/LcServiceLayer' +import LcServiceLayerFilter from '@components/LayerController/modules/LcServiceLayerFilter' +import MonitorPanel from '@components/panel/RightSearchPanel' +import TopEnterprisePanel from '@components/panel/TopEnterprisePanel' +import ToolBoxPanel from '@components/panel/ToolBoxPanel' export default { name: 'MapTemplate', - components: {SgisLayerController, MonitorPanel}, - datas:{ - ...mapState("/",{}) + components: { + ToolBoxPanel, + TopEnterprisePanel, + SgisLayerController, + MonitorPanel, + LcBasemap, + LcServiceLayer, + LcServiceLayerFilter }, - mounted(){ - this.$nextTick(() => { - this.init() - }) + data () { + return { + basemapHelper: {}, + serviceLayerHelper: {}, + vectorLayerHelper: {} + } }, - methods:{ - ...mapMutations({ - setMapObj: 'setMapObj', - setLayerHelper: 'setLayerHelper' - }), - init() { - const mapcontainer = this.$refs.rootmap - this.mapObj = Sgis.initMap(mapcontainer) + computed: { + showServiceLayerFilter () { + return this.$store.state.map.showServiceLayerFilter + }, + mapConfig () { + return this.$store.state.map.mapConfig + } + }, + beforeMount () { + this.$nextTick(() => { + this.init() + }) + }, + methods: { + saveMapStatus () { + this.$store.commit('setMapObj', this.mapObj) + this.$store.commit('setBasemapHelper', this.basemapHelper) + this.$store.commit('setServiceLayerHelper', this.serviceLayerHelper) + this.$store.commit('setVectorLayerHelper', this.vectorLayerHelper) + }, + init () { + const mapcontainer = this.$refs.rootmap + this.mapObj = Sgis.initMap(mapcontainer) - this.basemapHelper = Sgis.initBasemapsHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 - this.basemapHelper.initBasemap(mapConfig, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 + this.basemapHelper = Sgis.initBasemapsHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 + this.basemapHelper.initBasemap(this.mapConfig, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 + this.serviceLayerHelper = Sgis.initTileLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� + this.serviceLayerHelper.initServiceLayers(this.mapConfig) - this.serviceLayerHelper = Sgis.initTileLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� - this.serviceLayerHelper.initServiceLayers(mapConfig) + this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� + this.vectorLayerHelper.initVectorLayers(this.mapConfig) - this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.mapObj.map, this.mapObj.L) // 鍒濆鍖栧姩鎬佽绱犲浘灞傚姪鎵� - this.vectorLayerHelper.initVectorLayers(mapConfig) - - this.setLayerHelper(this.vectorLayerHelper) - return this.map - } + this.saveMapStatus() + // this.setMapObj(this.mapObj) + // this.setBasemapHelper(this.basemapHelper) + // this.setServiceLayerHelper(this.serviceLayerHelper) + // this.setVectorLayerHelper(this.vectorLayerHelper) + } } } </script> <style lang="less"> -.full-screen{ - width: 100%; - height: 100%; - margin: 0; - padding: 0; - position: absolute; - #map{ +.full-screen { + width: 100%; + height: 100%; + margin: 0; + padding: 0; + position: absolute; + + #map { height: 100%; width: 100%; } + + .barline { + //width: 100%; + //height: 1px; + //background-color: #0661AE; + border-top: 1px solid #0661AE; + } } </style>> -- Gitblit v1.8.0