feat(接口自动化): 查看引用

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

@@ -46,12 +46,13 @@
         </el-table-column>
         <el-table-column prop="passingRate" :label="$t('api_test.automation.passing_rate')"
                          show-overflow-tooltip/>
-        <el-table-column :label="$t('commons.operating')" width="180">
+        <el-table-column :label="$t('commons.operating')" width="240">
           <template v-slot:default="{row}">
             <el-button type="text" @click="edit(row)">{{ $t('api_test.automation.edit') }}</el-button>
             <el-button type="text" @click="execute(row)">{{ $t('api_test.automation.execute') }}</el-button>
             <el-button type="text" @click="copy(row)">{{ $t('api_test.automation.copy') }}</el-button>
             <el-button type="text" @click="remove(row)">{{ $t('api_test.automation.remove') }}</el-button>
+            <ms-scenario-extend-buttons :row="row"/>
           </template>
         </el-table-column>
       </el-table>
@@ -76,10 +77,11 @@
   import MsTag from "../../../common/components/MsTag";
   import {getUUID} from "@/common/js/utils";
   import MsApiReportDetail from "../report/ApiReportDetail";
+  import MsScenarioExtendButtons from "@/business/components/api/automation/scenario/ScenarioExtendBtns";
 
   export default {
     name: "MsApiScenarioList",
-    components: {ShowMoreBtn, MsTablePagination, MsTableHeader, MsTag, MsApiReportDetail},
+    components: {MsScenarioExtendButtons, ShowMoreBtn, MsTablePagination, MsTableHeader, MsTag, MsApiReportDetail},
     props: {
       currentProject: Object,
       currentModule: Object,

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

+<template>
+  <el-dialog :close-on-click-modal="false" :title="$t('api_test.automation.case_ref')" :visible.sync="visible"
+             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">{{ item.name }}</div>
+    </div>
+
+    <span>{{ $t('api_test.automation.plan_ref') }}：</span>
+    <div class="refs">
+      <div v-for="(item, index) in planRefs" :key="index" class="el-button--text">{{ item.name }}</div>
+    </div>
+
+    <template v-slot:footer>
+      <div class="dialog-footer">
+        <el-button type="primary" @click="visible = false" @keydown.enter.native.prevent>
+          {{ $t('commons.confirm') }}
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+
+export default {
+  name: "MsReferenceView",
+  components: {},
+  data() {
+    return {
+      visible: false,
+      scenarioLoading: false,
+      scenarioRefs: [],
+      planRefs: []
+    }
+  },
+  methods: {
+    getReferenceData(row) {
+      this.scenarioLoading = true;
+      this.scenarioRefs = [];
+      this.$post("/api/automation/getReference/", row, response => {
+        this.scenarioRefs = response.data;
+        this.scenarioLoading = false;
+      })
+    },
+    open(row) {
+      this.getReferenceData(row);
+      this.visible = true
+    }
+  }
+}
+</script>
+
+<style scoped>
+.refs {
+  min-height: 50px;
+  max-height: 200px;
+  overflow-y: auto;
+  font-size: 12px;
+  padding-bottom: 10px;
+}
+</style>

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

+<template>
+  <el-dropdown @command="handleCommand" class="scenario-ext-btn">
+    <el-link type="primary" :underline="false">
+      <el-icon class="el-icon-more"></el-icon>
+    </el-link>
+    <el-dropdown-menu slot="dropdown">
+      <el-dropdown-item command="ref">{{ $t('api_test.automation.view_ref') }}</el-dropdown-item>
+    </el-dropdown-menu>
+    <ms-reference-view ref="viewRef"/>
+  </el-dropdown>
+</template>
+
+<script>
+import MsReferenceView from "@/business/components/api/automation/scenario/ReferenceView";
+
+export default {
+  name: "MsScenarioExtendButtons",
+  components: {MsReferenceView},
+  props: {
+    row: Object
+  },
+  methods: {
+    handleCommand(cmd) {
+      switch (cmd) {
+        case  "ref":
+          this.$refs.viewRef.open(this.row);
+          break;
+      }
+    },
+  }
+}
+</script>
+
+<style scoped>
+.scenario-ext-btn {
+  margin-left: 10px;
+}
+</style>

frontend/src/i18n/zh-CN.js

@@ -562,6 +562,10 @@ export default {
       execute: "执行",
       copy: "复制",
       remove: "删除",
+      view_ref: "查看引用",
+      case_ref: "用例引用",
+      scenario_ref: "场景引用",
+      plan_ref: "测试计划引用",
       batch_add_plan: "批量添加到测试计划",
       batch_execute: "批量执行",
       scenario: {