lw-cdp-ui 1.5.55 → 1.5.57

package/dist/components/lwAi/index.vue

@@ -19,7 +19,6 @@
 <script>
 import axios from 'axios';
 import { computed, getCurrentInstance, ref, watch } from 'vue';
-import { useRouter } from 'vue-router';
 import { FORM_DATA_GENERATION_RULES, SAFETY_RULES } from './doc/rules.js';
 
 export default {
@@ -46,7 +45,6 @@ export default {
     const {
       proxy: { $http, $expression, t, $tool, $bus }
     } = getCurrentInstance()
-    const router = useRouter()
     const visible = ref(false)
     const loading = ref(false)
     const inputValue = ref('')

package/dist/components/lwTour/index.vue

@@ -5,13 +5,13 @@
       :key="index"
       :target="step.target"
       :title="step.title"
-      :description="step.description" />
+      :description="step.description"
+      @change="changeStep" />
   </el-tour>
 </template>
 
 <script>
-import { ref, getCurrentInstance, onMounted, nextTick, onUnmounted } from 'vue'
-import { useRouter } from 'vue-router'
+import { getCurrentInstance, nextTick, onMounted, onUnmounted, ref } from 'vue'
 
 export default {
   name: 'LwTour',
@@ -33,13 +33,17 @@ export default {
     currentStep: {
       type: Number,
       default: 0
+    },
+    // 路由路径，用于记录用户是否已完成引导
+    routePath: {
+      type: String,
+      default: ''
     }
   },
   setup(props, { emit }) {
     const {
       proxy: { $api, $expression, t, $tool, $bus }
     } = getCurrentInstance()
-    const router = useRouter()
     $bus.$on(`lwTourChange`, () => {
       startTour()
     })
@@ -53,26 +57,6 @@ export default {
 
     // 开始引导
     const startTour = () => {
-      // 如果 router 未初始化，延迟执行
-      if (!router) {
-        setTimeout(() => {
-          startTour()
-        }, 100)
-        return
-      }
-
-      const allElementsExist = props.steps.every((step) => {
-        return document.querySelector(step.css)
-      })
-
-      if (!allElementsExist) {
-        console.warn('元素未加载完成')
-        setTimeout(() => {
-          startTour()
-        }, 100)
-        return
-      }
-
       formattedSteps.value = props.steps.map((step) => {
         const targetElement = document.querySelector(step.css)
         return {
@@ -84,22 +68,20 @@ export default {
       })
       isOpen.value = true
 
-      let LwTour = $tool.data.get('LwTour') || {}
-      const currentRoute = router?.currentRoute?.value
-      if (currentRoute) {
-        const { path, meta } = currentRoute
-        LwTour[`${meta?.title || ''}${path}`] = true
+      // 使用传入的路由路径
+      if (props.routePath) {
+        let LwTour = $tool.data.get('LwTour') || {}
+        LwTour[props.routePath] = true
         $tool.data.set('LwTour', LwTour)
       }
     }
 
     // 组件挂载后自动开始引导
     onMounted(() => {
-      let LwTour = $tool.data.get('LwTour') || {}
-      const currentRoute = router?.currentRoute?.value
-      if (currentRoute) {
-        const { path, meta } = currentRoute
-        if (!LwTour[`${meta?.title || ''}${path}`]) {
+      // 使用传入的路由路径
+      if (props.routePath) {
+        let LwTour = $tool.data.get('LwTour') || {}
+        if (!LwTour[props.routePath]) {
           nextTick(() => {
             startTour()
           })
@@ -108,10 +90,25 @@ export default {
       $bus.$emit(`lwTourOpen`, true)
     })
 
+    // 步骤变化时
+    const changeStep = (step) => {
+      emit('change', step)
+      formattedSteps.value = props.steps.map((step) => {
+        const targetElement = document.querySelector(step.css)
+        return {
+          target: targetElement || undefined,
+          title: step.title,
+          description: step.description,
+          placement: 'bottom'
+        }
+      })
+    }
+
     return {
       formattedSteps,
       isOpen,
-      startTour
+      startTour,
+      changeStep
     }
   }
 }