refactor(接口场景): 场景导入api时，选中数量显示在表格上边

frontend/src/business/components/api/automation/scenario/api/ApiRelevance.vue

@@ -24,6 +24,7 @@
       :select-node-ids="selectNodeIds"
       :is-api-list-enable="isApiListEnable"
       @isApiListEnableChange="isApiListEnableChange"
+      @selectCountChange="setSelectCounts"
       ref="apiList">
       <template v-slot:version>
         <version-select v-xpack :project-id="projectId" :default-version="currentVersion"
@@ -40,6 +41,7 @@
       :select-node-ids="selectNodeIds"
       :is-api-list-enable="isApiListEnable"
       @isApiListEnableChange="isApiListEnableChange"
+      @selectCountChange="setSelectCounts"
       ref="apiCaseList">
       <template v-slot:version>
         <version-select v-xpack :project-id="projectId" :default-version="currentVersion"
@@ -48,6 +50,9 @@
     </scenario-relevance-case-list>
 
     <template v-slot:headerBtn>
+      <!--  显示数量    -->
+      <table-select-count-bar :count="selectCounts" style="float: left; margin: 5px;"/>
+
       <el-button type="primary" @click="copy" :loading="buttonIsWorking" @keydown.enter.native.prevent size="mini">
         {{ $t('commons.copy') }}
       </el-button>
@@ -69,6 +74,7 @@ import ScenarioRelevanceApiList from "./RelevanceApiList";
 import RelevanceDialog from "../../../../track/plan/view/comonents/base/RelevanceDialog";
 import TestCaseRelevanceBase from "@/business/components/track/plan/view/comonents/base/TestCaseRelevanceBase";
 import {hasLicense} from "@/common/js/utils";
+import TableSelectCountBar from "@/business/components/api/automation/scenario/api/TableSelectCountBar";
 
 const requireComponent = require.context('@/business/components/xpack/', true, /\.vue$/);
 const VersionSelect = requireComponent.keys().length > 0 ? requireComponent("./version/VersionSelect.vue") : {};
@@ -76,6 +82,7 @@ const VersionSelect = requireComponent.keys().length > 0 ? requireComponent("./v
 export default {
   name: "ApiRelevance",
   components: {
+    TableSelectCountBar,
     'VersionSelect': VersionSelect.default,
     TestCaseRelevanceBase,
     RelevanceDialog,
@@ -102,6 +109,7 @@ export default {
       projectId: "",
       versionFilters: [],
       currentVersion: null,
+      selectCounts: null,
     };
   },
   watch: {
@@ -172,6 +180,7 @@ export default {
     },
     isApiListEnableChange(data) {
       this.isApiListEnable = data;
+      this.selectCounts = 0;
     },
     currentVersionChange(currentVersion) {
       this.currentVersion = currentVersion || null;
@@ -213,6 +222,9 @@ export default {
         });
       }
     },
+    setSelectCounts(data) {
+      this.selectCounts = data;
+    },
   }
 };
 </script>

frontend/src/business/components/api/automation/scenario/api/RelevanceApiList.vue

@@ -20,7 +20,7 @@
         :current-protocol="currentProtocol"
         :screen-height="screenHeight"
         @setSelectRow="setSelectRow"
-        @selectCountChange="setSelectCounts"
+        @selectCountChange="selectCountChange"
         @refreshTable="initTable"
         ref="apitable">
 
@@ -33,7 +33,6 @@
 
     </api-list-container>
 
-    <table-select-count-bar :count="selectCounts"/>
   </div>
 
 </template>
@@ -42,7 +41,6 @@
 
 import ApiListContainer from "../../../definition/components/list/ApiListContainer";
 import MsEnvironmentSelect from "../../../definition/components/case/MsEnvironmentSelect";
-import TableSelectCountBar from "./TableSelectCountBar";
 import {buildBatchParam} from "@/common/js/tableUtils";
 import {
   TEST_PLAN_RELEVANCE_API_DEFINITION_CONFIGS,
@@ -53,7 +51,6 @@ export default {
   name: "RelevanceApiList",
   components: {
     ApiTableList,
-    TableSelectCountBar,
     MsEnvironmentSelect,
     ApiListContainer,
   },
@@ -68,7 +65,6 @@ export default {
       environmentId: "",
       total: 0,
       selectRows: new Set(),
-      selectCounts: 0
     };
   },
   props: {
@@ -129,8 +125,8 @@ export default {
     setSelectRow(setSelectRow) {
       this.selectRows = setSelectRow;
     },
-    setSelectCounts(data) {
-      this.selectCounts = data;
+    selectCountChange(data) {
+      this.$emit('selectCountChange', data);
     },
     isApiListEnableChange(data) {
       this.$emit('isApiListEnableChange', data);

frontend/src/business/components/api/automation/scenario/api/RelevanceCaseList.vue

@@ -20,6 +20,7 @@
                 :total="total" enableSelection
                 :screenHeight="screenHeight"
                 @refresh="initTable"
+                @selectCountChange="selectCountChange"
                 operator-width="170px"
                 ref="table"
       >
@@ -86,8 +87,6 @@
                            :total="total"/>
     </api-list-container>
 
-    <table-select-count-bar :count="selectRows.size"/>
-
   </div>
 
 </template>
@@ -107,7 +106,6 @@ import {API_METHOD_COLOUR, CASE_PRIORITY} from "../../../definition/model/JsonDa
 import ApiListContainer from "../../../definition/components/list/ApiListContainer";
 import PriorityTableItem from "../../../../track/common/tableItems/planview/PriorityTableItem";
 import MsEnvironmentSelect from "../../../definition/components/case/MsEnvironmentSelect";
-import TableSelectCountBar from "./TableSelectCountBar";
 import {_filter, _sort, buildBatchParam} from "@/common/js/tableUtils";
 import MsTableAdvSearchBar from "@/business/components/common/components/search/MsTableAdvSearchBar";
 import {TEST_PLAN_RELEVANCE_API_CASE_CONFIGS} from "@/business/components/common/components/search/search-components";
@@ -116,7 +114,6 @@ import {hasLicense} from "@/common/js/utils";
 export default {
   name: "RelevanceCaseList",
   components: {
-    TableSelectCountBar,
     MsEnvironmentSelect,
     PriorityTableItem,
     ApiListContainer,
@@ -226,6 +223,9 @@ export default {
     isApiListEnableChange(data) {
       this.$emit('isApiListEnableChange', data);
     },
+    selectCountChange(data) {
+      this.$emit('selectCountChange', data);
+    },
     initTable(projectId) {
       this.condition.status = "";
       this.condition.moduleIds = this.selectNodeIds;