lw-cdp-ui 1.4.40 → 1.4.41

package/dist/components/lwBiChart/item.vue

@@ -2,22 +2,24 @@
   <component v-if="isShow" :is="chartComponent" :rawData="rawData" :height="height" :isBi="isBi" />
 </template>
 
-<script>
+<script setup>
+import { computed, provide } from 'vue'
 import * as echarts from 'echarts'
 
-import BarChart from './charts/BarChart.vue' // 柱状图
-import LineChart from './charts/LineChart.vue' // 折线图
-import PieChart from './charts/PieChart.vue' // 饼图
-import AreaChart from './charts/AreaChart.vue' // 面积图
-import MetricCard from './charts/MetricCard.vue' // 指标卡
-import GaugeChart from './charts/GaugeChart.vue' // 仪表盘
-import FunnelChart from './charts/FunnelChart.vue' // 漏斗图
-import ScatterChart from './charts/ScatterChart.vue' // 散点图
-import RadarChart from './charts/RadarChart.vue' // 雷达图
-import MapChart from './charts/MapChart.vue' // 地图
-import ReportTable from './charts/ReportTable.vue' // 报表
-import ChartTitle from './charts/ChartTitle.vue' // 标题
+import BarChart from './charts/BarChart.vue'
+import LineChart from './charts/LineChart.vue'
+import PieChart from './charts/PieChart.vue'
+import AreaChart from './charts/AreaChart.vue'
+import MetricCard from './charts/MetricCard.vue'
+import GaugeChart from './charts/GaugeChart.vue'
+import FunnelChart from './charts/FunnelChart.vue'
+import ScatterChart from './charts/ScatterChart.vue'
+import RadarChart from './charts/RadarChart.vue'
+import MapChart from './charts/MapChart.vue'
+import ReportTable from './charts/ReportTable.vue'
+import ChartTitle from './charts/ChartTitle.vue'
 
+// 组件映射表
 const componentMap = {
   Bar: BarChart,
   Line: LineChart,
@@ -33,50 +35,43 @@ const componentMap = {
   ChartTitle: ChartTitle
 }
 
-export default {
-  name: 'lwBiChartItem',
-  components: {
-    BarChart,
-    LineChart,
-    PieChart,
-    AreaChart,
-    MetricCard,
-    GaugeChart,
-    FunnelChart,
-    ScatterChart,
-    RadarChart,
-    MapChart,
-    ReportTable,
-    ChartTitle
+// Props 定义
+const props = defineProps({
+  rawData: {
+    type: Object,
+    default: () => null
   },
-  provide() {
-    return { echarts }
+  height: {
+    type: String,
+    default: '300px'
   },
-  props: {
-    rawData: {
-      type: Object,
-      default: null
-    },
-    height: {
-      type: String,
-      default: '300px'
-    },
-    // 是否是BI数据结构 默认是true , false为普通EChart数据结构
-    isBi: {
-      type: Boolean,
-      default: true
-    }
-  },
-  computed: {
-    isShow() {
-      return this.rawData && ((this.rawData?.setting && this.rawData?.dataSet) || this.rawData?.option)
-    },
-    chartType() {
-      return this.rawData?.type || 'Bar'
-    },
-    chartComponent() {
-      return componentMap[this.chartType] || BarChart
-    }
-  },
-}
+  isBi: {
+    type: Boolean,
+    default: true
+  }
+})
+
+// 确保 echarts 实例只被创建一次
+const echartsInstance = (() => {
+  if (!echarts._vue_echarts_instance) {
+    echarts._vue_echarts_instance = echarts
+  }
+  return echarts._vue_echarts_instance
+})()
+
+// 提供 echarts 实例给子组件
+provide('echarts', echartsInstance)
+
+// 计算属性
+const isShow = computed(() => {
+  return props.rawData && ((props.rawData?.setting && props.rawData?.dataSet) || props.rawData?.option)
+})
+
+const chartType = computed(() => {
+  return props.rawData?.type || 'Bar'
+})
+
+const chartComponent = computed(() => {
+  return componentMap[chartType.value] || BarChart
+})
 </script>

package/dist/components/lwTour/index.vue

@@ -1,101 +1,101 @@
-<template>
-  <el-tour v-model="isOpen" :current="currentStep">
-    <el-tour-step v-for="(step, index) in formattedSteps" :key="index" :target="step.target" :title="step.title"
-      :description="step.description" />
-  </el-tour>
-</template>
-
-<script>
-import { ref, getCurrentInstance, onMounted, nextTick, onUnmounted } from 'vue'
-import { useRouter } from 'vue-router'
-
-export default {
-  name: 'LwTour',
-  props: {
-    steps: {
-      type: Array,
-      required: true,
-      validator: (value) => {
-        return value.every(step => {
-          return step.css && step.title && step.description
-        })
-      }
-    },
-    // 是否在组件挂载后自动开始引导
-    autoStart: {
-      type: Boolean,
-      default: false
-    },
-    currentStep: {
-      type: Number,
-      default: 0
-    }
-  },
-  setup(props, { emit }) {
-    const {
-      proxy: { $api, $expression, t, $tool, $bus }
-    } = getCurrentInstance()
-    const router = useRouter()
-    $bus.$on(`lwTourChange`, () => {
-      startTour()
-    })
-
-    onUnmounted(() => {
-      $bus.$emit(`lwTourOpen`, false)
-    })
-
-    const isOpen = ref(false)
-    const formattedSteps = ref([])
-
-    // 开始引导
-    const startTour = () => {
-      const allElementsExist = props.steps.every(step => {
-        return document.querySelector(step.css)
-      })
-
-      if (!allElementsExist) {
-        console.warn('元素未加载完成')
-        startTour()
-        return
-      }
-
-      formattedSteps.value = props.steps.map(step => {
-        const targetElement = document.querySelector(step.css)
-        return {
-          target: targetElement || undefined,
-          title: step.title,
-          description: step.description,
-          // 可以添加更多el-tour支持的配置项
-          placement: 'bottom'
-        }
-      })
-      isOpen.value = true
-
-      let LwTour = $tool.data.get('LwTour') || {}
-      let { path, meta } = router.currentRoute.value
-      LwTour[`${meta.title}${path}`] = true
-      $tool.data.set('LwTour', LwTour)
-    }
-
-
-
-    // 组件挂载后自动开始引导
-    onMounted(() => {
-      let LwTour = $tool.data.get('LwTour') || {}
-      let { path, meta } = router.currentRoute.value
-      if (props.autoStart && !LwTour[`${meta.title}${path}`]) {
-        nextTick(() => {
-          startTour()
-        })
-      }
-      $bus.$emit(`lwTourOpen`, true)
-    })
-
-    return {
-      formattedSteps,
-      isOpen,
-      startTour
-    }
-  }
-}
-</script>
+<template>
+  <el-tour v-model="isOpen" :current="currentStep">
+    <el-tour-step v-for="(step, index) in formattedSteps" :key="index" :target="step.target" :title="step.title"
+      :description="step.description" />
+  </el-tour>
+</template>
+
+<script>
+import { ref, getCurrentInstance, onMounted, nextTick, onUnmounted } from 'vue'
+import { useRouter } from 'vue-router'
+
+export default {
+  name: 'LwTour',
+  props: {
+    steps: {
+      type: Array,
+      required: true,
+      validator: (value) => {
+        return value.every(step => {
+          return step.css && step.title && step.description
+        })
+      }
+    },
+    // 是否在组件挂载后自动开始引导
+    autoStart: {
+      type: Boolean,
+      default: false
+    },
+    currentStep: {
+      type: Number,
+      default: 0
+    }
+  },
+  setup(props, { emit }) {
+    const {
+      proxy: { $api, $expression, t, $tool, $bus }
+    } = getCurrentInstance()
+    const router = useRouter()
+    $bus.$on(`lwTourChange`, () => {
+      startTour()
+    })
+
+    onUnmounted(() => {
+      $bus.$emit(`lwTourOpen`, false)
+    })
+
+    const isOpen = ref(false)
+    const formattedSteps = ref([])
+
+    // 开始引导
+    const startTour = () => {
+      const allElementsExist = props.steps.every(step => {
+        return document.querySelector(step.css)
+      })
+
+      if (!allElementsExist) {
+        console.warn('元素未加载完成')
+        startTour()
+        return
+      }
+
+      formattedSteps.value = props.steps.map(step => {
+        const targetElement = document.querySelector(step.css)
+        return {
+          target: targetElement || undefined,
+          title: step.title,
+          description: step.description,
+          // 可以添加更多el-tour支持的配置项
+          placement: 'bottom'
+        }
+      })
+      isOpen.value = true
+
+      let LwTour = $tool.data.get('LwTour') || {}
+      let { path, meta } = router.currentRoute.value
+      LwTour[`${meta.title}${path}`] = true
+      $tool.data.set('LwTour', LwTour)
+    }
+
+
+
+    // 组件挂载后自动开始引导
+    onMounted(() => {
+      let LwTour = $tool.data.get('LwTour') || {}
+      let { path, meta } = router.currentRoute.value
+      if (props.autoStart && !LwTour[`${meta.title}${path}`]) {
+        nextTick(() => {
+          startTour()
+        })
+      }
+      $bus.$emit(`lwTourOpen`, true)
+    })
+
+    return {
+      formattedSteps,
+      isOpen,
+      startTour
+    }
+  }
+}
+</script>