From e15930c08bbc843a83b1a6a6deae78b1a96dd838 Mon Sep 17 00:00:00 2001
From: song-tianyang <tianyang.song@fit2cloud.com>
Date: Wed, 11 Jan 2023 15:21:23 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):=20?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=B7=B3=E8=BD=AC=E5=88=B0=E6=8E=A5=E5=8F=A3?=
 =?UTF-8?q?=E6=B5=8B=E8=AF=95=E5=92=8C=E6=8E=A5=E5=8F=A3=E5=9C=BA=E6=99=AF?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E7=9A=84=E7=9B=B8=E5=85=B3=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复跳转到接口测试和接口场景页面的相关问题
---
 .../src/business/automation/ApiAutomation.vue |   5 +-
 .../component/ApiScenarioComponent.vue        |   1 +
 .../scenario/component/LoopController.vue     |   7 +-
 .../scenario/component/StepExtendBtns.vue     |   1 +
 .../components/list/ApiDeleteConfirm.vue      |   2 +
 .../components/reference/ShowReference.vue    |   1 +
 .../functional/FunctionalTestCaseEdit.vue     | 476 +++++++++++-------
 .../components/TestReviewTestCaseEdit.vue     | 427 +++++++++-------
 .../src/business/module/api/ReferenceView.vue | 208 ++++----
 9 files changed, 677 insertions(+), 451 deletions(-)

diff --git a/api-test/frontend/src/business/automation/ApiAutomation.vue b/api-test/frontend/src/business/automation/ApiAutomation.vue
index 81fd357556..f94be4d6e3 100644
--- a/api-test/frontend/src/business/automation/ApiAutomation.vue
+++ b/api-test/frontend/src/business/automation/ApiAutomation.vue
@@ -372,10 +372,10 @@ export default {
       }
     },
     _getCurrentUserId() {
-      const {id, userGroups} = getCurrentUser();
+      const { id, userGroups } = getCurrentUser();
       if (userGroups) {
         // 是否是当前项目下的成员
-        let index = userGroups.findIndex(ug => ug.sourceId === getCurrentProjectID());
+        let index = userGroups.findIndex((ug) => ug.sourceId === getCurrentProjectID());
         if (index !== -1) {
           return id;
         }
@@ -786,6 +786,7 @@ export default {
       let automationData = this.$router.resolve({
         name: 'ApiAutomationWithQuery',
         params: {
+          versionId: 'default',
           redirectID: getUUID(),
           dataType: 'scenario',
           dataSelectRange: 'edit:' + resource.id,
diff --git a/api-test/frontend/src/business/automation/scenario/component/ApiScenarioComponent.vue b/api-test/frontend/src/business/automation/scenario/component/ApiScenarioComponent.vue
index 6354db91b0..3692692678 100644
--- a/api-test/frontend/src/business/automation/scenario/component/ApiScenarioComponent.vue
+++ b/api-test/frontend/src/business/automation/scenario/component/ApiScenarioComponent.vue
@@ -355,6 +355,7 @@ export default {
       let automationData = this.$router.resolve({
         name: 'ApiAutomationWithQuery',
         params: {
+          versionId: 'default',
           redirectID: getUUID(),
           dataType: 'scenario',
           dataSelectRange: 'edit:' + resource.id,
diff --git a/api-test/frontend/src/business/automation/scenario/component/LoopController.vue b/api-test/frontend/src/business/automation/scenario/component/LoopController.vue
index 2915c2a5c0..baff3dc6be 100644
--- a/api-test/frontend/src/business/automation/scenario/component/LoopController.vue
+++ b/api-test/frontend/src/business/automation/scenario/component/LoopController.vue
@@ -84,7 +84,7 @@
               v-model="controller.countController.interval"
               :disabled="controller.disabled"
               :placeholder="$t('commons.millisecond')"
-              :max="1000 * 10000000"
+              :max="1000 * 1000000"
               :min="0"
               :step="1000"
               size="small" />
@@ -129,7 +129,7 @@
               :disabled="controller.disabled"
               size="small"
               :placeholder="$t('commons.millisecond')"
-              :max="1000 * 10000000"
+              :max="1000 * 1000000"
               :min="0"
               :step="1000" />
             <span class="ms-span ms-radio">ms</span>
@@ -165,12 +165,11 @@
           :disabled="controller.disabled"
           size="small"
           :placeholder="$t('commons.millisecond')"
-          :max="1000 * 10000000"
+          :max="1000 * 1000000"
           :min="3000"
           :step="1000" />
         <span class="ms-span ms-radio">ms</span>
       </div>
-
       <template v-slot:debugStepCode>
         <span v-if="node.data.testing" class="ms-test-running">
           <i class="el-icon-loading" style="font-size: 16px" />
diff --git a/api-test/frontend/src/business/automation/scenario/component/StepExtendBtns.vue b/api-test/frontend/src/business/automation/scenario/component/StepExtendBtns.vue
index e0a7a00bfd..bebcd54164 100644
--- a/api-test/frontend/src/business/automation/scenario/component/StepExtendBtns.vue
+++ b/api-test/frontend/src/business/automation/scenario/component/StepExtendBtns.vue
@@ -162,6 +162,7 @@ export default {
             let automationData = this.$router.resolve({
               name: 'ApiAutomationWithQuery',
               params: {
+                versionId: 'default',
                 redirectID: getUUID(),
                 dataType: 'scenario',
                 dataSelectRange: 'edit:' + response.data.id,
diff --git a/api-test/frontend/src/business/definition/components/list/ApiDeleteConfirm.vue b/api-test/frontend/src/business/definition/components/list/ApiDeleteConfirm.vue
index 5f39f9690c..548e110b30 100644
--- a/api-test/frontend/src/business/definition/components/list/ApiDeleteConfirm.vue
+++ b/api-test/frontend/src/business/definition/components/list/ApiDeleteConfirm.vue
@@ -73,6 +73,7 @@ export default {
           home = this.$router.resolve({
             name: 'ApiDefinitionWithQuery',
             params: {
+              versionId: 'default',
               redirectID: uuid,
               dataType: dataType,
               dataSelectRange: selectRange,
@@ -84,6 +85,7 @@ export default {
           home = this.$router.resolve({
             name: 'ApiAutomationWithQuery',
             params: {
+              versionId: 'default',
               redirectID: uuid,
               dataType: dataType,
               dataSelectRange: selectRange,
diff --git a/api-test/frontend/src/business/definition/components/reference/ShowReference.vue b/api-test/frontend/src/business/definition/components/reference/ShowReference.vue
index 5f703699f1..6ccc0b3afb 100644
--- a/api-test/frontend/src/business/definition/components/reference/ShowReference.vue
+++ b/api-test/frontend/src/business/definition/components/reference/ShowReference.vue
@@ -246,6 +246,7 @@ export default {
       let automationData = this.$router.resolve({
         name: 'ApiAutomationWithQuery',
         params: {
+          versionId: 'default',
           redirectID: getUUID(),
           dataType: 'scenario',
           dataSelectRange: 'edit:' + resource.id,
diff --git a/test-track/frontend/src/business/plan/view/comonents/functional/FunctionalTestCaseEdit.vue b/test-track/frontend/src/business/plan/view/comonents/functional/FunctionalTestCaseEdit.vue
index a1b41010f5..a6d2381dda 100644
--- a/test-track/frontend/src/business/plan/view/comonents/functional/FunctionalTestCaseEdit.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/functional/FunctionalTestCaseEdit.vue
@@ -6,8 +6,8 @@
     :modal-append-to-body="false"
     size="100%"
     ref="drawer"
-    v-loading="loading">
-
+    v-loading="loading"
+  >
     <template>
       <el-row>
         <el-col :span="17">
@@ -16,11 +16,13 @@
               <el-scrollbar>
                 <el-header>
                   <el-row type="flex" class="head-bar">
-
                     <el-col :span="4">
-                      <el-button plain size="mini"
-                                 icon="el-icon-back"
-                                 @click="cancel">{{ $t('test_track.return') }}
+                      <el-button
+                        plain
+                        size="mini"
+                        icon="el-icon-back"
+                        @click="cancel"
+                        >{{ $t("test_track.return") }}
                       </el-button>
                     </el-col>
 
@@ -35,9 +37,9 @@
                         :pre-page-data="prePageData"
                         @pre="handlePre"
                         @next="handleNext"
-                        :list="testCases"/>
+                        :list="testCases"
+                      />
                     </el-col>
-
                   </el-row>
 
                   <el-row class="head-bar">
@@ -47,82 +49,144 @@
                           class="test-case-name"
                           type="text"
                           :disabled="!hasProjectPermission"
-                          @click="openTestTestCase(testCase)">
-                            <span
-                              class="title-link"
-                              :title="testCase.name"
-                              :style="{'max-width': titleWith + 'px'}">
-                              {{ testCase.customNum }}-{{ testCase.name }}
-                            </span>
+                          @click="openTestTestCase(testCase)"
+                        >
+                          <span
+                            class="title-link"
+                            :title="testCase.name"
+                            :style="{ 'max-width': titleWith + 'px' }"
+                          >
+                            {{ testCase.customNum }}-{{ testCase.name }}
+                          </span>
                         </el-button>
                       </el-divider>
                     </el-col>
                   </el-row>
                 </el-header>
                 <div class="case_container">
-
                   <el-form :model="testCase">
-
                     <el-row>
                       <el-col :span="7">
-                        <el-form-item :label="$t('test_track.case.module')" prop="nodePath"
-                                      :label-width="formLabelWidth">
+                        <el-form-item
+                          :label="$t('test_track.case.module')"
+                          prop="nodePath"
+                          :label-width="formLabelWidth"
+                        >
                           {{ testCase.nodePath }}
                         </el-form-item>
                       </el-col>
                       <el-col :span="7">
-                        <el-form-item :label="$t('test_track.plan.plan_project')" prop="projectName"
-                                      :label-width="formLabelWidth">
+                        <el-form-item
+                          :label="$t('test_track.plan.plan_project')"
+                          prop="projectName"
+                          :label-width="formLabelWidth"
+                        >
                           {{ testCase.projectName }}
                         </el-form-item>
                       </el-col>
                       <el-col :span="10">
-                        <el-form-item :label="$t('test_track.plan.load_case.execution_status')"
-                                      :label-width="formLabelWidth">
-                          <status-table-item :value="originalStatus"/>
+                        <el-form-item
+                          :label="
+                            $t('test_track.plan.load_case.execution_status')
+                          "
+                          :label-width="formLabelWidth"
+                        >
+                          <status-table-item :value="originalStatus" />
                         </el-form-item>
                       </el-col>
                     </el-row>
 
-                    <el-form ref="customFieldForm"
-                             v-if="isCustomFiledActive"
-                             class="case-form">
+                    <el-form
+                      ref="customFieldForm"
+                      v-if="isCustomFiledActive"
+                      class="case-form"
+                    >
                       <el-row>
-                        <el-col :span="7" v-for="(item, index) in testCaseTemplate.customFields" :key="index">
-                          <el-form-item :label-width="formLabelWidth"
-                                        :label="item.system ? $t(systemNameMap[item.name]) : item.name"
-                                        :prop="item.name">
-                            <custom-filed-component :disabled="true" :data="item" :form="{}" prop="defaultValue"/>
+                        <el-col
+                          :span="7"
+                          v-for="(item, index) in testCaseTemplate.customFields"
+                          :key="index"
+                        >
+                          <el-form-item
+                            :label-width="formLabelWidth"
+                            :label="
+                              item.system
+                                ? $t(systemNameMap[item.name])
+                                : item.name
+                            "
+                            :prop="item.name"
+                          >
+                            <custom-filed-component
+                              :disabled="true"
+                              :data="item"
+                              :form="{}"
+                              prop="defaultValue"
+                            />
                           </el-form-item>
                         </el-col>
                       </el-row>
                     </el-form>
 
-                    <form-rich-text-item :label-width="formLabelWidth" :disabled="true"
-                                         :title="$t('test_track.case.prerequisite')" :data="testCase"
-                                         prop="prerequisite"/>
-                    <step-change-item :disable="true" :label-width="formLabelWidth" :form="testCase"/>
-                    <test-plan-case-step-results-item :label-width="formLabelWidth" :is-read-only="isReadOnly"
-                                                      v-if="testCase.stepModel === 'STEP'" :test-case="testCase"/>
-                    <form-rich-text-item :label-width="formLabelWidth" v-if="testCase.stepModel === 'TEXT'"
-                                         :disabled="true" :title="$t('test_track.case.step_desc')" :data="testCase"
-                                         prop="stepDescription"/>
-                    <form-rich-text-item :label-width="formLabelWidth" v-if="testCase.stepModel === 'TEXT'"
-                                         :disabled="true" :title="$t('test_track.case.expected_results')"
-                                         :data="testCase" prop="expectedResult"/>
-                    <form-rich-text-item :label-width="formLabelWidth" v-if="testCase.stepModel === 'TEXT'"
-                                         :title="$t('test_track.plan_view.actual_result')"
-                                         :data="testCase" prop="actualResult"/>
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      :disabled="true"
+                      :title="$t('test_track.case.prerequisite')"
+                      :data="testCase"
+                      prop="prerequisite"
+                    />
+                    <step-change-item
+                      :disable="true"
+                      :label-width="formLabelWidth"
+                      :form="testCase"
+                    />
+                    <test-plan-case-step-results-item
+                      :label-width="formLabelWidth"
+                      :is-read-only="isReadOnly"
+                      v-if="testCase.stepModel === 'STEP'"
+                      :test-case="testCase"
+                    />
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      v-if="testCase.stepModel === 'TEXT'"
+                      :disabled="true"
+                      :title="$t('test_track.case.step_desc')"
+                      :data="testCase"
+                      prop="stepDescription"
+                    />
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      v-if="testCase.stepModel === 'TEXT'"
+                      :disabled="true"
+                      :title="$t('test_track.case.expected_results')"
+                      :data="testCase"
+                      prop="expectedResult"
+                    />
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      v-if="testCase.stepModel === 'TEXT'"
+                      :title="$t('test_track.plan_view.actual_result')"
+                      :data="testCase"
+                      prop="actualResult"
+                    />
 
-
-                    <el-form-item :label="$t('test_track.case.other_info')" :label-width="formLabelWidth">
-                      <test-case-edit-other-info :plan-id="testCase.planId" v-if="otherInfoActive" @openTest="openTest"
-                                                 :is-test-plan-edit="true"
-                                                 @syncRelationGraphOpen="syncRelationGraphOpen"
-                                                 :read-only="true" :is-test-plan="true" :project-id="testCase.projectId"
-                                                 :form="testCase" :case-id="testCase.caseId" ref="otherInfo"/>
+                    <el-form-item
+                      :label="$t('test_track.case.other_info')"
+                      :label-width="formLabelWidth"
+                    >
+                      <test-case-edit-other-info
+                        :plan-id="testCase.planId"
+                        v-if="otherInfoActive"
+                        @openTest="openTest"
+                        :is-test-plan-edit="true"
+                        @syncRelationGraphOpen="syncRelationGraphOpen"
+                        :read-only="true"
+                        :is-test-plan="true"
+                        :project-id="testCase.projectId"
+                        :form="testCase"
+                        :case-id="testCase.caseId"
+                        ref="otherInfo"
+                      />
                     </el-form-item>
-
                   </el-form>
                 </div>
               </el-scrollbar>
@@ -135,11 +199,13 @@
               :test-case="testCase"
               :is-read-only="isReadOnly"
               :origin-status="originalStatus"
-              @saveCase="saveCase"/>
+              @saveCase="saveCase"
+            />
             <review-comment
               default-type="PLAN"
               :case-id="testCase.caseId"
-              ref="comment"/>
+              ref="comment"
+            />
           </div>
         </el-col>
       </el-row>
@@ -148,30 +214,40 @@
 </template>
 
 <script>
-import TestPlanTestCaseStatusButton from '../../../common/TestPlanTestCaseStatusButton';
-import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
-import {getUUID, listenGoBack, removeGoBackListener} from "metersphere-frontend/src/utils"
-import {hasPermission} from "metersphere-frontend/src/utils/permission";
+import TestPlanTestCaseStatusButton from "../../../common/TestPlanTestCaseStatusButton";
+import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
+import {
+  getUUID,
+  listenGoBack,
+  removeGoBackListener,
+} from "metersphere-frontend/src/utils";
+import { hasPermission } from "metersphere-frontend/src/utils/permission";
 import TestCaseAttachment from "@/business/case/components/TestCaseAttachment";
 import CaseComment from "@/business/case/components/CaseComment";
 import MsPreviousNextButton from "metersphere-frontend/src/components/MsPreviousNextButton";
 import ReviewComment from "@/business/review/commom/ReviewComment";
-import {buildTestCaseOldFields, parseCustomField} from "metersphere-frontend/src/utils/custom_field";
+import {
+  buildTestCaseOldFields,
+  parseCustomField,
+} from "metersphere-frontend/src/utils/custom_field";
 import FormRichTextItem from "metersphere-frontend/src/components/FormRichTextItem";
 import MsFormDivider from "metersphere-frontend/src/components/MsFormDivider";
 import TestCaseEditOtherInfo from "@/business/case/components/TestCaseEditOtherInfo";
 import CustomFiledComponent from "metersphere-frontend/src/components/template/CustomFiledComponent";
-import {SYSTEM_FIELD_NAME_MAP} from "metersphere-frontend/src/utils/table-constants";
+import { SYSTEM_FIELD_NAME_MAP } from "metersphere-frontend/src/utils/table-constants";
 import IssueDescriptionTableItem from "@/business/issue/IssueDescriptionTableItem";
 import StepChangeItem from "@/business/case/components/StepChangeItem";
 import TestCaseStepItem from "@/business/case/components/TestCaseStepItem";
 import TestPlanCaseStepResultsItem from "@/business/plan/view/comonents/functional/TestPlanCaseStepResultsItem";
 import TestPlanFunctionalExecute from "@/business/plan/view/comonents/functional/TestPlanFunctionalExecute";
 import StatusTableItem from "@/business/common/tableItems/planview/StatusTableItem";
-import {testPlanTestCaseEdit, testPlanTestCaseGet} from "@/api/remote/plan/test-plan-test-case";
-import {testPlanEditStatus} from "@/api/remote/plan/test-plan";
-import {getTestTemplate} from "@/api/custom-field-template";
-import {checkProjectPermission} from "@/api/testCase";
+import {
+  testPlanTestCaseEdit,
+  testPlanTestCaseGet,
+} from "@/api/remote/plan/test-plan-test-case";
+import { testPlanEditStatus } from "@/api/remote/plan/test-plan";
+import { getTestTemplate } from "@/api/custom-field-template";
+import { checkProjectPermission } from "@/api/testCase";
 
 export default {
   name: "FunctionalTestCaseEdit",
@@ -190,7 +266,7 @@ export default {
     MsPreviousNextButton,
     CaseComment,
     TestPlanTestCaseStatusButton,
-    TestCaseAttachment
+    TestCaseAttachment,
   },
   data() {
     return {
@@ -201,34 +277,34 @@ export default {
       index: 0,
       editor: ClassicEditor,
       test: {},
-      activeTab: 'detail',
+      activeTab: "detail",
       users: [],
       tableData: [],
       comments: [],
       testCaseTemplate: {},
-      formLabelWidth: '100px',
+      formLabelWidth: "100px",
       isCustomFiledActive: false,
       otherInfoActive: true,
       isReadOnly: false,
       testCases: [],
-      originalStatus: '',
-      titleWith: 0
+      originalStatus: "",
+      titleWith: 0,
     };
   },
   props: {
     total: {
-      type: Number
+      type: Number,
     },
     searchParam: {
-      type: Object
+      type: Object,
     },
     pageNum: Number,
     pageSize: {
       type: Number,
-      default: 1
+      default: 1,
     },
     nextPageData: Object,
-    prePageData: Object
+    prePageData: Object,
   },
   computed: {
     systemNameMap() {
@@ -243,18 +319,18 @@ export default {
       removeGoBackListener(this.handleClose);
       this.showDialog = false;
       this.searchParam.status = null;
-      this.$emit('update:search-param', this.searchParam);
+      this.$emit("update:search-param", this.searchParam);
     },
     cancel() {
       this.handleClose();
-      this.$emit('refreshTable');
+      this.$emit("refreshTable");
     },
     getOption(param) {
       let formData = new FormData();
-      let url = '/test/case/edit/testPlan';
+      let url = "/test/case/edit/testPlan";
 
       if (this.$refs.otherInfo && this.$refs.otherInfo.uploadList) {
-        this.$refs.otherInfo.uploadList.forEach(f => {
+        this.$refs.otherInfo.uploadList.forEach((f) => {
           formData.append("file", f);
         });
       }
@@ -271,17 +347,20 @@ export default {
         return key === "file" ? undefined : value;
       });
 
-      formData.append('request', new Blob([requestJson], {
-        type: "application/json "
-      }));
+      formData.append(
+        "request",
+        new Blob([requestJson], {
+          type: "application/json ",
+        })
+      );
 
       return {
-        method: 'POST',
+        method: "POST",
         url: url,
         data: formData,
         headers: {
-          'Content-Type': undefined
-        }
+          "Content-Type": undefined,
+        },
       };
     },
     saveCase() {
@@ -302,12 +381,18 @@ export default {
         result.actualResult = this.testCase.steptResults[i].actualResult;
         result.executeResult = this.testCase.steptResults[i].executeResult;
         if (result.actualResult && result.actualResult.length > 500) {
-          this.$warning(this.$t('test_track.plan_view.actual_result')
-            + this.$t('test_track.length_less_than') + '500');
+          this.$warning(
+            this.$t("test_track.plan_view.actual_result") +
+              this.$t("test_track.length_less_than") +
+              "500"
+          );
           return;
         }
-        if (result.executeResult === 'Failure' && this.testCase.status === 'Pass') {
-          this.$warning(this.$t('test_track.plan_view.execute_tip'));
+        if (
+          result.executeResult === "Failure" &&
+          this.testCase.status === "Pass"
+        ) {
+          this.$warning(this.$t("test_track.plan_view.execute_tip"));
           this.testCase.status = this.originalStatus;
           return;
         }
@@ -315,20 +400,19 @@ export default {
       }
       param.results = JSON.stringify(param.results);
       param.actualResult = this.testCase.actualResult;
-      testPlanTestCaseEdit(param)
-        .then(() => {
-          this.$request(option);
+      testPlanTestCaseEdit(param).then(() => {
+        this.$request(option);
 
-          this.$success(this.$t('commons.save_success'));
-          this.updateTestCases(param);
-          this.setPlanStatus(this.testCase.planId);
+        this.$success(this.$t("commons.save_success"));
+        this.updateTestCases(param);
+        this.setPlanStatus(this.testCase.planId);
 
-          if (this.testCase.comment) {
-            this.$refs.comment.getComments();
-            this.testCase.comment = '';
-          }
-          this.originalStatus = this.testCase.status;
-        });
+        if (this.testCase.comment) {
+          this.$refs.comment.getComments();
+          this.testCase.comment = "";
+        }
+        this.originalStatus = this.testCase.status;
+      });
     },
     updateTestCases(param) {
       for (let i = 0; i < this.testCases.length; i++) {
@@ -345,7 +429,7 @@ export default {
       if (this.isLastData()) {
         return;
       } else if (this.index === this.testCases.length - 1) {
-        this.$emit('nextPage');
+        this.$emit("nextPage");
         this.index = 0;
         return;
       }
@@ -354,20 +438,23 @@ export default {
       this.reloadOtherInfo();
     },
     isLastData() {
-      return this.index === this.testCases.length - 1 && this.pageNum === this.pageTotal;
+      return (
+        this.index === this.testCases.length - 1 &&
+        this.pageNum === this.pageTotal
+      );
     },
     reloadOtherInfo() {
       this.otherInfoActive = false;
       this.$nextTick(() => {
         this.otherInfoActive = true;
-      })
+      });
     },
     handlePre() {
       if (this.index === 0 && this.pageNum === 1) {
-        this.$warning('已经是第一页');
+        this.$warning("已经是第一页");
         return;
       } else if (this.index === 0) {
-        this.$emit('prePage');
+        this.$emit("prePage");
         this.index = this.pageSize - 1;
         return;
       }
@@ -378,66 +465,69 @@ export default {
     getTestCase(id) {
       this.loading = true;
       // id 为 TestPlanTestCase 的 id
-      testPlanTestCaseGet(id)
-        .then(response => {
-          this.loading = false;
-          let item = {};
-          Object.assign(item, response.data);
-          if (item.results) {
-            item.results = JSON.parse(item.results);
-          } else if (item.steps) {
-            item.results = [item.steps.length];
-          }
-          if (item.issues) {
-            item.issues = JSON.parse(item.issues);
-          } else {
-            item.issues = {};
-          }
-          item.steps = JSON.parse(item.steps);
-          if (!item.stepModel) {
-            item.stepModel = 'STEP';
-          }
-          item.steptResults = [];
-          if (item.steps) {
-            for (let i = 0; i < item.steps.length; i++) {
-              if (item.results) {
-                if (item.results[i]) {
-                  item.steps[i].actualResult = item.results[i].actualResult;
-                  item.steps[i].executeResult = item.results[i].executeResult;
-                }
-                item.steptResults.push(item.steps[i]);
-              } else {
-                item.steptResults.push({
-                  actualResult: '',
-                  executeResult: ''
-                });
+      testPlanTestCaseGet(id).then((response) => {
+        this.loading = false;
+        let item = {};
+        Object.assign(item, response.data);
+        if (item.results) {
+          item.results = JSON.parse(item.results);
+        } else if (item.steps) {
+          item.results = [item.steps.length];
+        }
+        if (item.issues) {
+          item.issues = JSON.parse(item.issues);
+        } else {
+          item.issues = {};
+        }
+        item.steps = JSON.parse(item.steps);
+        if (!item.stepModel) {
+          item.stepModel = "STEP";
+        }
+        item.steptResults = [];
+        if (item.steps) {
+          for (let i = 0; i < item.steps.length; i++) {
+            if (item.results) {
+              if (item.results[i]) {
+                item.steps[i].actualResult = item.results[i].actualResult;
+                item.steps[i].executeResult = item.results[i].executeResult;
               }
+              item.steptResults.push(item.steps[i]);
+            } else {
+              item.steptResults.push({
+                actualResult: "",
+                executeResult: "",
+              });
             }
           }
-          this.testCase = item;
-          this.originalStatus = this.testCase.status;
-          parseCustomField(this.testCase, this.testCaseTemplate, null, buildTestCaseOldFields(this.testCase));
-          this.testCaseTemplate.customFields.forEach(item => {
-            try {
-              item.defaultValue = JSON.parse(item.defaultValue);
-            } catch (e) {
-              // nothing
-            }
-          });
-          this.isCustomFiledActive = true;
-          if (!this.testCase.actualResult) {
-            // 如果没值,使用模板的默认值
-            this.testCase.actualResult = this.testCaseTemplate.actualResult;
+        }
+        this.testCase = item;
+        this.originalStatus = this.testCase.status;
+        parseCustomField(
+          this.testCase,
+          this.testCaseTemplate,
+          null,
+          buildTestCaseOldFields(this.testCase)
+        );
+        this.testCaseTemplate.customFields.forEach((item) => {
+          try {
+            item.defaultValue = JSON.parse(item.defaultValue);
+          } catch (e) {
+            // nothing
           }
         });
+        this.isCustomFiledActive = true;
+        if (!this.testCase.actualResult) {
+          // 如果没值,使用模板的默认值
+          this.testCase.actualResult = this.testCaseTemplate.actualResult;
+        }
+      });
     },
     openTestCaseEdit(testCase, tableData) {
-      checkProjectPermission(testCase.projectId)
-        .then(r => {
-          this.hasProjectPermission = r.data;
-        });
+      checkProjectPermission(testCase.projectId).then((r) => {
+        this.hasProjectPermission = r.data;
+      });
       this.showDialog = true;
-      this.activeTab = 'detail';
+      this.activeTab = "detail";
       this.originalStatus = testCase.status;
       this.setTitleWith();
 
@@ -454,11 +544,10 @@ export default {
 
       listenGoBack(this.handleClose);
       let initFuc = this.getTestCase;
-      getTestTemplate(testCase.projectId)
-        .then((template) => {
-          this.testCaseTemplate = template;
-          initFuc(testCase.id);
-        });
+      getTestTemplate(testCase.projectId).then((template) => {
+        this.testCaseTemplate = template;
+        initFuc(testCase.id);
+      });
       if (this.$refs.otherInfo) {
         this.$refs.otherInfo.reset();
       }
@@ -466,16 +555,16 @@ export default {
     testRun(reportId) {
       this.testCase.reportId = reportId;
       this.saveReport(reportId);
-      this.activeTab = 'result';
+      this.activeTab = "result";
     },
     testTabChange(data) {
-      if (this.testCase.type === 'performance' && data.paneName === 'result') {
+      if (this.testCase.type === "performance" && data.paneName === "result") {
         this.$refs.performanceTestResult.checkReportStatus();
         this.$refs.performanceTestResult.init();
       }
     },
     saveReport(reportId) {
-      testPlanTestCaseEdit({id: this.testCase.id, reportId: reportId});
+      testPlanTestCaseEdit({ id: this.testCase.id, reportId: reportId });
     },
     openTest(item) {
       const type = item.testType;
@@ -483,25 +572,34 @@ export default {
       switch (type) {
         case "performance": {
           let performanceData = this.$router.resolve({
-            path: '/performance/test/edit/' + id,
-          })
-          window.open(performanceData.href, '_blank');
+            path: "/performance/test/edit/" + id,
+          });
+          window.open(performanceData.href, "_blank");
           break;
         }
         case "testcase": {
           let caseData = this.$router.resolve({
-            name: 'ApiDefinition',
-            params: {redirectID: getUUID(), dataType: "apiTestCase", dataSelectRange: 'single:' + id}
+            name: "ApiDefinition",
+            params: {
+              versionId: "default",
+              redirectID: getUUID(),
+              dataType: "apiTestCase",
+              dataSelectRange: "single:" + id,
+            },
           });
-          window.open(caseData.href, '_blank');
+          window.open(caseData.href, "_blank");
           break;
         }
         case "automation": {
           let automationData = this.$router.resolve({
-            name: 'ApiAutomation',
-            params: {redirectID: getUUID(), dataType: "scenario", dataSelectRange: 'edit:' + id}
+            name: "ApiAutomation",
+            params: {
+              redirectID: getUUID(),
+              dataType: "scenario",
+              dataSelectRange: "edit:" + id,
+            },
           });
-          window.open(automationData.href, '_blank');
+          window.open(automationData.href, "_blank");
           break;
         }
       }
@@ -519,26 +617,28 @@ export default {
       this.relationGraphOpen = val;
     },
     openTestTestCase(item) {
-      let TestCaseData = this.$router.resolve(
-        {
-          path: '/track/case/all',
-          query: {redirectID: getUUID(), dataType: "testCase", dataSelectRange: item.caseId, projectId: item.projectId}
-        }
-      );
-      window.open(TestCaseData.href, '_blank');
+      let TestCaseData = this.$router.resolve({
+        path: "/track/case/all",
+        query: {
+          redirectID: getUUID(),
+          dataType: "testCase",
+          dataSelectRange: item.caseId,
+          projectId: item.projectId,
+        },
+      });
+      window.open(TestCaseData.href, "_blank");
     },
     addPLabel(str) {
       return "<p>" + str + "</p>";
     },
     setPlanStatus(planId) {
       testPlanEditStatus(planId);
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style scoped>
-
 .cast_label {
   color: dimgray;
 }
@@ -587,7 +687,7 @@ export default {
 }
 
 .el-switch :deep(.el-switch__label.is-active) {
-  color: #409EFF;
+  color: #409eff;
 }
 
 p {
diff --git a/test-track/frontend/src/business/review/view/components/TestReviewTestCaseEdit.vue b/test-track/frontend/src/business/review/view/components/TestReviewTestCaseEdit.vue
index e8d259130b..427dc8d7b6 100644
--- a/test-track/frontend/src/business/review/view/components/TestReviewTestCaseEdit.vue
+++ b/test-track/frontend/src/business/review/view/components/TestReviewTestCaseEdit.vue
@@ -1,5 +1,4 @@
 <template>
-
   <el-drawer
     :before-close="handleClose"
     :visible.sync="showDialog"
@@ -7,28 +6,27 @@
     :modal-append-to-body="false"
     size="100%"
     ref="drawer"
-    v-loading="loading">
-
+    v-loading="loading"
+  >
     <template>
       <el-row :gutter="10">
         <el-col :span="17">
           <div class="container">
             <el-card>
               <el-scrollbar>
-
-                <el-header style="height: 100%;">
-
+                <el-header style="height: 100%">
                   <el-row type="flex" class="head-bar">
-
                     <el-col :span="2">
-                      <el-button plain size="mini"
-                                 icon="el-icon-back"
-                                 @click="cancel">{{ $t('test_track.return') }}
+                      <el-button
+                        plain
+                        size="mini"
+                        icon="el-icon-back"
+                        @click="cancel"
+                        >{{ $t("test_track.return") }}
                       </el-button>
                     </el-col>
 
                     <el-col :span="22" class="head-right">
-
                       <ms-previous-next-button
                         :index="index"
                         :page-num="pageNum"
@@ -39,90 +37,146 @@
                         :pre-page-data="prePageData"
                         :list="testCases"
                         @pre="handlePre"
-                        @next="handleNext"/>
+                        @next="handleNext"
+                      />
                     </el-col>
-
                   </el-row>
 
-                  <el-row style="margin-top: 0;">
+                  <el-row style="margin-top: 0">
                     <el-col>
                       <el-divider content-position="left" class="title-divider">
-                        <el-button class="test-case-name" type="text" @click="openTestTestCase(testCase)">
-                        <span
-                          class="title-link"
-                          :title="testCase.name"
-                          :style="{'max-width': titleWith + 'px'}">
-                          {{ testCase.num }}-{{ testCase.name }}
-                        </span>
+                        <el-button
+                          class="test-case-name"
+                          type="text"
+                          @click="openTestTestCase(testCase)"
+                        >
+                          <span
+                            class="title-link"
+                            :title="testCase.name"
+                            :style="{ 'max-width': titleWith + 'px' }"
+                          >
+                            {{ testCase.num }}-{{ testCase.name }}
+                          </span>
                         </el-button>
                       </el-divider>
                     </el-col>
                   </el-row>
-
                 </el-header>
 
                 <div class="case_container">
                   <el-form>
-
                     <el-row>
                       <el-col :span="7">
-                        <el-form-item :label="$t('test_track.case.module')" prop="nodePath"
-                                      :label-width="formLabelWidth">
+                        <el-form-item
+                          :label="$t('test_track.case.module')"
+                          prop="nodePath"
+                          :label-width="formLabelWidth"
+                        >
                           {{ testCase.nodePath }}
                         </el-form-item>
                       </el-col>
                       <el-col :span="7">
-                        <el-form-item :label="$t('test_track.plan.plan_project')" prop="projectName"
-                                      :label-width="formLabelWidth">
+                        <el-form-item
+                          :label="$t('test_track.plan.plan_project')"
+                          prop="projectName"
+                          :label-width="formLabelWidth"
+                        >
                           {{ testCase.projectName }}
                         </el-form-item>
                       </el-col>
                       <el-col :span="10">
-                        <el-form-item :label="$t('评审状态')" :label-width="formLabelWidth">
-                          <status-table-item :value="oldReviewStatus"/>
-                        </el-form-item >
+                        <el-form-item
+                          :label="$t('评审状态')"
+                          :label-width="formLabelWidth"
+                        >
+                          <status-table-item :value="oldReviewStatus" />
+                        </el-form-item>
                       </el-col>
                     </el-row>
 
-                    <el-form ref="customFieldForm"
-                             v-if="isCustomFiledActive"
-                             class="case-form">
+                    <el-form
+                      ref="customFieldForm"
+                      v-if="isCustomFiledActive"
+                      class="case-form"
+                    >
                       <el-row>
-                        <el-col :span="7" v-for="(item, index) in testCaseTemplate.customFields" :key="index">
-                          <el-form-item :label="item.system ? $t(systemNameMap[item.name]) : item.name"
-                                        :prop="item.name"
-                                        :label-width="formLabelWidth">
-                            <custom-filed-component :disabled="true" :data="item" :form="{}" prop="defaultValue"/>
+                        <el-col
+                          :span="7"
+                          v-for="(item, index) in testCaseTemplate.customFields"
+                          :key="index"
+                        >
+                          <el-form-item
+                            :label="
+                              item.system
+                                ? $t(systemNameMap[item.name])
+                                : item.name
+                            "
+                            :prop="item.name"
+                            :label-width="formLabelWidth"
+                          >
+                            <custom-filed-component
+                              :disabled="true"
+                              :data="item"
+                              :form="{}"
+                              prop="defaultValue"
+                            />
                           </el-form-item>
                         </el-col>
                       </el-row>
                     </el-form>
 
-                    <form-rich-text-item :label-width="formLabelWidth" :disabled="true"
-                                         :title="$t('test_track.case.prerequisite')"
-                                         :data="testCase" prop="prerequisite"/>
-                    <step-change-item :disable="true" :label-width="formLabelWidth" :form="testCase"/>
-                    <form-rich-text-item :label-width="formLabelWidth" :disabled="true"
-                                         v-if="testCase.stepModel === 'TEXT'" :title="$t('test_track.case.step_desc')"
-                                         :data="testCase" prop="stepDescription"/>
-                    <form-rich-text-item :label-width="formLabelWidth" :disabled="true"
-                                         v-if="testCase.stepModel === 'TEXT'"
-                                         :title="$t('test_track.case.expected_results')" :data="testCase"
-                                         prop="expectedResult"/>
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      :disabled="true"
+                      :title="$t('test_track.case.prerequisite')"
+                      :data="testCase"
+                      prop="prerequisite"
+                    />
+                    <step-change-item
+                      :disable="true"
+                      :label-width="formLabelWidth"
+                      :form="testCase"
+                    />
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      :disabled="true"
+                      v-if="testCase.stepModel === 'TEXT'"
+                      :title="$t('test_track.case.step_desc')"
+                      :data="testCase"
+                      prop="stepDescription"
+                    />
+                    <form-rich-text-item
+                      :label-width="formLabelWidth"
+                      :disabled="true"
+                      v-if="testCase.stepModel === 'TEXT'"
+                      :title="$t('test_track.case.expected_results')"
+                      :data="testCase"
+                      prop="expectedResult"
+                    />
 
-                    <test-case-step-item :label-width="formLabelWidth" :read-only="true"
-                                         v-if="testCase.stepModel === 'STEP'" :form="testCase"/>
+                    <test-case-step-item
+                      :label-width="formLabelWidth"
+                      :read-only="true"
+                      v-if="testCase.stepModel === 'STEP'"
+                      :form="testCase"
+                    />
 
-                    <el-form-item :label="$t('test_track.case.other_info')" :label-width="formLabelWidth">
-                      <test-case-edit-other-info @openTest="openTest" :read-only="true"
-                                                 @syncRelationGraphOpen="syncRelationGraphOpen"
-                                                 :project-id="projectId" :form="testCase" :case-id="testCase.caseId"
-                                                 ref="otherInfo"/>
+                    <el-form-item
+                      :label="$t('test_track.case.other_info')"
+                      :label-width="formLabelWidth"
+                    >
+                      <test-case-edit-other-info
+                        @openTest="openTest"
+                        :read-only="true"
+                        @syncRelationGraphOpen="syncRelationGraphOpen"
+                        :project-id="projectId"
+                        :form="testCase"
+                        :case-id="testCase.caseId"
+                        ref="otherInfo"
+                      />
                     </el-form-item>
-
                   </el-form>
                 </div>
-
               </el-scrollbar>
             </el-card>
           </div>
@@ -133,30 +187,38 @@
               :test-case="testCase"
               :is-read-only="isReadOnly"
               :origin-status="oldReviewStatus"
-              @saveCase="saveCase()"/>
+              @saveCase="saveCase()"
+            />
 
             <review-comment
               default-type="REVIEW"
               :case-id="testCase.caseId"
               @saveCaseReview="saveCaseReview"
-              ref="comment"/>
+              ref="comment"
+            />
           </div>
         </el-col>
       </el-row>
-
     </template>
-
   </el-drawer>
 </template>
 
 <script>
-import {getCurrentProjectID} from "metersphere-frontend/src/utils/token";
-import {getUUID, listenGoBack, removeGoBackListener} from "metersphere-frontend/src/utils"
+import { getCurrentProjectID } from "metersphere-frontend/src/utils/token";
+import {
+  getUUID,
+  listenGoBack,
+  removeGoBackListener,
+} from "metersphere-frontend/src/utils";
 import ReviewComment from "@/business/review/commom/ReviewComment";
 import TestCaseAttachment from "@/business/case/components/TestCaseAttachment";
-import {buildTestCaseOldFields, getTemplate, parseCustomField} from "metersphere-frontend/src/utils/custom_field";
+import {
+  buildTestCaseOldFields,
+  getTemplate,
+  parseCustomField,
+} from "metersphere-frontend/src/utils/custom_field";
 import TestCaseEditOtherInfo from "@/business/case/components/TestCaseEditOtherInfo";
-import {SYSTEM_FIELD_NAME_MAP} from "metersphere-frontend/src/utils/table-constants";
+import { SYSTEM_FIELD_NAME_MAP } from "metersphere-frontend/src/utils/table-constants";
 import FormRichTextItem from "metersphere-frontend/src/components/FormRichTextItem";
 import CustomFiledComponent from "metersphere-frontend/src/components/template/CustomFiledComponent";
 import StepChangeItem from "@/business/case/components/StepChangeItem";
@@ -164,12 +226,12 @@ import TestCaseStepItem from "@/business/case/components/TestCaseStepItem";
 import MsPreviousNextButton from "metersphere-frontend/src/components/MsPreviousNextButton";
 import TestReviewTestCaseExecute from "./TestReviewTestCaseExecute";
 import StatusTableItem from "@/business/common/tableItems/planview/StatusTableItem";
-import {getTestTemplate} from "@/api/custom-field-template";
+import { getTestTemplate } from "@/api/custom-field-template";
 import {
   editTestCaseReviewStatus,
   editTestReviewTestCase,
   getRelateTest,
-  getTestReviewTestCase
+  getTestReviewTestCase,
 } from "@/api/test-review";
 
 export default {
@@ -184,7 +246,7 @@ export default {
     FormRichTextItem,
     TestCaseEditOtherInfo,
     ReviewComment,
-    TestCaseAttachment
+    TestCaseAttachment,
   },
   data() {
     return {
@@ -193,44 +255,44 @@ export default {
       testCase: {},
       index: 0,
       testCases: [],
-      readConfig: {toolbar: []},
+      readConfig: { toolbar: [] },
       test: {},
-      activeTab: 'detail',
+      activeTab: "detail",
       isFailure: true,
       users: [],
-      activeName: 'comment',
+      activeName: "comment",
       comments: [],
       tableData: [],
       currentScenario: {},
-      mark: 'detail',
+      mark: "detail",
       api: {},
       apiCase: {},
       testCaseTemplate: {},
-      formLabelWidth: '100px',
+      formLabelWidth: "100px",
       isCustomFiledActive: false,
-      oldReviewStatus: '',
+      oldReviewStatus: "",
       titleWith: 0,
       relationGraphOpen: false,
     };
   },
   props: {
     total: {
-      type: Number
+      type: Number,
     },
     searchParam: {
-      type: Object
+      type: Object,
     },
     isReadOnly: {
       type: Boolean,
-      default: false
+      default: false,
     },
     pageNum: Number,
     pageSize: {
       type: Number,
-      default: 1
+      default: 1,
     },
     nextPageData: Object,
-    prePageData: Object
+    prePageData: Object,
   },
   computed: {
     projectId() {
@@ -241,7 +303,7 @@ export default {
     },
     pageTotal() {
       return Math.ceil(this.total / this.pageSize);
-    }
+    },
   },
   methods: {
     openTest(item) {
@@ -250,25 +312,35 @@ export default {
       switch (type) {
         case "performance": {
           let performanceData = this.$router.resolve({
-            path: '/performance/test/edit/' + id,
+            path: "/performance/test/edit/" + id,
           });
-          window.open(performanceData.href, '_blank');
+          window.open(performanceData.href, "_blank");
           break;
         }
         case "testcase": {
           let caseData = this.$router.resolve({
-            name: 'ApiDefinition',
-            params: {redirectID: getUUID(), dataType: "apiTestCase", dataSelectRange: 'single:' + id}
+            name: "ApiDefinition",
+            params: {
+              versionId: "default",
+              redirectID: getUUID(),
+              dataType: "apiTestCase",
+              dataSelectRange: "single:" + id,
+            },
           });
-          window.open(caseData.href, '_blank');
+          window.open(caseData.href, "_blank");
           break;
         }
         case "automation": {
           let automationData = this.$router.resolve({
-            name: 'ApiAutomation',
-            params: {redirectID: getUUID(), dataType: "scenario", dataSelectRange: 'edit:' + id}
+            name: "ApiAutomation",
+            params: {
+              versionId: "default",
+              redirectID: getUUID(),
+              dataType: "scenario",
+              dataSelectRange: "edit:" + id,
+            },
           });
-          window.open(automationData.href, '_blank');
+          window.open(automationData.href, "_blank");
           break;
         }
       }
@@ -282,7 +354,7 @@ export default {
     },
     cancel() {
       this.handleClose();
-      this.$emit('refreshTable');
+      this.$emit("refreshTable");
     },
     saveCase() {
       let param = {};
@@ -291,22 +363,21 @@ export default {
       param.reviewId = this.testCase.reviewId;
       param.comment = this.testCase.comment;
       param.status = this.testCase.reviewStatus;
-      editTestReviewTestCase(param)
-        .then(() => {
-          this.$success(this.$t('commons.save_success'));
-          this.updateTestCases(param);
-          this.setReviewStatus(this.testCase.reviewId);
+      editTestReviewTestCase(param).then(() => {
+        this.$success(this.$t("commons.save_success"));
+        this.updateTestCases(param);
+        this.setReviewStatus(this.testCase.reviewId);
 
-          // 修改当前用例在整个用例列表的状态
-          this.testCases[this.index].status = this.testCase.status;
-          // 切换状态后需要修改旧的状态
-          this.oldReviewStatus = this.testCase.reviewStatus;
+        // 修改当前用例在整个用例列表的状态
+        this.testCases[this.index].status = this.testCase.status;
+        // 切换状态后需要修改旧的状态
+        this.oldReviewStatus = this.testCase.reviewStatus;
 
-          if (this.testCase.comment) {
-            this.$refs.comment.getComments();
-            this.testCase.comment = '';
-          }
-        })
+        if (this.testCase.comment) {
+          this.$refs.comment.getComments();
+          this.testCase.comment = "";
+        }
+      });
     },
     saveCaseReview() {
       let param = {};
@@ -315,18 +386,17 @@ export default {
       param.caseId = this.testCase.caseId;
       param.reviewId = this.testCase.reviewId;
       param.status = status;
-      editTestReviewTestCase(param)
-        .then(() => {
-          this.updateTestCases(param);
-          this.setReviewStatus(this.testCase.reviewId);
-          this.oldReviewStatus = status;
-          // 修改当前用例在整个用例列表的状态
-          this.testCases[this.index].status = status;
-          if (this.index < this.testCases.length - 1) {
-            this.handleNext();
-          }
-          this.$success(this.$t('commons.save_success'));
-        });
+      editTestReviewTestCase(param).then(() => {
+        this.updateTestCases(param);
+        this.setReviewStatus(this.testCase.reviewId);
+        this.oldReviewStatus = status;
+        // 修改当前用例在整个用例列表的状态
+        this.testCases[this.index].status = status;
+        if (this.index < this.testCases.length - 1) {
+          this.handleNext();
+        }
+        this.$success(this.$t("commons.save_success"));
+      });
     },
     updateTestCases(param) {
       for (let i = 0; i < this.testCases.length; i++) {
@@ -338,12 +408,15 @@ export default {
       }
     },
     handleNext() {
-      if (this.index === this.testCases.length - 1 && this.pageNum === this.pageTotal) {
+      if (
+        this.index === this.testCases.length - 1 &&
+        this.pageNum === this.pageTotal
+      ) {
         // 最后一条不处理
         return;
       } else if (this.index === this.testCases.length - 1) {
         // 到本页最后一条数据，则翻页
-        this.$emit('nextPage');
+        this.$emit("nextPage");
         this.index = 0;
         return;
       }
@@ -351,13 +424,16 @@ export default {
       this.getTestCase(this.testCases[this.index].id);
     },
     isLastData() {
-      return this.index === this.testCases.length - 1 && this.pageNum === this.pageTotal;
+      return (
+        this.index === this.testCases.length - 1 &&
+        this.pageNum === this.pageTotal
+      );
     },
     handlePre() {
       if (this.index === 0 && this.pageNum === 1) {
         return;
       } else if (this.index === 0) {
-        this.$emit('prePage');
+        this.$emit("prePage");
         this.index = this.pageSize - 1;
         return;
       }
@@ -366,31 +442,35 @@ export default {
     },
     getTestCase(id) {
       this.loading = true;
-      getTestReviewTestCase(id)
-        .then((response) => {
-          this.loading = false;
-          let item = {};
-          let data = response.data;
-          Object.assign(item, data);
-          item.results = JSON.parse(item.results);
-          if (item.issues) {
-            item.issues = JSON.parse(item.issues);
-          } else {
-            item.issues = {};
-          }
-          item.steps = JSON.parse(item.steps);
-          if (!item.stepModel) {
-            item.stepModel = 'STEP';
-          }
-          parseCustomField(item, this.testCaseTemplate, null, buildTestCaseOldFields(item));
-          this.isCustomFiledActive = true;
-          this.testCase = item;
-          this.oldReviewStatus = this.testCase.reviewStatus;
-          if (!this.testCase.actualResult) {
-            // 如果没值,使用模板的默认值
-            this.testCase.actualResult = this.testCaseTemplate.actualResult;
-          }
-        });
+      getTestReviewTestCase(id).then((response) => {
+        this.loading = false;
+        let item = {};
+        let data = response.data;
+        Object.assign(item, data);
+        item.results = JSON.parse(item.results);
+        if (item.issues) {
+          item.issues = JSON.parse(item.issues);
+        } else {
+          item.issues = {};
+        }
+        item.steps = JSON.parse(item.steps);
+        if (!item.stepModel) {
+          item.stepModel = "STEP";
+        }
+        parseCustomField(
+          item,
+          this.testCaseTemplate,
+          null,
+          buildTestCaseOldFields(item)
+        );
+        this.isCustomFiledActive = true;
+        this.testCase = item;
+        this.oldReviewStatus = this.testCase.reviewStatus;
+        if (!this.testCase.actualResult) {
+          // 如果没值,使用模板的默认值
+          this.testCase.actualResult = this.testCaseTemplate.actualResult;
+        }
+      });
     },
     setTitleWith() {
       this.$nextTick(() => {
@@ -405,7 +485,7 @@ export default {
       this.showDialog = true;
       // 一开始加载时候需要保存用例评审旧的状态
       this.oldReviewStatus = testCase.reviewStatus;
-      this.activeTab = 'detail';
+      this.activeTab = "detail";
       listenGoBack(this.handleClose);
       let initFuc = this.getTestCase;
       this.setTitleWith();
@@ -421,26 +501,34 @@ export default {
         }
       }
 
-      getTestTemplate(testCase.projectId)
-        .then((response) => {
-          this.testCaseTemplate = response;
-          initFuc(testCase.id);
-        });
+      getTestTemplate(testCase.projectId).then((response) => {
+        this.testCaseTemplate = response;
+        initFuc(testCase.id);
+      });
 
       if (this.$refs.otherInfo) {
         this.$refs.otherInfo.reset();
       }
     },
     openTestTestCase(item) {
-      let testCaseData = this.$router.resolve(
-        {path: '/track/case/all', query: {redirectID: getUUID(), dataType: "testCase", dataSelectRange: item.caseId}}
-      );
-      window.open(testCaseData.href, '_blank');
+      let testCaseData = this.$router.resolve({
+        path: "/track/case/all",
+        query: {
+          redirectID: getUUID(),
+          dataType: "testCase",
+          dataSelectRange: item.caseId,
+        },
+      });
+      window.open(testCaseData.href, "_blank");
     },
     getRelatedTest() {
-      if (this.testCase.method === 'auto' && this.testCase.testId && this.testCase.testId !== 'other') {
-        getRelateTest(this.testCase.type, this.testCase.testId)
-          .then((response) => {
+      if (
+        this.testCase.method === "auto" &&
+        this.testCase.testId &&
+        this.testCase.testId !== "other"
+      ) {
+        getRelateTest(this.testCase.type, this.testCase.testId).then(
+          (response) => {
             let data = response.data;
             if (data) {
               this.test = data;
@@ -448,8 +536,9 @@ export default {
               this.test = {};
               this.$warning(this.$t("test_track.case.relate_test_not_find"));
             }
-          });
-      } else if (this.testCase.testId === 'other') {
+          }
+        );
+      } else if (this.testCase.testId === "other") {
         this.$warning(this.$t("test_track.case.other_relate_test_not_find"));
       }
     },
@@ -457,18 +546,20 @@ export default {
       editTestCaseReviewStatus(reviewId);
     },
     stepResultChange() {
-      if (this.testCase.method === 'manual') {
-        this.isFailure = this.testCase.steptResults.filter(s => {
-          return s.executeResult === 'Failure' || s.executeResult === 'Blocking';
-        }).length > 0;
+      if (this.testCase.method === "manual") {
+        this.isFailure =
+          this.testCase.steptResults.filter((s) => {
+            return (
+              s.executeResult === "Failure" || s.executeResult === "Blocking"
+            );
+          }).length > 0;
       }
     },
-  }
-}
+  },
+};
 </script>
 
 <style scoped>
-
 .border-hidden :deep(.el-textarea__inner) {
   border-style: hidden;
   background-color: white;
@@ -509,7 +600,7 @@ export default {
 }
 
 .el-switch :deep(.el-switch__label.is-active) {
-  color: #409EFF;
+  color: #409eff;
 }
 
 .container :deep(.el-card__body) {
diff --git a/workstation/frontend/src/business/module/api/ReferenceView.vue b/workstation/frontend/src/business/module/api/ReferenceView.vue
index 4080ef9bde..11438c5460 100644
--- a/workstation/frontend/src/business/module/api/ReferenceView.vue
+++ b/workstation/frontend/src/business/module/api/ReferenceView.vue
@@ -1,18 +1,32 @@
 <template>
-  <el-dialog :close-on-click-modal="false" :title="$t('api_test.automation.case_ref')" :visible.sync="visible"
-             :modal="false" width="45%" :destroy-on-close="true">
-    <span>{{ $t('api_test.automation.scenario_ref') }}：</span>
+  <el-dialog
+    :close-on-click-modal="false"
+    :title="$t('api_test.automation.case_ref')"
+    :visible.sync="visible"
+    :modal="false"
+    width="45%"
+    :destroy-on-close="true"
+  >
+    <span>{{ $t("api_test.automation.scenario_ref") }}：</span>
     <div class="refs" v-loading="scenarioLoading">
-      <div v-for="(item, index) in scenarioRefs" :key="index" class="el-button--text">
+      <div
+        v-for="(item, index) in scenarioRefs"
+        :key="index"
+        class="el-button--text"
+      >
         <el-link @click="openScenario(item)">
           {{ item.name }}
         </el-link>
       </div>
     </div>
 
-    <span>{{ $t('api_test.automation.plan_ref') }}：</span>
+    <span>{{ $t("api_test.automation.plan_ref") }}：</span>
     <div class="refs">
-      <div v-for="(item, index) in planRefs" :key="index" class="el-button--text">
+      <div
+        v-for="(item, index) in planRefs"
+        :key="index"
+        class="el-button--text"
+      >
         <el-link @click="openTestPlan(item)">
           {{ item.name }}
         </el-link>
@@ -21,8 +35,12 @@
 
     <template v-slot:footer>
       <div class="dialog-footer">
-        <el-button type="primary" @click="visible = false" @keydown.enter.native.prevent>
-          {{ $t('commons.confirm') }}
+        <el-button
+          type="primary"
+          @click="visible = false"
+          @keydown.enter.native.prevent
+        >
+          {{ $t("commons.confirm") }}
         </el-button>
       </div>
     </template>
@@ -30,93 +48,105 @@
 </template>
 
 <script>
-
-import {getCurrentProjectID, getCurrentWorkspaceId} from "metersphere-frontend/src/utils/token";
-import {getUUID} from "metersphere-frontend/src/utils";
-import {getOwnerProjectIds, getProject} from "@/api/project";
-import {getScenarioReference} from "@/api/scenario";
+import {
+  getCurrentProjectID,
+  getCurrentWorkspaceId,
+} from "metersphere-frontend/src/utils/token";
+import { getUUID } from "metersphere-frontend/src/utils";
+import { getOwnerProjectIds, getProject } from "@/api/project";
+import { getScenarioReference } from "@/api/scenario";
 
 export default {
-    name: "MsReferenceView",
-    components: {},
-    data() {
-      return {
-        visible: false,
-        scenarioLoading: false,
-        scenarioRefs: [],
-        planRefs: []
+  name: "MsReferenceView",
+  components: {},
+  data() {
+    return {
+      visible: false,
+      scenarioLoading: false,
+      scenarioRefs: [],
+      planRefs: [],
+    };
+  },
+  methods: {
+    getReferenceData(row) {
+      if (row.id === undefined) {
+        return;
+      }
+      this.scenarioLoading = true;
+      this.scenarioRefs = [];
+      getScenarioReference(row).then((response) => {
+        this.scenarioRefs = response.data.scenarioList;
+        this.planRefs = response.data.testPlanList;
+        this.scenarioLoading = false;
+      });
+    },
+    open(row) {
+      this.getReferenceData(row);
+      this.visible = true;
+    },
+    openScenario(resource) {
+      let workspaceId = getCurrentWorkspaceId();
+      let isTurnSpace = true;
+      if (resource.projectId !== getCurrentProjectID()) {
+        isTurnSpace = false;
+        getProject(resource.projectId).then((response) => {
+          if (response.data) {
+            workspaceId = response.data.workspaceId;
+            isTurnSpace = true;
+            this.checkPermission(resource, workspaceId, isTurnSpace);
+          }
+        });
+      } else {
+        this.checkPermission(resource, workspaceId, isTurnSpace);
       }
     },
-    methods: {
-      getReferenceData(row) {
-        if (row.id === undefined) {
-          return;
-        }
-        this.scenarioLoading = true;
-        this.scenarioRefs = [];
-        getScenarioReference(row).then(response => {
-          this.scenarioRefs = response.data.scenarioList;
-          this.planRefs = response.data.testPlanList;
-          this.scenarioLoading = false;
-        })
-      },
-      open(row) {
-        this.getReferenceData(row);
-        this.visible = true
-      },
-      openScenario(resource) {
-        let workspaceId = getCurrentWorkspaceId();
-        let isTurnSpace = true
-        if (resource.projectId !== getCurrentProjectID()) {
-          isTurnSpace = false;
-          getProject(resource.projectId).then(response => {
-            if (response.data) {
-              workspaceId = response.data.workspaceId;
-              isTurnSpace = true;
-              this.checkPermission(resource, workspaceId, isTurnSpace);
-            }
-          });
-        } else {
-          this.checkPermission(resource, workspaceId, isTurnSpace);
-        }
-
-      },
-      gotoTurn(resource, workspaceId, isTurnSpace) {
-        let automationData = this.$router.resolve({
-          name: 'ApiAutomation',
-          params: {redirectID: getUUID(), dataType: "scenario", dataSelectRange: 'edit:' + resource.id, projectId: resource.projectId, workspaceId: workspaceId}
-        });
-        if (isTurnSpace) {
-          window.open(automationData.href, '_blank');
-        }
-      },
-      checkPermission(resource, workspaceId, isTurnSpace) {
-        getOwnerProjectIds().then(res => {
-          const project = res.data.find(p => p === resource.projectId);
-          if (!project) {
-            this.$warning(this.$t('commons.no_permission'));
-          } else {
-            this.gotoTurn(resource, workspaceId, isTurnSpace)
-          }
-        })
-      },
-      openTestPlan(item){
-        let automationData = this.$router.resolve({
-          path: '/track/plan/view/' + item.id,
-          query: { workspaceId: item.workspaceId, projectId: item.projectId, charType: 'api'}
-        });
-        window.open(automationData.href, '_blank');
+    gotoTurn(resource, workspaceId, isTurnSpace) {
+      let automationData = this.$router.resolve({
+        name: "ApiAutomation",
+        params: {
+          versionId: "default",
+          redirectID: getUUID(),
+          dataType: "scenario",
+          dataSelectRange: "edit:" + resource.id,
+          projectId: resource.projectId,
+          workspaceId: workspaceId,
+        },
+      });
+      if (isTurnSpace) {
+        window.open(automationData.href, "_blank");
       }
-    }
-  }
+    },
+    checkPermission(resource, workspaceId, isTurnSpace) {
+      getOwnerProjectIds().then((res) => {
+        const project = res.data.find((p) => p === resource.projectId);
+        if (!project) {
+          this.$warning(this.$t("commons.no_permission"));
+        } else {
+          this.gotoTurn(resource, workspaceId, isTurnSpace);
+        }
+      });
+    },
+    openTestPlan(item) {
+      let automationData = this.$router.resolve({
+        path: "/track/plan/view/" + item.id,
+        query: {
+          workspaceId: item.workspaceId,
+          projectId: item.projectId,
+          charType: "api",
+        },
+      });
+      window.open(automationData.href, "_blank");
+    },
+  },
+};
 </script>
 
 <style scoped>
-  .refs {
-    min-height: 50px;
-    max-height: 200px;
-    overflow-y: auto;
-    font-size: 12px;
-    padding-bottom: 10px;
-  }
+.refs {
+  min-height: 50px;
+  max-height: 200px;
+  overflow-y: auto;
+  font-size: 12px;
+  padding-bottom: 10px;
+}
 </style>