feat(测试跟踪): 测试计划关联用例列表支持记住跨页选择的记录

--story=1010820 --user=郭雨琦 https://www.tapd.cn/55049933/prong/stories/view/1155049933001010820=worktable_title
2024-12-02 20:19:16 +08:00 · 2023-01-03 18:53:36 +08:00 · 2023-01-03 18:53:36 +08:00 · ba0395075d
commit ba0395075d
parent 0f64b74e7b
6 changed files with 77 additions and 19 deletions
--- a/framework/sdk-parent/frontend/src/components/environment/snippet/ext/ApiTableList.vue
+++ b/framework/sdk-parent/frontend/src/components/environment/snippet/ext/ApiTableList.vue
@ -9,6 +9,9 @@
    <ms-table :data="tableData" :select-node-ids="selectNodeIds" :condition="condition" :page-size="pageSize"
              :total="total" enableSelection @selectCountChange="selectCountChange"
              :screenHeight="screenHeight"
+              row-key="id"
+              :reserve-option="true"
+              :page-refresh="pageRefresh"
              operator-width="170px"
              @order="initTable"
              @filter="search"
@ -103,7 +106,7 @@
        :label="$t('api_test.definition.api_case_number')"/>

    </ms-table>
-    <ms-table-pagination :change="initTable" :current-page.sync="currentPage" :page-size.sync="pageSize"
+    <ms-table-pagination :change="pageChange" :current-page.sync="currentPage" :page-size.sync="pageSize"
                         :total="total"/>

  </span>
@ -165,6 +168,7 @@ export default {
      currentPage: 1,
      pageSize: 10,
      versionEnable: false,
+      pageRefresh: false,
    };
  },
  props: {
@ -190,12 +194,17 @@ export default {
  },
  watch: {
    currentProtocol() {
+      this.pageRefresh = false;
      this.getProtocolFilter();
    },
    projectId() {
+      this.pageRefresh = false;
      this.checkVersionEnable();
      this.getUserFilter();
-    }
+    },
+    selectNodeIds() {
+      this.pageRefresh = false;
+    },
  },
  mounted() {
    if (this.$refs.apitable) {
@ -235,7 +244,11 @@ export default {
      this.currentPage = 1;
      this.initTable();
    },
-    initTable() {
+    pageChange() {
+      this.initTable("page");
+    },
+    initTable(data) {
+      this.pageRefresh = data === "page";
      this.$emit('refreshTable');
    },
    clear() {
--- a/framework/sdk-parent/frontend/src/components/table/MsTable.vue
+++ b/framework/sdk-parent/frontend/src/components/table/MsTable.vue
@ -27,7 +27,9 @@
      @row-click="handleRowClick"
      ref="table"
    >
-      <el-table-column v-if="enableSelection" width="50" type="selection" />
+      <el-table-column v-if="enableSelection && !reserveOption" width="50" type="selection"/>
+
+      <el-table-column v-if="enableSelection && reserveOption" width="50" type="selection" reserve-selection/>

      <ms-table-header-select-popover
        v-if="enableSelection && showSelectAll && !hidePopover"
@ -254,7 +256,22 @@ export default {
      default() {
        return true;
      },
-    }, //开启全选
+    },
+    //开启保留前一页的选项的功能，注意需要与row-key搭配使用，否则不生效
+    reserveOption: {
+      type: Boolean,
+      default() {
+        return false;
+      },
+    },
+    //是否是翻页的刷新，当reserveOption为true时，引用列表页需要在翻页的时候使该属性为true，用以避免clear
+    pageRefresh: {
+      type: Boolean,
+      default() {
+        return false;
+      },
+    },
+    //开启全选
    showSelectAll: {
      type: Boolean,
      default() {
@ -306,7 +323,9 @@ export default {
      if (newVar !== oldVar) {
        this.$nextTick(() => {
          this.setDefaultOrders();
-          this.clear();
+          if (!this.pageRefresh) {
+            this.clear();
+          }
          this.doLayout();
          this.checkTableRowIsSelect();
          this.listenRowDrop();
--- a/test-track/frontend/src/business/plan/view/comonents/api/RelevanceScenarioList.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/api/RelevanceScenarioList.vue
@ -39,6 +39,8 @@
      :total="total"
      :remember-order="true"
      row-key="id"
+      :reserve-option="true"
+      :page-refresh="pageRefresh"
      :row-order-group-id="projectId"
      @order="search"
      @filter="filterSearch"
@ -145,7 +147,7 @@
      />
    </ms-table>
    <ms-table-pagination
-      :change="search"
+      :change="pageChange"
      :current-page.sync="currentPage"
      :page-size.sync="pageSize"
      :total="total"
@ -228,6 +230,7 @@ export default {
      environmentType: ENV_TYPE.JSON,
      envGroupId: "",
      versionFilters: [],
+      pageRefresh: false
    };
  },
  computed: {
@ -257,7 +260,11 @@ export default {
      this.currentPage = 1;
      this.search();
    },
-    search() {
+    pageChange() {
+      this.search("page");
+    },
+    search(data) {
+      this.pageRefresh = data === "page";
      this.projectEnvMap.clear();
      this.projectIds.clear();
      if (!this.projectId) {
@ -358,7 +365,7 @@ export default {
      this.selectRows = this.$refs.scenarioTable.selectRows;
      this.initProjectIds();
      this.$emit("selectCountChange", data);
-    },
+    }
  },
 };
 </script>
--- a/test-track/frontend/src/business/plan/view/comonents/functional/FunctionalRelevance.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/functional/FunctionalRelevance.vue
@ -32,6 +32,9 @@
      :total="page.total"
      :page-size.sync="page.pageSize"
      :screen-height="screenHeight"
+      row-key="id"
+      :reserve-option="true"
+      :page-refresh="pageRefresh"
      @handlePageChange="getTestCases"
      @selectCountChange="setSelectCounts"
      @order="getTestCases"
@ -94,7 +97,7 @@

    </ms-table>

-    <ms-table-pagination :change="getTestCases" :current-page.sync="page.currentPage" :page-size.sync="page.pageSize"
+    <ms-table-pagination :change="pageChange" :current-page.sync="page.currentPage" :page-size.sync="page.pageSize"
                         :total="page.total"/>
  </test-case-relevance-base>

@ -172,6 +175,7 @@ export default {
      ],
      versionFilters: null,
      testCaseTemplate: {},
+      pageRefresh: false
    };
  },
  props: {
@ -253,7 +257,8 @@ export default {
      this.getTestCases();
      this.getProjectNode(this.projectId, this.page.condition);
    },
-    getTestCases() {
+    getTestCases(data) {
+      this.pageRefresh = data === "page";
      let condition = this.page.condition;
      if (this.selectNodeIds && this.selectNodeIds.length > 0) {
        condition.nodeIds = this.selectNodeIds;
@ -265,6 +270,9 @@ export default {
        this.getTableData();
      }
    },
+    pageChange() {
+      this.getTestCases("page")
+    },
    saveCaseRelevance(item) {
      this.isSaving = true;
      let param = {};
@ -311,7 +319,7 @@ export default {
        this.testCaseTemplate = data;
        this.page.condition.components = initTestCaseConditionComponents(this.page.condition, this.testCaseTemplate.customFields);
      });
-    },
+    }
  }
 };
 </script>
--- a/test-track/frontend/src/business/plan/view/comonents/load/TestCaseLoadRelevance.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/load/TestCaseLoadRelevance.vue
@ -23,6 +23,8 @@
      :total="total"
      :remember-order="true"
      row-key="id"
+      :reserve-option="true"
+      :page-refresh="pageRefresh"
      :row-order-group-id="projectId"
      @order="getTestCases"
      @filter="search"
@ -81,7 +83,7 @@
        </template>
      </el-table-column>
    </ms-table>
-    <ms-table-pagination :change="getTestCases" :current-page.sync="currentPage" :page-size.sync="pageSize"
+    <ms-table-pagination :change="pageChange" :current-page.sync="currentPage" :page-size.sync="pageSize"
                         :total="total"/>

  </test-case-relevance-base>
@ -147,6 +149,7 @@ export default {
        {text: 'Error', value: 'Error'}
      ],
      versionFilters: null,
+      pageRefresh: false
    };
  },
  props: {
@ -218,7 +221,11 @@ export default {
      this.testCases = [];
      this.getTestCases(true);
    },
-    getTestCases() {
+    pageChange() {
+      this.getTestCases("page");
+    },
+    getTestCases(data) {
+      this.pageRefresh = data === "page";
      if (this.planId) {
        this.condition.testPlanId = this.planId;
        this.condition.projectId = this.projectId;
@ -231,9 +238,6 @@ export default {
            this.testCases = data.listObject;

            this.selectIds.clear();
-            if (this.$refs.table) {
-              this.$refs.table.clearSelection();
-            }
          });
      }
    },
--- a/test-track/frontend/src/business/plan/view/comonents/ui/RelevanceUiScenarioList.vue
+++ b/test-track/frontend/src/business/plan/view/comonents/ui/RelevanceUiScenarioList.vue
@ -16,6 +16,8 @@
              :total="total"
              :remember-order="true"
              row-key="id"
+              :reserve-option="true"
+              :page-refresh="pageRefresh"
              :row-order-group-id="projectId"
              @order="search"
              @filter="filterSearch"
@ -76,7 +78,7 @@
      <ms-table-column prop="passRate" :label="$t('api_test.automation.passing_rate')"
                       show-overflow-tooltip/>
    </ms-table>
-    <ms-table-pagination :change="search" :current-page.sync="currentPage" :page-size.sync="pageSize"
+    <ms-table-pagination :change="pageChange" :current-page.sync="currentPage" :page-size.sync="pageSize"
                         :total="total"/>
  </div>
 </template>
@ -147,6 +149,7 @@ export default {
      envGroupId: "",
      versionFilters: [],
      fieldsWidth: getCustomTableWidth('TEST_PLAN_UI_SCENARIO_CASE'),
+      pageRefresh: false
    };
  },
  computed: {
@ -176,7 +179,11 @@ export default {
      this.currentPage = 1;
      this.search();
    },
-    search() {
+    pageChange() {
+      this.search("page");
+    },
+    search(data) {
+      this.pageRefresh = data === "page";
      this.projectEnvMap.clear();
      if (!this.projectId) {
        return;