perf(views): 优化“识别协议”步骤的逻辑

src/api/index.ts

@@ -376,6 +376,9 @@ export const downloadUserProtocol = async (protocolType: string, protocolName: s
   return blob;
 };
 
+/**
+ * @deprecated
+ */
 export const getUploadProtocol = async (protocolType: string, protocolName: string) => {
   const data = await request<ProtocolBaseInfo>(
     apiBiz('/protocolBaseInfo/findUploadProtocolBaseInfo/', {

src/layout/UseGuidance.vue

@@ -34,6 +34,10 @@ const exportButtonShow = computed(() => {
   return props.steps[current.value].exportButtonShow;
 });
 
+const nextStepButtonShow = computed(() => {
+  return !props.steps[current.value].nextStepButtonHide;
+});
+
 const nextStepButtonText = computed(() => {
   return props.steps[current.value].nextStepButtonText || t('common.nextStep');
 });
@@ -58,6 +62,10 @@ const contentStyle = computed<CSSProperties>(() => {
   };
 });
 
+const goToStep = (index: number) => {
+  current.value = index;
+};
+
 const goNextStep = () => {
   current.value++;
 };
@@ -111,7 +119,14 @@ const finishCurrentStep = () => {
     <ALayout>
       <ALayoutContent class="use-guide-main" :style="contentStyle">
         <AForm ref="formRef" :model="form" :rules="rules" :layout="formLayout">
-          <component ref="stepItem" :is="currentComponent" :steps="steps" :step-index="current" :form="form" />
+          <component
+            ref="stepItem"
+            :is="currentComponent"
+            :form="form"
+            :steps="steps"
+            :step-index="current"
+            :go-to-step="goToStep"
+          />
         </AForm>
       </ALayoutContent>
       <ALayoutFooter class="use-guide-footer">
@@ -121,7 +136,12 @@ const finishCurrentStep = () => {
         </div>
         <div>
           <AButton v-if="exportButtonShow" @click="exportStepContent">{{ $t('common.exportToLocal') }}</AButton>
-          <AButton type="primary" :disabled="nextStepButtonDisabled" @click="finishCurrentStep">
+          <AButton
+            v-show="nextStepButtonShow"
+            type="primary"
+            :disabled="nextStepButtonDisabled"
+            @click="finishCurrentStep"
+          >
             {{ nextStepButtonText }}
           </AButton>
         </div>

src/types/index.ts

@@ -79,6 +79,7 @@ export interface UseGuideStepItem extends StepProps {
   formLayout?: 'horizontal' | 'vertical' | 'inline';
   isLastStep?: boolean;
   exportButtonShow?: boolean;
+  nextStepButtonHide?: boolean;
   nextStepButtonText?: string;
   nextStepButtonDisabled?: boolean;
 }
@@ -87,6 +88,7 @@ export interface UseGuideStepItemProps<T> {
   form: T;
   steps: UseGuideStepItem[];
   stepIndex: number;
+  goToStep: (index: number) => void;
 }
 
 export type UseGuideStepItemExpose = {

src/views/setup-protocol/SelectConfigMethod.vue

@@ -34,6 +34,7 @@ const finish = () => {
       {
         title: t('setupProtocol.waitingForRecognition'),
         component: shallowRef(WaitingRecognition),
+        nextStepButtonHide: true,
       },
       {
         title: t('setupProtocol.confirmResult'),

src/views/setup-protocol/WaitingRecognition.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
+import { message } from 'ant-design-vue';
 
-import { useRequest } from '@/hooks/request';
 import { uploadUserProtocol } from '@/api';
 import { waitTime } from '@/utils';
 
@@ -9,20 +9,25 @@ import type { SetupProtocolForm, UseGuideStepItemProps } from '@/types';
 
 const props = defineProps<UseGuideStepItemProps<SetupProtocolForm>>();
 
-const { handleRequest } = useRequest();
 const remainingSeconds = ref(90);
 const currentPercent = ref(0);
 
-onMounted(() => {
-  handleRequest(async () => {
+onMounted(async () => {
+  await waitTime(2000);
+  remainingSeconds.value = 0;
+  currentPercent.value = 100;
+
+  try {
     const { protocolType, protocolFile } = props.form;
     const file = protocolFile?.[0].originFileObj;
     const data = await uploadUserProtocol(protocolType as string, file as File);
     Object.assign(props.form.protocolInfo, data);
-
-    await waitTime(1000);
-    currentPercent.value = 100;
-  });
+    props.goToStep(props.stepIndex + 1);
+  } catch (err) {
+    props.goToStep(props.stepIndex - 1);
+    message.error((err as Error).message);
+    console.error(err);
+  }
 });
 </script>