From 1e40f7d8824d8859a6edbec3ae3fd0d857115553 Mon Sep 17 00:00:00 2001
From: YANGDL <114714267@qq.com>
Date: 星期二, 05 一月 2021 12:04:52 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/components/LayerController/modules/LcBaseMap.vue | 87 +++++++++++++++++++++++++++++++++----------
1 files changed, 66 insertions(+), 21 deletions(-)
diff --git a/src/components/LayerController/modules/LcBaseMap.vue b/src/components/LayerController/modules/LcBaseMap.vue
index a9f615c..315c641 100644
--- a/src/components/LayerController/modules/LcBaseMap.vue
+++ b/src/components/LayerController/modules/LcBaseMap.vue
@@ -1,40 +1,85 @@
<template>
-<div class="inner-panel">
+ <div class="inner-panel" v-show="isShow">
<div v-for="item in basemapList" :key="item.code" class="basemap-layer-item">
- <img src="" width="40" height="40" :title="item.name"/>
- <input type="checkbox" title="鏄剧ず鏍囨敞" />
+ <div style="display: flex;">
+ <el-checkbox :src="item.conf.icon_actived" style="display: flex;" name="basemap" v-model="selectedBasemap"
+ :value="item.code" label="item.code" @change="changeBasemap">鏍囨敞
+ </el-checkbox>
+ <img style="position: absolute;" :src="item.conf.icon_actived" width="50" height="50" :title="item.name"
+ @click="changeBasemap"/>
+ </div>
+
+
+ <!-- <input style="position: absolute;" type="radio" name="basemap" v-model="selectedBasemap" :value="item.code" title="鏄剧ず鏍囨敞" @change="changeBasemap"/>鏍囨敞-->
+
</div>
-</div>
+ </div>
</template>
<script>
export default {
- name: 'LcBaseMap',
+ name: "LcBaseMap",
components: {},
- porps:['helper'],
data() {
return {
- basemapList:[]
+ isShow: true,
+ basemapList: [],
+ selectedBasemap: "tianditu_img",
+ };
+ },
+ computed: {
+ basemapHelper() {
+ return this.$store.state.map.basemapHelper
}
},
- mounted(){
- console.log('03姝ラ锛�', this.helper)
+ mounted() {
},
- methods:{
-
- }
-}
+ methods: {
+ toggleShow() {
+ this.isShow = !this.isShow
+ },
+ updateBasemapList() {
+ let list = this.basemapHelper.getBasemapList();
+ this.basemapList = list;
+ },
+ changeBasemap() {
+ this.basemapHelper.showBasemap(this.selectedBasemap, true)
+ },
+ },
+ watch: {
+ basemapHelper(newVal) {
+ if (newVal != null) {
+ this.updateBasemapList();
+ }
+ },
+ },
+};
</script>
<style scoped lang="less">
-.inner-panel{
- display: flex;
- justify-content: center;
- align-items: center;
+.inner-panel {
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
-.basemap-layer-item{
- width: 40px;
- height: 40px;
- margin: 10px;
+
+.basemap-layer-item {
+ display: flex;
+ width: 50px;
+ height: 50px;
+ margin: 10px;
+ border: 2px solid white;
+
+ input {
+ position: relative;
+ left: 0px;
+ top: -53px;
+ }
+
+ .basemap-layer-item-name {
+ position: relative;
+ left: 0px;
+ top: -53px;
+ }
}
</style>
--
Gitblit v1.8.0