From cad0535f3fb14ff09db99ec43169da3aa33b83f2 Mon Sep 17 00:00:00 2001 From: chenyibo <p-honggang.li@pcitc.com> Date: 星期二, 30 三月 2021 16:06:08 +0800 Subject: [PATCH] 1.新增登录界面 --- src/views/MapTemplate.vue | 133 ++++++++++++++++++++------------------------ 1 files changed, 61 insertions(+), 72 deletions(-) diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue index a54d7fc..68b58e4 100644 --- a/src/views/MapTemplate.vue +++ b/src/views/MapTemplate.vue @@ -1,44 +1,55 @@ <template> - <div class="full-screen"> - <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> - <monitor-panel></monitor-panel> -<!-- <top-enterprise-panel></top-enterprise-panel>--> - <tool-box-panel></tool-box-panel> - <menu-special></menu-special> + <div class="full-screen"> + <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> + <monitor-panel></monitor-panel> +<!-- <top-enterprise-panel></top-enterprise-panel>--> + <tool-box-panel ref="toolBox"></tool-box-panel> +<!-- <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>--> + </div> </template> <script> import 'leaflet/dist/leaflet.css' import Sgis from '@src/Sgis' +// import Vue from 'vue' // 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' import ToolBoxPanel from '@components/panel/ToolBoxPanel' import Popup from '@views/popup/Popup' -import MenuSpecial from '@components/panel/MenuSpecial' +// import MenuSpecial from '@components/panel/MenuTopic' +import LegendPanel from '@components/panel/LegendPanel' +import Enterprise from '../components/table/enterprise' export default { name: 'MapTemplate', components: { - MenuSpecial, + Enterprise, + LegendPanel, + // MenuSpecial, ToolBoxPanel, // TopEnterprisePanel, SgisLayerController, MonitorPanel, LcBasemap, LcServiceLayer, - Popup + Popup, + summarySheets }, data () { return { @@ -55,6 +66,9 @@ } }, beforeMount () { + // import('@/assets/airQuality.json').then(res => { + // console.log(res.features) + // }) this.$nextTick(() => { this.init() }) @@ -69,15 +83,17 @@ this.lcServiceLayerVisible = true }, - init () { + init: function () { const mapcontainer = this.$refs.rootmap this.map = Sgis.initMap(mapcontainer) + this.$refs.toolBox.map = this.map this.basemapHelper = Sgis.initBasemapsHelper(this.map) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜 this.basemapHelper.initBasemap(this.config, false) // 绗簩涓弬鏁帮紝琛ㄧず鏄惁鍐呯綉搴曞浘 this.serviceLayerHelper = Sgis.initTileLayersHelper(this.map) // 鍒濆鍖栦笟鍔″簳鍥惧姪鎵� - this.serviceLayerHelper.initServiceLayers(this.config) + 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) @@ -87,42 +103,6 @@ // 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) } } } @@ -130,23 +110,32 @@ <style lang="less"> - .full-screen { - width: 100%; - height: 100%; - margin: 0; - padding: 0; - position: absolute; +.full-screen { + width: 100%; + height: 100%; + margin: 0; + padding: 0; + position: absolute; - #map { - height: 100%; - width: 100%; - } + #map { + height: 100%; + width: 100%; + } - .barline { - //width: 100%; - //height: 1px; - //background-color: #0661AE; - border-top: 1px solid #0661AE; - } - } -</style>> + .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> -- Gitblit v1.8.0