From 6c1917d9c3bb6b2e4ff234c175ef9328d4fbb33a Mon Sep 17 00:00:00 2001
From: 100011797 <2642441182@qq.com>
Date: Fri, 27 Oct 2023 10:19:21 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=8C=BA=E5=9F=9F=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E7=9A=84=E7=BC=96=E8=BE=91=E7=9A=84=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/Region/Save/TracePoint.vue | 44 +++++++++++++++-----
 src/views/system/Region/Save/index.vue      |  2 +-
 src/views/system/Region/index.vue           | 46 ++++++++++++++-------
 3 files changed, 65 insertions(+), 27 deletions(-)

diff --git a/src/views/system/Region/Save/TracePoint.vue b/src/views/system/Region/Save/TracePoint.vue
index 1049b96b..7281fc21 100644
--- a/src/views/system/Region/Save/TracePoint.vue
+++ b/src/views/system/Region/Save/TracePoint.vue
@@ -1,21 +1,45 @@
 <template>
-    <j-button v-if="!_value.length" type="link">请在地图上描点</j-button>
-    <div v-else>
-        已完成描点<j-button type="link">编辑</j-button>
-    </div>
+    <j-button @click="onClick" v-if="!_value.length" type="link"
+        >请在地图上描点</j-button
+    >
+    <div v-else>已完成描点<j-button type="link" @click="onEdit">编辑</j-button></div>
 </template>
 
 <script lang="ts" setup>
-import { ref } from "vue"
+import { ref, watch, inject } from 'vue';
 
 const props = defineProps({
     value: {
         type: Array,
-        default: () => []
-    }
-})
+        default: () => [],
+    },
+});
 
-const emits = defineEmits(['update:value'])
+const emits = defineEmits(['update:value', 'close']);
 
-const _value = ref<any[]>([])
+const _value = ref<any[]>([]);
+
+const __data: any = inject('system-region')
+
+const onClick = () => {
+    console.log(__data)
+    __data.type.value = 'edit'
+    emits('close')
+};
+
+const onEdit = () => {
+    // __data.type.value = 'edit'
+    // emits('close')
+}
+
+watch(
+    () => props.value,
+    () => {
+        console.log(props.value)
+    },
+    {
+        deep: true,
+        immediate: true,
+    },
+);
 </script>
\ No newline at end of file
diff --git a/src/views/system/Region/Save/index.vue b/src/views/system/Region/Save/index.vue
index 51ecd3a5..af122b86 100644
--- a/src/views/system/Region/Save/index.vue
+++ b/src/views/system/Region/Save/index.vue
@@ -97,7 +97,7 @@
                     required
                     name="features"
                 >
-                    <TracePoint v-model:value="modelRef.features" />
+                    <TracePoint @close="emit('close')" v-model:value="modelRef.features" />
                 </j-form-item>
             </j-form>
         </div>
diff --git a/src/views/system/Region/index.vue b/src/views/system/Region/index.vue
index 2bb44c6b..80eeafdd 100644
--- a/src/views/system/Region/index.vue
+++ b/src/views/system/Region/index.vue
@@ -1,15 +1,16 @@
 <template>
     <page-container>
-      <full-page>
-        <div class="region">
-            <div class="left">
-                <LeftTree />
+        <full-page>
+            <div class="region">
+                <div class="left">
+                    <LeftTree />
+                    <div class="mask" v-if="type === 'edit'"></div>
+                </div>
+                <div class="right">
+                    <Map :path="path" :type="mapType" />
+                </div>
             </div>
-            <div class="right">
-                <Map :path="path" type="create" />
-            </div>
-        </div>
-      </full-page>
+        </full-page>
     </page-container>
 </template>
 
@@ -17,15 +18,17 @@
 import LeftTree from './LeftTree/index.vue'
 import Map from './MapTool/map.vue'
 import FullPage from "components/Layout/FullPage.vue";
+import { provide } from 'vue'
 
-const searchValue = ref()
-const current = ref<any>({})
 const path = ref([[121.5273285, 31.21515044], [121.5293285, 31.21515044], [121.5293285, 31.21915044], [121.5273285, 31.21515044]])
+const type = ref<'view' | 'edit'>('view')
+const mapType = ref<string>('create')
 
-const onSave = () => {
-
-}
-
+provide('system-region', {
+    type,
+    mapType: '',
+    path
+})
 </script>
 
 <style lang="less" scoped>
@@ -37,12 +40,23 @@ const onSave = () => {
 
     .left {
         width: 300px;
-
+        position: relative;
 
         .btn {
             width: 100%;
             margin: 18px 0;
         }
+
+        .mask {
+            width: 100%;
+            position: absolute;
+            height: 100%;
+            background-color: lightgray;
+            opacity: .5;
+            left: 0;
+            top: 0;
+            z-index: 10;
+        }
     }
     .right {
         flex: 1;