fix: 修改本地存储变量名

src/views/chart/components/HeaderLeftBtn/index.vue

@@ -24,47 +24,38 @@
 </template>
 
 <script setup lang="ts">
-import { reactive, watchEffect, ref } from 'vue'
+import { toRefs, reactive } from 'vue'
 import { renderIcon } from '@/utils'
 import { icon } from '@/plugins'
 const { LayersIcon, BarChartIcon, PrismIcon } = icon.ionicons5
 import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
 
-const chartLayoutStore = useChartLayoutStore()
+const { setItem } = useChartLayoutStore()
+const { getLayers, getCharts, getDetails } = toRefs(useChartLayoutStore())
 
-const init = (layers: boolean, charts: boolean, details: boolean) => [
+const btnList = reactive([
   {
     key: 'layers',
-    select: chartLayoutStore.getLayers,
+    select: getLayers,
     title: '图层控制',
     icon: renderIcon(LayersIcon)
   },
   {
     key: 'charts',
-    select: chartLayoutStore.getCharts,
+    select: getCharts,
     title: '图表组件',
     icon: renderIcon(BarChartIcon)
   },
   {
     key: 'details',
-    select: chartLayoutStore.getDetails,
+    select: getDetails,
     title: '详情设置',
     icon: renderIcon(PrismIcon)
   }
-]
-
-const btnList = ref()
-
-watchEffect(() => {
-  btnList.value = init(
-    chartLayoutStore.getLayers,
-    chartLayoutStore.getCharts,
-    chartLayoutStore.getDetails
-  )
-})
+])
 
 const clickHandle = (item: { [T: string]: string }) => {
-  chartLayoutStore.setItem(item.key, !item.select)
+  setItem(item.key, !item.select)
 }
 </script>
 <style lang="scss" scoped>

src/views/project/items/components/List/index.vue

@@ -17,7 +17,7 @@
     </n-grid>
   </div>
   <ModalCard
-    v-model:show="modalShow"
+    v-model:modalShow="modalShow"
     :cardData="modalData"
     @close="closeModal"
     @edit="editHandle"
@@ -25,7 +25,6 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
 import { Card } from '../Card/index'
 import { ModalCard } from '../ModalCard/index'
 import { icon } from '@/plugins'

src/views/project/items/components/ModalCard/index.vue

@@ -2,8 +2,8 @@
   <!-- mask-closable 暂时是失效的，不知道为啥 -->
   <n-modal
     class="go-modal-box"
-    v-model:show="show"
-    @on-after-leave="closeHandle"
+    v-model:show="modalShow"
+    @afterLeave="closeHandle"
   >
     <n-card hoverable size="small">
       <div class="list-content">
@@ -75,7 +75,7 @@
 </template>
 
 <script setup lang="ts">
-import { watchEffect, reactive } from 'vue'
+import { reactive } from 'vue'
 import { renderIcon, renderLang, requireUrl } from '@/utils'
 import { icon } from '@/plugins'
 import { AppleControlBtn } from '@/components/AppleControlBtn'
@@ -84,20 +84,11 @@ const { HammerIcon } = icon.ionicons5
 
 const emit = defineEmits(['close', 'edit'])
 
-const t = window['$t']
-
 const props = defineProps({
-  show: Boolean,
+  modalShow: Boolean,
   cardData: Object
 })
 
-// 解决点击模态层不会触发 @on-after-leave 的问题
-watchEffect(() => {
-  if (!props.show && props.cardData) {
-    closeHandle()
-  }
-})
-
 const fnBtnList = reactive([
   {
     label: renderLang('global.r_edit'),