From 3996eebb89a0813cc00ae457f110297d2de6edca Mon Sep 17 00:00:00 2001
From: wisonic <shaochuan.wu@fit2cloud.com>
Date: Mon, 22 Jul 2024 15:40:52 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E5=9B=BE=E8=A1=A8):=20=E5=9C=B0=E5=9B=BE?=
 =?UTF-8?q?=E5=9B=BE=E8=A1=A8=E5=88=87=E6=8D=A2=E5=90=8E=E5=9C=B0=E5=90=8D?=
 =?UTF-8?q?=E6=98=A0=E5=B0=84=E5=88=97=E8=A1=A8=E6=9C=AA=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../editor-senior/components/MapMapping.vue     | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/core/core-frontend/src/views/chart/components/editor/editor-senior/components/MapMapping.vue b/core/core-frontend/src/views/chart/components/editor/editor-senior/components/MapMapping.vue
index 00d2bb1e38..98755de092 100644
--- a/core/core-frontend/src/views/chart/components/editor/editor-senior/components/MapMapping.vue
+++ b/core/core-frontend/src/views/chart/components/editor/editor-senior/components/MapMapping.vue
@@ -2,6 +2,7 @@
 import { computed, nextTick, onMounted, PropType, reactive, ref, watch } from 'vue'
 import { getGeoJsonFile, parseJson } from '../../../js/util'
 import { forEach, debounce } from 'lodash-es'
+import { toRefs } from 'vue'
 
 const props = defineProps({
   chart: {
@@ -15,9 +16,9 @@ const props = defineProps({
 })
 
 const emit = defineEmits(['onMapMappingChange'])
-const { chart, themes } = props
+const { chart, themes } = toRefs(props)
 watch(
-  [() => props.chart.senior.areaMapping, () => chart.customAttr.map.id],
+  [() => chart.value?.senior.areaMapping, () => chart.value?.customAttr.map.id],
   () => {
     init()
   },
@@ -31,7 +32,7 @@ const search = ref('')
 const areaNameInput = ref(null)
 const areaData = reactive([])
 const dynamicAreaId = computed(() => {
-  return chart.customAttr.map.id
+  return chart.value?.customAttr.map.id
 })
 const state = reactive({
   mappingForm: {},
@@ -43,8 +44,8 @@ const pageInfo = reactive({
   currentPage: 1
 })
 const init = async () => {
-  const chartObj = JSON.parse(JSON.stringify(chart))
-  if (chartObj.senior) {
+  const chartObj = JSON.parse(JSON.stringify(chart.value))
+  if (chartObj?.senior) {
     let senior = parseJson(chartObj.senior)
     state.mappingForm = senior.areaMapping
     let curAreaMapping = state.mappingForm?.[dynamicAreaId.value]
@@ -133,7 +134,7 @@ onMounted(() => {
       :data="areaData"
     >
       <el-table-column label="图形" prop="originName" width="80" show-overflow-tooltip />
-      <el-table-column width="144">
+      <el-table-column width="140">
         <template #header>
           <span>属性</span>
           <el-input
@@ -153,7 +154,7 @@ onMounted(() => {
             :class="'area-edit-btn-' + themes"
             @click="triggerEdit(scope)"
           >
-            <span>{{ scope.row.mappedName }}</span>
+            <span :title="scope.row.mappedName">{{ scope.row.mappedName }}</span>
             <el-icon><Edit /></el-icon>
           </el-button>
         </template>
@@ -192,7 +193,7 @@ onMounted(() => {
   margin-left: 8px;
 }
 .area-edit-btn {
-  width: 120px;
+  width: 116px;
   padding: 0 4px;
   :deep(> span) {
     display: flex;