perf(components): 优化 UseGuidance 组件，添加跳过确认

src/i18n/locales/zh.json

@@ -56,6 +56,8 @@
     "serialNumber": "序号",
     "settings": "设置",
     "skip": "跳过",
+    "skipConfirm": "跳过确认",
+    "skipStepConfirm": "是否跳过{name}？",
     "status": "状态",
     "success": "成功",
     "templateImport": "模板导入",

src/layout/UseGuidance.vue

@@ -2,6 +2,7 @@
 import { computed, ref, useTemplateRef } from 'vue';
 import { useRouter } from 'vue-router';
 
+import ConfirmModal from '@/components/ConfirmModal.vue';
 import SvgIcon from '@/components/SvgIcon.vue';
 import { t } from '@/i18n';
 import { addUnit } from '@/utils';
@@ -67,6 +68,16 @@ const goPrevStep = () => {
   current.value--;
 };
 
+const goOutOfUseGuide = () => {
+  router.replace('/first-usage');
+};
+
+const confirmModalRef = useTemplateRef('confirmModal');
+
+const skipCurrentStep = () => {
+  confirmModalRef.value?.showView();
+};
+
 const formRef = ref<FormInstance>();
 const stepRef = useTemplateRef<UseGuideStepItemInstance>('stepItem');
 
@@ -131,7 +142,7 @@ const finishCurrentStep = async () => {
       <ALayoutFooter class="use-guide-footer">
         <div class="use-guide-step-button-container">
           <div>
-            <AButton type="text" :disabled="currentStep.isLastStep" @click="goNextStep">
+            <AButton type="text" :disabled="currentStep.isLastStep" @click="skipCurrentStep">
               {{ $t('common.skip') }}
             </AButton>
             <AButton type="text" @click="goPrevStep">{{ $t('common.return') }}</AButton>
@@ -151,6 +162,14 @@ const finishCurrentStep = async () => {
               {{ currentStep.nextStepButtonText || t('common.nextStep') }}
             </AButton>
           </div>
+          <ConfirmModal
+            ref="confirmModal"
+            :title="$t('common.skipConfirm')"
+            :description-text="$t('common.skipStepConfirm', { name: currentStep.title })"
+            :icon="{ name: 'exclamation' }"
+            icon-bg-color="#F56C6C"
+            @confirm="goOutOfUseGuide"
+          />
         </div>
       </ALayoutFooter>
     </ALayout>