From 4342ccaa6a8dff9f10554867891c3abfbc23f0b1 Mon Sep 17 00:00:00 2001
From: liuyg <liuyg@qq.com>
Date: Thu, 24 Mar 2022 11:59:06 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/school-java-web
---
src/views/hd/baseMapMap.vue | 152 ++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 152 insertions(+), 0 deletions(-)
diff --git a/src/views/hd/baseMapMap.vue b/src/views/hd/baseMapMap.vue
new file mode 100644
index 0000000..822f35d
--- /dev/null
+++ b/src/views/hd/baseMapMap.vue
@@ -0,0 +1,152 @@
+<template>
+ <div class="baseMapMap" :key="Refresh">
+ <MapInThere ref="baseMapMapsMap" />
+ <div class="controlbaseMapMap">
+ <div v-for="(item, index) in mapServiceValue" :key="index">
+ {{ item.type + " " + index }}
+ <el-switch class="around_left" v-model="item.show"> </el-switch>
+ <el-button
+ class="around_left"
+ type="danger"
+ icon="el-icon-delete"
+ circle
+ @click="deleteMapService(index)"
+ :disabled="notSet"
+ ></el-button>
+ <el-divider v-if="index != mapServiceValue.length - 1"></el-divider>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+import MapInThere from "@/components/basemap/mainInThere.vue";
+export default {
+ name: "getMapData",
+ components: {
+ MapInThere,
+ },
+ computed: {
+ ...mapGetters(["mapServiceValue", "notSet"]),
+ },
+ watch: {
+ mapServiceValue: {
+ handler(val) {
+ // console.log("深度监听：", val);
+ //改变父级标单字段验证状态
+ this.$emit("changeMapSI");
+ this.checkDom("baseMapMapsMap", (dom) => {
+ //更改地图图层数据
+ dom.setServiceData(this.mapServiceValue);
+ });
+ },
+ deep: true,
+ },
+ },
+ data() {
+ return {
+ mapServiceData: [],
+ };
+ },
+ destroyed() {
+ //销毁清楚数据
+ this.$store.commit("clearMapServiceValue");
+ this.checkDom("baseMapMapsMap", (dom) => {
+ //更改地图图层数据
+ dom.clearServiceData();
+ });
+ },
+ mounted() {},
+ methods: {
+ deleteMapService(index) {
+ // console.log(index);
+ this.$store.commit("deleteMapServiceValue", index);
+ },
+ // addService(data) {
+ // this.mapServiceData.push({
+ // ...data,
+ // show: true,
+ // });
+ // console.log(this.mapServiceData);
+ // this.$refs.baseMapMapsMap.addMapService();
+ // },
+ checkDom(name, fn) {
+ // 声明定时器
+ let that = this;
+ var timer = null;
+ // 检查dom是否执行完成
+ function checkDom() {
+ let dom = that.$refs[name];
+ if (dom) {
+ // 执行dom加载完成后的操作
+ // 清除定时器
+ if (!timer) {
+ clearTimeout(timer);
+ }
+ if (fn) {
+ //回调函数
+ fn(dom);
+ return;
+ } else {
+ return dom;
+ }
+ } else {
+ // 自我调用
+ timer = setTimeout(checkDom, 100);
+ }
+ }
+ // 首次执行
+ checkDom();
+ },
+ },
+};
+</script>
+
+<style lang="scss">
+.flexCenter {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+.baseMapMap {
+ width: 100%;
+ height: 100%;
+ position: relative;
+ .controlbaseMapMap {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ background-color: #fff;
+ padding: 10px;
+ border-radius: 10px;
+ box-shadow: 0px 0px 10px -3px #000;
+ }
+ // 验证
+ .notPath {
+ // border-bottom: 0.5px solid red;
+ }
+}
+
+//过度动画
+.list-enter {
+ opacity: 0;
+ transform: translateY(10px);
+}
+.list-leave-to {
+ opacity: 0;
+ transform: translateY(-10px);
+}
+
+.list-enter-to,
+.list-leave {
+ opacity: 1;
+}
+ .list-enter-active,
+.list-leave-active {
+ transition: all 0.3s;
+}
+.around_left {
+ padding: 0 5px;
+}
+</style>
--
Gitblit v1.9.3