feat(测试计划): 测试计划内批量执行用例时增加默认环境的展示方式

--story=1012486 --user=宋天阳【货车之家】接口场景包含跨项目步骤时取消跨项目环境必选&测试计划关联接口、UI测试时取消运行环境必选 https://www.tapd.cn/55049933/s/1402102
2023-08-10 18:08:02 +08:00 · 2023-08-10 18:08:02 +08:00 · 2265199e37
parent 87dd88209d
commit 2265199e37
7 changed files with 229 additions and 220 deletions
--- a/performance-test/frontend/src/business/test/components/PerformancePressureConfig.vue
+++ b/performance-test/frontend/src/business/test/components/PerformancePressureConfig.vue
@ -6,11 +6,11 @@
          <el-form-item :label="$t('load_test.select_resource_pool')">
            <el-select v-model="resourcePool" size="mini" @change="resourcePoolChange">
              <el-option
-                v-for="item in resourcePools"
-                :key="item.id"
-                :label="item.name"
-                :disabled="!item.performance"
-                :value="item.id">
+                  v-for="item in resourcePools"
+                  :key="item.id"
+                  :label="item.name"
+                  :disabled="!item.performance"
+                  :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
@ -81,10 +81,10 @@
              <el-form-item :label="$t('load_test.on_sample_error')">
                <el-select v-model="threadGroup.onSampleError" size="mini">
                  <el-option
-                    v-for="item in onSampleErrors"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
+                      v-for="item in onSampleErrors"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
@ -213,10 +213,10 @@
                    <el-select v-model="threadGroup.resourceNodeIndex" @change="specifyNodeChange(threadGroup)"
                               size="mini">
                      <el-option
-                        v-for="(node, index) in resourceNodes"
-                        :key="node.ip"
-                        :label="node.ip"
-                        :value="index">
+                          v-for="(node, index) in resourceNodes"
+                          :key="node.ip"
+                          :label="node.ip"
+                          :value="index">
                      </el-option>
                    </el-select>
                  </el-form-item>
@ -283,7 +283,7 @@ const RATIOS = "ratios";

 const hexToRgb = function (hex) {
  return 'rgb(' + parseInt('0x' + hex.slice(1, 3)) + ',' + parseInt('0x' + hex.slice(3, 5))
-    + ',' + parseInt('0x' + hex.slice(5, 7)) + ')';
+      + ',' + parseInt('0x' + hex.slice(5, 7)) + ')';
 };

 export default {
@ -398,138 +398,139 @@ export default {
  methods: {
    getResourcePools() {
      getResourcePools(this.isShare)
-        .then(response => {
-          this.resourcePools = response.data;
-          // 如果当前的资源池无效 设置 null
-          if (this.resourcePool) {
-            if (response.data.filter(p => p.id === this.resourcePool && p.performance).length === 0) {
-              this.resourcePool = null;
-              // 标记因资源池无效而将资源池ID置为null
-              this.setPoolNull = true;
+          .then(response => {
+            this.resourcePools = response.data;
+            // 如果当前的资源池无效 设置 null
+            if (this.resourcePool) {
+              if (response.data.filter(p => p.id === this.resourcePool && p.performance).length === 0) {
+                this.resourcePool = null;
+                // 标记因资源池无效而将资源池ID置为null
+                this.setPoolNull = true;
+              }
            }
-          }

-          this.resourcePoolChange();
-        });
+            this.resourcePoolChange();
+          });
    },
    getLoadConfig() {
+      this.loadIsOver = false;
      getLoadConfig(this.testId, this.reportId, this.isShare)
-        .then(response => {
-          let data = JSON.parse(response.data);
-          this.loadIsOver = false;
-          for (let i = 0; i < this.threadGroups.length; i++) {
-            data[i].forEach(item => {
-              switch (item.key) {
-                case TARGET_LEVEL:
-                  this.threadGroups[i].threadNumber = item.value;
-                  break;
-                case RAMP_UP:
-                  this.threadGroups[i].rampUpTime = item.value;
-                  break;
-                case ITERATE_RAMP_UP:
-                  this.threadGroups[i].iterateRampUp = item.value;
-                  break;
-                case DURATION:
-                  this.threadGroups[i].duration = item.value;
-                  break;
-                case DURATION_HOURS:
-                  this.threadGroups[i].durationHours = item.value;
-                  break;
-                case DURATION_MINUTES:
-                  this.threadGroups[i].durationMinutes = item.value;
-                  break;
-                case DURATION_SECONDS:
-                  this.threadGroups[i].durationSeconds = item.value;
-                  break;
-                case UNIT:
-                  this.threadGroups[i].unit = item.value;
-                  break;
-                case STEPS:
-                  this.threadGroups[i].step = item.value;
-                  break;
-                case RPS_LIMIT:
-                  this.threadGroups[i].rpsLimit = item.value;
-                  break;
-                case RPS_LIMIT_ENABLE:
-                  this.threadGroups[i].rpsLimitEnable = item.value;
-                  break;
-                case THREAD_TYPE:
-                  this.threadGroups[i].threadType = item.value;
-                  break;
-                case ITERATE_NUM:
-                  this.threadGroups[i].iterateNum = item.value;
-                  break;
-                case ENABLED:
-                  this.threadGroups[i].enabled = item.value;
-                  break;
-                case DELETED:
-                  this.threadGroups[i].deleted = item.value;
-                  break;
-                case HANDLER:
-                  this.threadGroups[i].handler = item.value;
-                  break;
-                case THREAD_GROUP_TYPE:
-                  this.threadGroups[i].tgType = item.value;
-                  break;
-                case ON_SAMPLE_ERROR:
-                  this.threadGroups[i].onSampleError = item.value;
-                  break;
-                case STRATEGY:
-                  this.threadGroups[i].strategy = item.value;
-                  break;
-                case RESOURCE_NODE_INDEX:
-                  this.threadGroups[i].resourceNodeIndex = item.value;
-                  break;
-                case RATIOS:
-                  this.threadGroups[i].ratios = item.value;
-                  break;
-                case SERIALIZE_THREAD_GROUPS:
-                  this.serializeThreadGroups = item.value;// 所有的线程组值一样
-                  break;
-                case AUTO_STOP:
-                  this.autoStop = item.value;// 所有的线程组值一样
-                  break;
-                case AUTO_STOP_DELAY:
-                  this.autoStopDelay = item.value;// 所有的线程组值一样
-                  break;
-                default:
-                  break;
-              }
-              //
-              this.$set(this.threadGroups[i], "unit", this.threadGroups[i].unit || 'S');
-              this.$set(this.threadGroups[i], "threadType", this.threadGroups[i].threadType || 'DURATION');
-              this.$set(this.threadGroups[i], "iterateNum", this.threadGroups[i].iterateNum || 1);
-              this.$set(this.threadGroups[i], "iterateRampUp", this.threadGroups[i].iterateRampUp || 10);
-              this.$set(this.threadGroups[i], "enabled", this.threadGroups[i].enabled || 'true');
-              this.$set(this.threadGroups[i], "deleted", this.threadGroups[i].deleted || 'false');
-              this.$set(this.threadGroups[i], "onSampleError", this.threadGroups[i].onSampleError || 'continue');
-            });
-          }
-          for (let i = 0; i < this.threadGroups.length; i++) {
-            let tg = this.threadGroups[i];
-            tg.durationHours = Math.floor(tg.duration / 3600);
-            tg.durationMinutes = Math.floor((tg.duration / 60 % 60));
-            tg.durationSeconds = Math.floor((tg.duration % 60));
-          }
-          this.loadIsOver = true;
-          this.resourcePoolChange();
-          this.calculateTotalChart();
-        });
+          .then(response => {
+            let data = JSON.parse(response.data);
+            for (let i = 0; i < this.threadGroups.length; i++) {
+              data[i].forEach(item => {
+                switch (item.key) {
+                  case TARGET_LEVEL:
+                    this.threadGroups[i].threadNumber = item.value;
+                    break;
+                  case RAMP_UP:
+                    this.threadGroups[i].rampUpTime = item.value;
+                    break;
+                  case ITERATE_RAMP_UP:
+                    this.threadGroups[i].iterateRampUp = item.value;
+                    break;
+                  case DURATION:
+                    this.threadGroups[i].duration = item.value;
+                    break;
+                  case DURATION_HOURS:
+                    this.threadGroups[i].durationHours = item.value;
+                    break;
+                  case DURATION_MINUTES:
+                    this.threadGroups[i].durationMinutes = item.value;
+                    break;
+                  case DURATION_SECONDS:
+                    this.threadGroups[i].durationSeconds = item.value;
+                    break;
+                  case UNIT:
+                    this.threadGroups[i].unit = item.value;
+                    break;
+                  case STEPS:
+                    this.threadGroups[i].step = item.value;
+                    break;
+                  case RPS_LIMIT:
+                    this.threadGroups[i].rpsLimit = item.value;
+                    break;
+                  case RPS_LIMIT_ENABLE:
+                    this.threadGroups[i].rpsLimitEnable = item.value;
+                    break;
+                  case THREAD_TYPE:
+                    this.threadGroups[i].threadType = item.value;
+                    break;
+                  case ITERATE_NUM:
+                    this.threadGroups[i].iterateNum = item.value;
+                    break;
+                  case ENABLED:
+                    this.threadGroups[i].enabled = item.value;
+                    break;
+                  case DELETED:
+                    this.threadGroups[i].deleted = item.value;
+                    break;
+                  case HANDLER:
+                    this.threadGroups[i].handler = item.value;
+                    break;
+                  case THREAD_GROUP_TYPE:
+                    this.threadGroups[i].tgType = item.value;
+                    break;
+                  case ON_SAMPLE_ERROR:
+                    this.threadGroups[i].onSampleError = item.value;
+                    break;
+                  case STRATEGY:
+                    this.threadGroups[i].strategy = item.value;
+                    break;
+                  case RESOURCE_NODE_INDEX:
+                    this.threadGroups[i].resourceNodeIndex = item.value;
+                    break;
+                  case RATIOS:
+                    this.threadGroups[i].ratios = item.value;
+                    break;
+                  case SERIALIZE_THREAD_GROUPS:
+                    this.serializeThreadGroups = item.value;// 所有的线程组值一样
+                    break;
+                  case AUTO_STOP:
+                    this.autoStop = item.value;// 所有的线程组值一样
+                    break;
+                  case AUTO_STOP_DELAY:
+                    this.autoStopDelay = item.value;// 所有的线程组值一样
+                    break;
+                  default:
+                    break;
+                }
+                //
+                this.$set(this.threadGroups[i], "unit", this.threadGroups[i].unit || 'S');
+                this.$set(this.threadGroups[i], "threadType", this.threadGroups[i].threadType || 'DURATION');
+                this.$set(this.threadGroups[i], "iterateNum", this.threadGroups[i].iterateNum || 1);
+                this.$set(this.threadGroups[i], "iterateRampUp", this.threadGroups[i].iterateRampUp || 10);
+                this.$set(this.threadGroups[i], "enabled", this.threadGroups[i].enabled || 'true');
+                this.$set(this.threadGroups[i], "deleted", this.threadGroups[i].deleted || 'false');
+                this.$set(this.threadGroups[i], "onSampleError", this.threadGroups[i].onSampleError || 'continue');
+              });
+            }
+            for (let i = 0; i < this.threadGroups.length; i++) {
+              let tg = this.threadGroups[i];
+              tg.durationHours = Math.floor(tg.duration / 3600);
+              tg.durationMinutes = Math.floor((tg.duration / 60 % 60));
+              tg.durationSeconds = Math.floor((tg.duration % 60));
+            }
+            this.resourcePoolChange();
+            this.calculateTotalChart();
+          }).finally(() => {
+        this.loadIsOver = true;
+      });
    },
    getJmxContent() {
      let threadGroups = [];
      getJmxContent(this.testId, this.reportId, this.isShare)
-        .then(response => {
-          response.data.forEach(d => {
-            threadGroups = threadGroups.concat(findThreadGroup(d.jmx, d.name));
-            threadGroups.forEach(tg => {
-              tg.options = {};
+          .then(response => {
+            response.data.forEach(d => {
+              threadGroups = threadGroups.concat(findThreadGroup(d.jmx, d.name));
+              threadGroups.forEach(tg => {
+                tg.options = {};
+              });
            });
+            this.threadGroups = threadGroups;
+            this.$emit('fileChange', threadGroups);
+            this.getLoadConfig();
          });
-          this.threadGroups = threadGroups;
-          this.$emit('fileChange', threadGroups);
-          this.getLoadConfig();
-        });
    },
    resourcePoolChange() {
      let result = this.resourcePools.filter(p => p.id === this.resourcePool);
@ -610,8 +611,8 @@ export default {
        let tg = handler.threadGroups[i];

        if (tg.enabled === 'false' ||
-          tg.deleted === 'true' ||
-          tg.threadType === 'ITERATION') {
+            tg.deleted === 'true' ||
+            tg.threadType === 'ITERATION') {
          continue;
        }
        if (this.getDuration(tg) < tg.rampUpTime) {
@ -736,7 +737,7 @@ export default {
        }

        if (!tg.threadNumber || !tg.duration
-          || !tg.rampUpTime || !tg.step || !tg.iterateNum) {
+            || !tg.rampUpTime || !tg.step || !tg.iterateNum) {
          this.$warning(this.$t('load_test.pressure_config_params_is_empty'));
          this.$emit('changeActive', '1');
          return false;
--- a/test-track/frontend/src/business/plan/common/TestPlanRunModeWithEnv.vue
+++ b/test-track/frontend/src/business/plan/common/TestPlanRunModeWithEnv.vue
@ -267,20 +267,22 @@ export default {
  methods: {
    open(testType, runModeConfig) {
      this.defaultEnvMap = {};
-      if (runModeConfig) {
-        this.runConfig = JSON.parse(runModeConfig);
-        if (!this.runConfig.envMap || JSON.stringify(this.runConfig.envMap) === "{}") {
-          this.isEnvSaved = false;
+      if (this.type === 'plan') {
+        if (runModeConfig) {
+          this.runConfig = JSON.parse(runModeConfig);
+          if (!this.runConfig.envMap || JSON.stringify(this.runConfig.envMap) === "{}") {
+            this.isEnvSaved = false;
+          } else {
+            this.isEnvSaved = true;
+          }
+          this.runConfig.envMap = new Map();
+          this.runConfig.testPlanDefaultEnvMap = {};
+          this.runConfig.onSampleError =
+              this.runConfig.onSampleError === "true" ||
+              this.runConfig.onSampleError === true;
        } else {
-          this.isEnvSaved = true;
+          this.isEnvSaved = false;
        }
-        this.runConfig.envMap = new Map();
-        this.runConfig.testPlanDefaultEnvMap = {};
-        this.runConfig.onSampleError =
-            this.runConfig.onSampleError === "true" ||
-            this.runConfig.onSampleError === true;
-      } else {
-        this.isEnvSaved = false;
      }
      this.runConfig.environmentType = ENV_TYPE.JSON;
      this.runModeVisible = true;
@ -401,24 +403,17 @@ export default {
          let data = res.data;
          if (data) {
            this.projectEnvListMap = data;
-            for (let d in data) {
-              this.projectIds.add(d);
-            }
          }
-          if (this.projectIds.size === 0) {
-            param = {id: this.planId};
-            getPlanCaseProjectIds(param).then((res) => {
-              let data = res.data;
-              if (data) {
-                for (let i = 0; i < data.length; i++) {
-                  this.projectIds.add(data[i]);
-                }
+          param = {id: this.planId};
+          getPlanCaseProjectIds(param).then((res) => {
+            let data = res.data;
+            if (data) {
+              for (let i = 0; i < data.length; i++) {
+                this.projectIds.add(data[i]);
              }
-              this.$refs.envSelectPopover.open();
-            });
-          } else {
+            }
            this.$refs.envSelectPopover.open();
-          }
+          });
        });
      }
    },
--- a/test-track/frontend/src/business/plan/env/EnvSelectPopover.vue
+++ b/test-track/frontend/src/business/plan/env/EnvSelectPopover.vue
@ -1,6 +1,5 @@
 <template>
  <div>
-    <!--    {{ JSON.stringify(eventData) }}-->
    <el-radio-group
      v-model="radio"
      style="width: 100%"
--- a/test-track/frontend/src/business/plan/view/comonents/api/RelevanceApiList.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/api/RelevanceApiList.vue
@ -24,13 +24,17 @@
        @refreshTable="initTable"
        ref="apitable">

-        <template v-slot:header>
-          <ms-environment-select :project-id="projectId" :is-read-only="isReadOnly"
-                                 @setEnvironment="setEnvironment" ref="msEnvironmentSelect"/>
-        </template>
-
      </api-table-list>
-
+      <div>
+        <el-radio-group v-model="envType" style="float: left;margin-top: 8px;">
+          <el-radio label="default">{{ $t("api_test.environment.default_environment") }}</el-radio>
+          <el-radio label="newEnv">{{ $t("api_test.environment.choose_new_environment") }}</el-radio>
+        </el-radio-group>
+        <ms-environment-select v-if="envType==='newEnv'" :project-id="projectId" :is-read-only="isReadOnly"
+                               @setEnvironment="setEnvironment" ref="msEnvironmentSelect"
+                               style="float: left;margin-left: 16px"
+        />
+      </div>
    </api-list-container>

  </div>
@ -60,6 +64,7 @@ export default {
      condition: {
        components: TEST_PLAN_RELEVANCE_API_DEFINITION_CONFIGS
      },
+      envType: 'default',
      result: {},
      screenHeight: 'calc(100vh - 400px)',//屏幕高度,
      tableData: [],
@ -94,6 +99,7 @@ export default {
  },
  created() {
    this.condition.versionId = this.currentVersion;
+
  },
  watch: {
    selectNodeIds() {
@ -112,7 +118,7 @@ export default {
    currentVersion() {
      this.condition.versionId = this.currentVersion;
      this.initTable();
-    }
+    },
  },
  methods: {
    setSelectRow(setSelectRow) {
--- a/test-track/frontend/src/business/plan/view/comonents/api/RelevanceCaseList.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/api/RelevanceCaseList.vue
@ -7,13 +7,6 @@
      <template>
        <slot name="version"></slot>
      </template>
-
-      <ms-environment-select
-        :project-id="projectId"
-        :is-read-only="isReadOnly"
-        @setEnvironment="setEnvironment"
-        ref="msEnvironmentSelect"
-      />
      <ms-search
        :condition.sync="condition"
        v-if="clearOver"
@ -132,6 +125,20 @@
        :page-size.sync="pageSize"
        :total="total"
      />
+      <div>
+        <el-radio-group v-model="envType" style="float: left;margin-top: 8px;">
+          <el-radio label="default">{{ $t("api_test.environment.default_environment") }}</el-radio>
+          <el-radio label="newEnv">{{ $t("api_test.environment.choose_new_environment") }}</el-radio>
+        </el-radio-group>
+        <ms-environment-select
+            :project-id="projectId"
+            :is-read-only="isReadOnly"
+            @setEnvironment="setEnvironment"
+            ref="msEnvironmentSelect"
+            v-if="envType==='newEnv'"
+            style="float: left;margin-left: 16px"
+        />
+      </div>
    </api-list-container>
  </div>
 </template>
@ -141,23 +148,16 @@ import MsTable from "metersphere-frontend/src/components/table/MsTable";
 import MsTableColumn from "metersphere-frontend/src/components/table/MsTableColumn";
 import MsTablePagination from "metersphere-frontend/src/components/pagination/TablePagination";
 import MsTag from "metersphere-frontend/src/components/MsTag";
-import {
-  API_METHOD_COLOUR,
-  CASE_PRIORITY,
-} from "metersphere-frontend/src/model/JsonData";
+import {API_METHOD_COLOUR, CASE_PRIORITY,} from "metersphere-frontend/src/model/JsonData";
 import MsEnvironmentSelect from "metersphere-frontend/src/components/environment/snippet/ext/MsEnvironmentSelect";
 import MsTableAdvSearchBar from "metersphere-frontend/src/components/search/MsTableAdvSearchBar";
-import { TEST_PLAN_RELEVANCE_API_CASE_CONFIGS } from "metersphere-frontend/src/components/search/search-components";
+import {TEST_PLAN_RELEVANCE_API_CASE_CONFIGS} from "metersphere-frontend/src/components/search/search-components";
 import MsSearch from "metersphere-frontend/src/components/search/MsSearch";
 import ApiListContainer from "@/business/plan/view/comonents/api/ApiListContainer";
-import {
-  buildBatchParam,
-  hasLicense,
-  isProjectVersionEnable,
-} from "@/business/utils/sdk-utils";
+import {buildBatchParam, hasLicense, isProjectVersionEnable,} from "@/business/utils/sdk-utils";
 import PriorityTableItem from "@/business/common/tableItems/planview/PriorityTableItem";
-import { apiDefinitionGet } from "@/api/remote/api/api-definition";
-import { testPlanApiCaseRelevanceList } from "@/api/remote/plan/test-plan-api-case";
+import {apiDefinitionGet} from "@/api/remote/api/api-definition";
+import {testPlanApiCaseRelevanceList} from "@/api/remote/plan/test-plan-api-case";

 export default {
  name: "RelevanceCaseList",
@ -177,6 +177,7 @@ export default {
      condition: {
        components: TEST_PLAN_RELEVANCE_API_CASE_CONFIGS,
      },
+      envType: 'default',
      selectCase: {},
      loading: false,
      moduleId: "",
--- a/test-track/frontend/src/business/plan/view/comonents/api/RelevanceScenarioList.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/api/RelevanceScenarioList.vue
@ -1,21 +1,5 @@
 <template>
  <div v-loading="result.loading">
-    <env-group-popover
-      :env-map="projectEnvMap"
-      :project-ids="projectIds"
-      @setProjectEnvMap="setProjectEnvMap"
-      :environment-type.sync="environmentType"
-      :group-id="envGroupId"
-      :is-scenario="false"
-      @setEnvGroup="setEnvGroup"
-      :show-config-button-with-out-permission="
-        showConfigButtonWithOutPermission
-      "
-      :project-list="projectList"
-      ref="envPopover"
-      class="env-popover"
-    />
-
    <mx-version-select
      v-xpack
      :project-id="projectId"
@ -162,6 +146,27 @@
      :page-size.sync="pageSize"
      :total="total"
    />
+    <div>
+      <el-radio-group v-model="envType" style="float: left;margin-top: 18px;">
+        <el-radio label="default">{{ $t("api_test.environment.default_environment") }}</el-radio>
+        <el-radio label="newEnv">{{ $t("api_test.environment.choose_new_environment") }}</el-radio>
+      </el-radio-group>
+      <env-group-popover
+          :env-map="projectEnvMap"
+          :project-ids="projectIds"
+          @setProjectEnvMap="setProjectEnvMap"
+          :environment-type.sync="environmentType"
+          :group-id="envGroupId"
+          :is-scenario="false"
+          @setEnvGroup="setEnvGroup"
+          :show-config-button-with-out-permission="showConfigButtonWithOutPermission"
+          :project-list="projectList"
+          ref="envPopover"
+          class="env-popover"
+          v-if="envType==='newEnv'"
+          style="float: left;margin-left: 16px"
+      />
+    </div>
  </div>
 </template>

@ -172,21 +177,15 @@ import MsTag from "metersphere-frontend/src/components/MsTag"; // import MsApiRe
 import TestPlanScenarioListHeader from "./TestPlanScenarioListHeader";
 import PriorityTableItem from "@/business/common/tableItems/planview/PriorityTableItem";
 import MsTableAdvSearchBar from "metersphere-frontend/src/components/search/MsTableAdvSearchBar";
-import { TEST_PLAN_RELEVANCE_API_SCENARIO_CONFIGS } from "metersphere-frontend/src/components/search/search-components";
-import { ENV_TYPE } from "metersphere-frontend/src/utils/constants";
+import {TEST_PLAN_RELEVANCE_API_SCENARIO_CONFIGS} from "metersphere-frontend/src/components/search/search-components";
+import {ENV_TYPE} from "metersphere-frontend/src/utils/constants";
 import MsTable from "metersphere-frontend/src/components/table/MsTable";
 import MsSearch from "metersphere-frontend/src/components/search/MsSearch";
-import {
-  getOwnerProjects,
-  getVersionFilters,
-} from "@/business/utils/sdk-utils";
+import {getOwnerProjects, getVersionFilters,} from "@/business/utils/sdk-utils";
 import MxVersionSelect from "metersphere-frontend/src/components/version/MxVersionSelect";
-import { getProjectApplicationConfig } from "@/api/project-application";
-import { getApiScenarioEnvByProjectId } from "@/api/remote/api/api-automation";
-import {
-  scenarioRelevanceList,
-  scenarioRelevanceProjectIds,
-} from "@/api/remote/plan/test-plan-scenario";
+import {getProjectApplicationConfig} from "@/api/project-application";
+import {getApiScenarioEnvByProjectId} from "@/api/remote/api/api-automation";
+import {scenarioRelevanceList, scenarioRelevanceProjectIds,} from "@/api/remote/plan/test-plan-scenario";
 import EnvGroupPopover from "@/business/plan/env/EnvGroupPopover";
 import ApiReportStatus from "@/business/plan/view/comonents/report/detail/api/ApiReportStatus";
 import MsApiReportStatus from "@/business/plan/view/comonents/report/detail/api/ApiReportStatus";
@ -225,6 +224,7 @@ export default {
      condition: {
        components: TEST_PLAN_RELEVANCE_API_SCENARIO_CONFIGS,
      },
+      envType: 'default',
      currentScenario: {},
      schedule: {},
      tableData: [],
--- a/test-track/frontend/src/business/plan/view/comonents/api/TestCaseApiRelevance.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/api/TestCaseApiRelevance.vue
@ -123,6 +123,13 @@ export default {
    projectId() {
      this.getVersionOptions();
    },
+    isApiListEnable() {
+      if (this.isApiListEnable) {
+        this.$nextTick(() => {
+          this.refresh();
+        });
+      }
+    }
  },
  mounted() {
    this.getVersionOptions();