测试计划关联报告前端修改

test-ui/src/api/test/planDefect.js

@@ -0,0 +1,13 @@
+import request from '@/utils/request'
+
+const api = {
+  delRelDefect: 'testPlan/defect/list',
+}
+
+export function delRelDefect(data) {
+  return request({
+    url: api.delRelDefect,
+    method: 'post',
+    data
+  })
+}

test-ui/src/views/test/testplan/defects/testDefects.vue

@@ -0,0 +1,341 @@
+<template>
+  <div class="app-container">
+    <!-- 顶部导航 -->
+    <el-row :gutter="10">
+      <el-col :span="24">
+        <el-header class="header">
+          <div class="head1">
+            <span style="font-size: 18px; font-weight: bold; margin-right: 20px;">[{{ title }}]关联缺陷列表</span>
+          </div>
+          <div class="head2">
+            <el-input :placeholder="placeholderText" v-model="query" class="input-with-select" clearable>
+              <el-select v-model="select" slot="prepend" placeholder="请选择" style="width: 80px;">
+                <el-option label="概要" value="1"></el-option>
+                <el-option label="ID" value="2"></el-option>
+              </el-select>
+              <el-button slot="append" icon="el-icon-search" @click="handleQuery"></el-button>
+            </el-input>
+            <el-button
+              type="primary"
+              size="medium"
+              style="margin-right: 10px;"
+              @click="handleCollapse(!activeNames.includes('1'))"
+            >高级筛选
+            </el-button>
+            <el-button icon="el-icon-plus" type="primary" size="medium" style="margin-left: 10px;" @click="relateCaseVue">
+              关联缺陷
+            </el-button>
+            <el-button
+              type="danger"
+              plain
+              icon="el-icon-delete"
+              size="medium"
+              :disabled="multiple"
+              @click="handleDelete"
+            >批量删除</el-button>
+          </div>
+        </el-header>
+      </el-col>
+    </el-row>
+
+    <el-collapse v-model="activeNames">
+      <el-collapse-item class="collapse-search" name="1">
+        <el-form ref="queryForm" :model="queryParams" label-width="110px">
+          <el-row :gutter="10" class="high-search">
+            <el-form-item label="创建时间">
+              <el-date-picker
+                v-model="queryParams.createTime"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="yyyy-MM-dd"
+              ></el-date-picker>
+            </el-form-item>
+            <el-form-item label="负责人">
+              <el-select v-model="queryParams.manager" placeholder="请选择" clearable filterable>
+                <simple-options :options="managerList"/>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="优先级">
+              <el-select v-model="queryParams.priority" placeholder="请选择" clearable filterable>
+                <simple-options :options="dict.type.priority_level"/>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" size="mini" icon="el-icon-search" @click="handleAdvancedSearch">搜索</el-button>
+              <el-button icon="el-icon-refresh" size="mini" @click="resetAdvancedFilter">重置</el-button>
+            </el-form-item>
+          </el-row>
+        </el-form>
+      </el-collapse-item>
+    </el-collapse>
+
+    <!-- 标签页 -->
+    <el-tabs v-model="activeTab" @tab-click="handleTabClick" style="margin-top: 10px;">
+      <el-tab-pane :label="'冒烟测试'" name="0"></el-tab-pane>
+      <el-tab-pane :label="'功能测试'" name="1"></el-tab-pane>
+      <el-tab-pane :label="'回归测试'" name="2"></el-tab-pane>
+      <el-tab-pane :label="'准生产验证'" name="3"></el-tab-pane>
+      <el-tab-pane :label="'生产验证'" name="4"></el-tab-pane>
+
+      <el-Table v-loading="loading" :data="list" @selection-change="handleSelectionChange">
+        <el-table-column type="selection"/>
+        <el-table-column prop="caseName" label="ID" align="center"/>
+        <el-table-column prop="executeResult" label="概要" align="center"/>
+        <el-table-column prop="createBy" label="状态" align="center"/>
+        <el-table-column prop="executeBy" label="经办人" align="center"/>
+        <el-table-column prop="executeTime" label="严重程度" align="center"/>
+        <el-table-column prop="createTime" label="创建时间" align="center"/>
+        <el-table-column label="操作" align="left" fixed="right">
+          <template slot-scope="scope">
+            <el-button size="mini" type="text" icon="el-icon-delete" @click.native.stop="handleDelete(scope.row)">删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-Table>
+    </el-tabs>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <el-dialog title="关联缺陷" :visible.sync="open" width="1000px"  v-loading="submitLoading" append-to-body>
+      <el-table  v-loading="relLoading" :data="relList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection"/>
+        <el-table-column prop="caseName" label="ID" align="center"/>
+        <el-table-column prop="executeResult" label="概要" align="center"/>
+        <el-table-column prop="createBy" label="状态" align="center"/>
+        <el-table-column prop="executeBy" label="经办人" align="center"/>
+        <el-table-column prop="executeTime" label="严重程度" align="center"/>
+        <el-table-column prop="createTime" label="创建时间" align="center"/>
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="open = false">取 消</el-button>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {getPlanCaseList, saveRelate} from "@/api/test/planCase";
+import SimpleOptions from "@/components/FormItem/option/SimpleOptions.vue";
+import RelateCase from "@/views/test/testplan/execute/relateCase.vue";
+import page1 from "../../case/detail/page1.vue";
+import {runTestPlanCase} from "../../../../api/test/planCase";
+import {delRelDefect} from "@/api/test/planDefect";
+
+export default {
+  name: 'project',
+  components: {page1, SimpleOptions, RelateCase},
+  dicts: ['priority_level', 'project_source', 'project_type', 'status'],
+  props: {
+    planId: {
+      type: String,
+      default: ''
+    },
+    name: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      select: '1',
+      query: '',
+      activeTab: '0',
+      total: 0,
+      list: [],
+      relList: [],
+      title: '',
+      // 选中数组
+      ids: [],
+      isExecuteVisible: true,
+      // 非多个禁用
+      multiple: true,
+      // 遮罩层
+      loading: false,
+      relLoading: false,
+      submitLoading: false,
+      //弹窗
+      open: false,
+      selectedRows: [],
+      selectedData: [],
+      managerList: [],
+      queryParams: {
+        caseName: '',
+        planId: '',
+        type: 0,
+        pageNum: 1,
+        pageSize: 10,
+      },
+      activeNames: [], // 控制 collapse 的展开状态
+    };
+  },
+  created() {
+    this.queryParams.planId = this.planId;
+    this.title = this.name;
+    // this.getList();
+  },
+  computed: {
+    placeholderText() {
+      return this.select === '1' ? '请输入缺陷概要搜索' : '请输入缺陷ID搜索';
+    },
+  },
+  methods: {
+    // 展开/折叠
+    handleCollapse(val) {
+      this.activeNames = val ? ['1'] : [];
+    },
+    handleSelectionChange(selection) {
+      this.selectedRows = selection;
+      this.ids = selection.map(item => item.id)
+      this.multiple = !selection.length
+    },
+    handleTabClick(tab) {
+      this.ids = [];
+      this.multiple = false;
+      this.activeTab = tab.name;
+      this.queryParams.type = parseInt(this.activeTab, 10);
+      this.getList();
+    },
+    // 搜索
+    handleQuery() {
+      this.getList();
+    },
+    relateCaseVue() {
+      this.open = true;
+      this.reset();
+      this.$refs.relateCase.getList()
+    },
+    /** 查询列表 */
+    getList() {
+      this.loading = true;
+      const queryParams = {
+        ...this.queryParams
+      }
+      getPlanDefectList(queryParams).then(list => {
+        this.list = list.rows;
+        this.total = list.total;
+        if (this.total > 0) {
+          this.isExecuteVisible = false;
+        } else {
+          this.isExecuteVisible = true;
+        }
+        this.loading = false
+      })
+    },
+    handleRunAll() {
+      this.loading = true;
+      const queryParams = {
+        planId: this.queryParams.planId,
+        type: this.queryParams.type
+      }
+      this.$modal.confirm('是否确认执行全部接口用例？').then(function () {
+        return runTestPlanCase(queryParams);
+      }).then((res) => {
+        this.$modal.msgSuccess("提交执行成功");
+        this.open = true;
+        this.loading = false;
+      });
+    },
+    // 表单重置
+    reset() {
+      this.selectedRows = [];
+      this.ids = [];
+      this.multiple = false;
+    },
+    submitForm() {
+      const form = {
+        ...this.queryParams,
+        testCaseIdList: this.$refs.relateCase.getSelectedCaseIds()
+      }
+      this.submitLoading = true
+      saveRelate(form)
+      .then(() => {
+        this.$message.success('关联成功')
+        this.open = false
+      })
+      .catch(() => {
+        this.$message.error('关联失败')
+      })
+      .finally(() => {
+        this.submitLoading = false
+        this.open = false
+        this.getList()
+      })
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除关联缺陷？').then(function () {
+        return delRelDefect(ids);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.input-with-select {
+  background-color: #ffffff;
+  width: 300px;
+}
+
+.collapse-search {
+  ::v-deep .el-collapse-item__header {
+    display: none;
+  }
+}
+
+.high-search {
+  display: flex;
+  justify-content: space-between;
+  padding-top: 40px;
+  background-color: rgb(248, 248, 249);
+}
+
+.header {
+  padding: 10px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.head1 {
+  display: flex;
+  align-items: center;
+}
+
+.head2 {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  justify-content: flex-end;
+  column-gap: 10px;
+}
+
+.el-dialog .el-form {
+  width: 100%;
+}
+
+.el-dialog .el-form-item {
+  margin-bottom: 20px;
+}
+
+.el-dialog .el-textarea {
+  width: 100%;
+}
+
+.basic-information {
+  background-color: rgb(248, 248, 249) !important;
+}
+</style>

test-ui/src/views/test/testplan/overview.vue

@@ -33,7 +33,7 @@
     <probably-view :planId="planId" v-show="activeIndex === '1'"></probably-view>
     <case-execute :planId="planId" :name="testTitle" v-show="activeIndex === '2'"></case-execute>
     <case-report :planId="planId" v-show="activeIndex === '3'"></case-report>
-    <test-defects v-show="activeIndex === '4'"></test-defects>
+    <test-defects :planId="planId" :name="testTitle" v-show="activeIndex === '4'"></test-defects>
     <test-setting v-show="activeIndex === '5'"></test-setting>
   </div>
 </template>