区域管理优化

src/views/system/dept/index.vue

@@ -187,6 +187,7 @@ function getList() {
    loading.value = true;
    listDept(queryParams.value).then(response => {
       deptList.value = proxy.handleTree(response.data, "deptId");
+      console.log('deptList:', deptList.value);
       loading.value = false;
    });
 }
@@ -299,8 +300,8 @@ function handleDelete(row) {
 }
 
 function handleSetting(row) {
-console.log("TCL: handleSetting -> row", row)
-   router.push({ path: '/map-setting',query: {id:row.deptId}});
+  localStorage.setItem('mapDeptRow', JSON.stringify(row));
+  router.push({ path: '/map-setting', query: { deptId: row.deptId } });
 }
 
 function handleAreaOption() {

src/views/system/dept/mapSetting.vue

@@ -17,6 +17,7 @@
       <button @click.stop="onSelectGeometry">选中图形</button>
       <button @click.stop="onGetSelectedList">获取选中集合图形</button>
       <button @click.stop="onClear">清空选中</button>
+      <button @click.stop="onSavePointList">保存地址</button>
     </div>
     <!--vue2使用:active-overlay-id.sync="activeId" -->
     <tlbs-geometry-editor
@@ -35,10 +36,19 @@
   </tlbs-map>
 </template>
 <script setup>
-import { ref, watch } from 'vue'
-import { onMounted } from 'vue'
+import { ref, watch, onMounted, getCurrentInstance } from 'vue'
 import { getMapCoder } from '@/api/map'
 import { updateDept } from '@/api/system/dept'
+import { useRoute } from 'vue-router'
+const { proxy } = getCurrentInstance()
+const route = useRoute()
+const deptForm = ref({})
+onMounted(() => {
+  const row = localStorage.getItem('mapDeptRow')
+  if (row) {
+    deptForm.value = JSON.parse(row)
+  }
+})
 const paths = [
   { lat: 40.041117253378246, lng: 116.2722415837743 },
   { lat: 40.03942536171407, lng: 116.2726277820093 },
@@ -51,6 +61,7 @@ const zoom = ref(17)
 const editorRef = ref(null)
 const mode = ref('edit')
 const activeId = ref('polygon')
+const latestPointList = ref([])
 const onToggleMode = () => {
   mode.value = mode.value === 'draw' ? 'edit' : 'draw'
 }
@@ -61,17 +72,14 @@ const onSelect = (e) => {
 const onDrowComplet = (geomeytry) => {
   // 兼容 geomeytry 里可能的 paths 字段
   const pointList = geomeytry.paths || geomeytry.pointList || [];
+  latestPointList.value = pointList;
   console.log({ pointList }, '这是地址获取到的数据');
 }
 const onAdjustComplete = (geomeytry) => {
   // 兼容 geomeytry 里可能的 paths 字段
   const pointList = geomeytry.paths || geomeytry.pointList || [];
+  latestPointList.value = pointList;
   console.log({ pointList }, '这是地址获取到的数据');
-  updateDept({ pointList: JSON.stringify(pointList) }).then((response) => {
-    proxy.$modal.msgSuccess('修改成功')
-    open.value = false
-    getList()
-  })
 }
 const onDrawError = (e) => {
   console.log(e)
@@ -124,6 +132,26 @@ function onSelectGeometry() {
 function onGetSelectedList() {
   console.log(editorRef.value.editor.getSelectedList())
 }
+function onSavePointList() {
+  if (!latestPointList.value.length) {
+    proxy.$modal.msgError('请先绘制或调整图形');
+    return;
+  }
+  // 合并所有部门字段和 pointList
+  const payload = {
+    ...deptForm.value,
+    pointList: JSON.stringify(latestPointList.value)
+  }
+  updateDept(payload).then((response) => {
+    if (response.code === 200) {
+      proxy.$modal.msgSuccess('地址保存成功');
+      open.value = false;
+      getList();
+    } else {
+      proxy.$modal.msgError(response.msg || '地址保存失败');
+    }
+  })
+}
 </script>
 
 <style>