refacotr: 场景引用列表优化

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

@@ -208,9 +208,7 @@
         <ms-api-customize :request="customizeRequest" @addCustomizeApi="addCustomizeApi"/>
       </el-drawer>
       <!--场景导入 -->
-      <el-drawer :visible.sync="scenarioVisible" :destroy-on-close="true" direction="ltr" :withHeader="false" :title="$t('api_test.automation.scenario_import')" style="overflow: auto" :modal="false" size="90%">
+      <scenario-relevance @save="addScenario" ref="scenarioRelevance"/>
-        <ms-import-api-scenario @addScenario="addScenario"/>
-      </el-drawer>
 
       <!-- 环境 -->
       <api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@@ -241,7 +239,6 @@
   import MsIfController from "./IfController";
   import MsApiAssertions from "../../definition/components/assertion/ApiAssertions";
   import MsApiExtract from "../../definition/components/extract/ApiExtract";
-  import MsApiDefinition from "./api/ApiDefinition";
   import MsApiComponent from "./ApiComponent";
   import {ELEMENTS, ELEMENT_TYPE} from "./Setting";
   import MsApiCustomize from "./ApiCustomize";
@@ -257,6 +254,7 @@
   import InputTag from 'vue-input-tag'
   import "@/common/css/material-icons.css"
   import ScenarioApiRelevance from "./api/ScenarioApiRelevance";
+  import ScenarioRelevance from "./api/ScenarioRelevance";
 
   export default {
     name: "EditApiScenario",
@@ -265,13 +263,13 @@
       currentScenario: {},
     },
     components: {
+      ScenarioRelevance,
       ScenarioApiRelevance,
       ApiEnvironmentConfig,
       MsScenarioParameters,
       MsApiReportDetail,
       MsInputTag, MsRun,
       MsApiScenarioComponent,
-      MsImportApiScenario,
       MsJsr233Processor,
       MsConstantTimer,
       MsIfController,
@@ -488,7 +486,8 @@
             this.customizeVisible = true;
             break;
           case ELEMENT_TYPE.scenario:
-            this.scenarioVisible = true;
+            // this.scenarioVisible = true;
+            this.$refs.scenarioRelevance.open();
             break;
           default:
             this.$refs.apiImport.open();
@@ -546,8 +545,7 @@
         this.customizeRequest = {};
         this.sort();
         this.reload();
-      }
+      },
-      ,
       addScenario(arr) {
         if (arr && arr.length > 0) {
           arr.forEach(item => {
@@ -562,8 +560,7 @@
         this.sort();
         this.reload();
         this.scenarioVisible = false;
-      }
+      },
-      ,
       setApiParameter(item, refType, referenced) {
         let request = {};
         if (Object.prototype.toString.call(item.request).indexOf("String") > 0) {

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

@@ -108,38 +108,6 @@
         setModuleOptions(data) {
           this.moduleOptions = data;
         },
-
-        saveCaseRelevance() {
-
-          let param = {};
-          let url = '';
-          let environmentId = undefined;
-          let selectIds = [];
-          if (this.isApiListEnable) {
-            url = '/api/definition/relevance';
-            environmentId = this.$refs.apiList.environmentId;
-            selectIds = Array.from(this.$refs.apiList.selectRows).map(row => row.id);
-          } else {
-            url = '/api/testcase/relevance';
-            environmentId = this.$refs.apiCaseList.environmentId;
-            selectIds = Array.from(this.$refs.apiCaseList.selectRows).map(row => row.id);
-          }
-
-          if (!environmentId) {
-            this.$warning(this.$t('api_test.environment.select_environment'));
-            return;
-          }
-          param.planId = this.planId;
-          param.selectIds = selectIds;
-          param.environmentId = environmentId;
-          this.result = this.$post(url, param, () => {
-            this.$success(this.$t('commons.save_success'));
-            this.$emit('refresh');
-            this.refresh();
-            this.$refs.baseRelevance.close();
-          });
-        },
-
         refresh() {
           if (this.isApiListEnable) {
             this.$refs.apiList.initTable();
@@ -147,7 +115,6 @@
             this.$refs.apiCaseList.initTable();
           }
         },
-
       }
     }
 </script>

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

@@ -0,0 +1,138 @@
+<template>
+  <el-dialog class="api-relevance" :title="$t('test_track.plan_view.relevance_test_case')"
+             :visible.sync="dialogVisible"
+             width="60%"
+             :close-on-click-modal="false"
+             top="50px">
+
+    <ms-container>
+      <ms-aside-container :enable-aside-hidden="false">
+        <ms-api-scenario-module
+          @nodeSelectEvent="nodeChange"
+          @refreshTable="refresh"
+          @setModuleOptions="setModuleOptions"
+          @enableTrash="false"
+          :is-read-only="true"
+          ref="nodeTree"/>
+      </ms-aside-container>
+
+      <ms-main-container>
+        <ms-api-scenario-list
+          :select-node-ids="selectNodeIds"
+          :referenced="true"
+          :trash-enable="false"
+          @selection="setData"
+          ref="apiScenarioList"/>
+      </ms-main-container>
+    </ms-container>
+
+    <template v-slot:footer>
+      <el-button type="primary" @click="copy" @keydown.enter.native.prevent>复制</el-button>
+      <el-button type="primary" @click="reference" @keydown.enter.native.prevent>引用</el-button>
+    </template>
+
+  </el-dialog>
+</template>
+
+<script>
+    import ScenarioRelevanceCaseList from "./ScenarioRelevanceCaseList";
+    import MsApiModule from "../../../definition/components/module/ApiModule";
+    import MsContainer from "../../../../common/components/MsContainer";
+    import MsAsideContainer from "../../../../common/components/MsAsideContainer";
+    import MsMainContainer from "../../../../common/components/MsMainContainer";
+    import ScenarioRelevanceApiList from "./ScenarioRelevanceApiList";
+    import MsApiScenarioModule from "../ApiScenarioModule";
+    import MsApiScenarioList from "../ApiScenarioList";
+    import {getUUID} from "../../../../../../common/js/utils";
+    export default {
+      name: "ScenarioRelevance",
+      components: {
+        MsApiScenarioList,
+        MsApiScenarioModule,
+        MsMainContainer, MsAsideContainer, MsContainer},
+      data() {
+          return {
+            dialogVisible: false,
+            result: {},
+            currentProtocol: null,
+            selectNodeIds: [],
+            moduleOptions: {},
+            isApiListEnable: true,
+
+            currentScenario: [],
+            currentScenarioIds: [],
+          }
+      },
+      methods: {
+        reference() {
+          let scenarios = [];
+          if (!this.currentScenario || this.currentScenario.length < 1) {
+            this.$emit('请选择场景');
+            return;
+          }
+          this.currentScenario.forEach(item => {
+            let obj = {id: item.id, name: item.name, type: "scenario", referenced: 'REF', resourceId: getUUID()};
+            scenarios.push(obj);
+          });
+          this.$emit('save', scenarios);
+          this.close();
+        },
+        copy() {
+          let scenarios = [];
+          if (!this.currentScenarioIds || this.currentScenarioIds.length < 1) {
+            this.$emit('请选择场景');
+            return;
+          }
+          this.result = this.$post("/api/automation/getApiScenarios/", this.currentScenarioIds, response => {
+            if (response.data) {
+              response.data.forEach(item => {
+                let scenarioDefinition = JSON.parse(item.scenarioDefinition);
+                let obj = {id: item.id, name: item.name, type: "scenario", referenced: 'Copy', resourceId: getUUID(), hashTree: scenarioDefinition.hashTree};
+                scenarios.push(obj);
+              });
+              this.$emit('save', scenarios);
+              this.close();
+            }
+          })
+        },
+        close() {
+          this.refresh();
+          this.dialogVisible = false;
+        },
+        open() {
+          this.dialogVisible = true;
+          if (this.$refs.apiScenarioList) {
+            this.$refs.apiScenarioList.search();
+          }
+        },
+        nodeChange(node, nodeIds, pNodes) {
+          this.selectNodeIds = nodeIds;
+        },
+        handleProtocolChange(protocol) {
+          this.currentProtocol = protocol;
+        },
+        setModuleOptions(data) {
+          this.moduleOptions = data;
+        },
+        refresh() {
+            this.$refs.apiScenarioList.search();
+        },
+        setData(data) {
+          this.currentScenario = Array.from(data).map(row => row);
+          this.currentScenarioIds = Array.from(data).map(row => row.id);
+        },
+      }
+    }
+</script>
+
+<style scoped>
+
+  .ms-aside-container {
+    border: 0px;
+  }
+
+  .api-relevance >>> .el-dialog__body {
+    padding: 10px 20px;
+  }
+
+</style>