feat（测试用例库）: table列表逻辑修改

src/views/informationBase/viewUseCaseLibrary/index.vue

@@ -67,7 +67,13 @@
     <!--        @queryTable="getList"-->
     <!--      ></right-toolbar>-->
     <!--    </el-row>-->
-    <el-table v-loading="loading" border :scroll-x="'1500px'" :data="tableData">
+    <el-table
+      v-loading="loading"
+      border
+      :scroll-x="'1500px'"
+      :data="tableData"
+      @sort-change="sortChange"
+    >
       <el-table-column type="index" width="55" label="序号" align="center">
         <template slot-scope="scope">
           <span>{{ scope.$index + 1 }}</span>
@@ -79,7 +85,12 @@
         align="left"
         prop="testScenario"
       />
-      <el-table-column label="测试方法" sortable align="left" prop="testType" />
+      <el-table-column
+        label="测试方法"
+        sortable
+        align="left"
+        prop="testMethod"
+      />
       <el-table-column label="用例编号" align="left" prop="displayID" />
       <el-table-column label="用例名称" align="left" prop="name" />
       <!-- <el-table-column label="工具" align="left" prop="tools" /> -->
@@ -129,7 +140,8 @@ export default {
     return {
       queryParams: {
         offset: 0,
-        limit: 10
+        limit: 10,
+        searchKeywords: ''
       },
       total: 0,
       loading: false,
@@ -151,6 +163,10 @@ export default {
         postSort: [
           { required: true, message: '岗位顺序不能为空', trigger: 'blur' }
         ]
+      },
+      orderBy: {
+        field: 'scenario',
+        order: 'DESC'
       }
     }
   },
@@ -160,13 +176,32 @@ export default {
     this.getList()
   },
   methods: {
+    sortChange(column, prop, order) {
+      this.queryParams.offset = 1 // 排序后返回第一页
+      if (column.order) {
+        this.orderBy.order = column.order === 'ascending' ? 'DESC' : 'ASC'
+        this.orderBy.field = column.prop
+        switch (column.prop) {
+          case 'testScenario':
+            this.orderBy.field = 'scenario'
+            break
+          case 'testMethod':
+            this.orderBy.field = 'method'
+            break
+        }
+        this.getList()
+      }
+    },
     handleQuery() {
       this.queryParams.offset = 1
       this.getList()
     },
     resetQuery() {
-      this.queryParams.offset = 1
-      this.queryParams.limit = 10
+      this.queryParams = {
+        offset: 1,
+        limit: 10,
+        searchKeywords: ''
+      }
       this.handleQuery()
     },
     /** 获取测试场景 */
@@ -183,13 +218,17 @@ export default {
     },
     /** 获取测试用例列表 */
     getList() {
-      console.log(this.queryParams.limit)
       const pageNum = (this.queryParams.offset - 1) * this.queryParams.limit
       const data = {
         offset: {
           offset: pageNum,
           limit: this.queryParams.limit
-        }
+        },
+        orderBy: {
+          field: this.orderBy.field,
+          order: this.orderBy.order
+        },
+        search: this.queryParams.searchKeywords
       }
       listTestCase(data).then(res => {
         this.tableData = res.data.useCases

src/views/setting/useCaseLibrary/index.vue

@@ -67,7 +67,13 @@
     <!--        @queryTable="getList"-->
     <!--      ></right-toolbar>-->
     <!--    </el-row>-->
-    <el-table v-loading="loading" border :scroll-x="'1500px'" :data="tableData">
+    <el-table
+      v-loading="loading"
+      border
+      :scroll-x="'1500px'"
+      :data="tableData"
+      @sort-change="sortChange"
+    >
       <el-table-column type="index" width="55" label="序号" align="center">
         <template slot-scope="scope">
           <span>{{ scope.$index + 1 }}</span>
@@ -79,7 +85,12 @@
         align="left"
         prop="testScenario"
       />
-      <el-table-column label="测试方法" sortable align="left" prop="testType" />
+      <el-table-column
+        label="测试方法"
+        sortable
+        align="left"
+        prop="testMethod"
+      />
       <el-table-column label="用例编号" align="left" prop="displayID" />
       <el-table-column label="用例名称" align="left" prop="name" />
       <!-- <el-table-column label="工具" align="left" prop="tools" /> -->
@@ -129,7 +140,8 @@ export default {
     return {
       queryParams: {
         offset: 0,
-        limit: 10
+        limit: 10,
+        searchKeywords: ''
       },
       total: 0,
       loading: false,
@@ -151,6 +163,10 @@ export default {
         postSort: [
           { required: true, message: '岗位顺序不能为空', trigger: 'blur' }
         ]
+      },
+      orderBy: {
+        field: 'scenario',
+        order: 'DESC'
       }
     }
   },
@@ -160,13 +176,32 @@ export default {
     this.getList()
   },
   methods: {
+    sortChange(column, prop, order) {
+      this.queryParams.offset = 1 // 排序后返回第一页
+      if (column.order) {
+        this.orderBy.order = column.order === 'ascending' ? 'DESC' : 'ASC'
+        this.orderBy.field = column.prop
+        switch (column.prop) {
+          case 'testScenario':
+            this.orderBy.field = 'scenario'
+            break
+          case 'testMethod':
+            this.orderBy.field = 'method'
+            break
+        }
+        this.getList()
+      }
+    },
     handleQuery() {
       this.queryParams.offset = 1
       this.getList()
     },
     resetQuery() {
-      this.queryParams.offset = 1
-      this.queryParams.limit = 10
+      this.queryParams = {
+        offset: 1,
+        limit: 10,
+        searchKeywords: ''
+      }
       this.handleQuery()
     },
     /** 获取测试场景 */
@@ -183,13 +218,17 @@ export default {
     },
     /** 获取测试用例列表 */
     getList() {
-      console.log(this.queryParams.limit)
       const pageNum = (this.queryParams.offset - 1) * this.queryParams.limit
       const data = {
         offset: {
           offset: pageNum,
           limit: this.queryParams.limit
-        }
+        },
+        orderBy: {
+          field: this.orderBy.field,
+          order: this.orderBy.order
+        },
+        search: this.queryParams.searchKeywords
       }
       listTestCase(data).then(res => {
         this.tableData = res.data.useCases