fix: 修复商品分组选择商品未回显已选中商品问题以及重置问题

src/components/CURD/PageContent.vue

@@ -515,6 +515,7 @@ import {
 import ExcelJS from "exceljs";
 import { reactive, ref } from "vue";
 import type { IContentConfig, IObject, IOperatData } from "./types";
+import { el } from "element-plus/es/locale";
 
 // 定义接收的属性
 const props = defineProps<{
@@ -592,6 +593,45 @@ const selectionData = ref<IObject[]>([]);
 // 删除ID集合 用于批量删除
 const removeIds = ref<(number | string)[]>([]);
 function handleSelectionChange(selection: any[]) {
+  console.log("selectionData.value", selectionData.value);
+
+  // if(selection.length==0){
+  //   selectionData.value=selectionData.value.filter((item) => {
+  //     return pageData.value.find(v=>v[pk]===item[pk])!=undefined
+  //   });
+  // }else{
+  //   selectionData.value=selectionData.value.filter((item) => {
+  //     return pageData.value.find(v=>v[pk]===item[pk])==undefined
+  //   });
+  // }
+
+  //之前有选中，现在置空
+  if (selection.length == 0 && selectionData.value.length > 0) {
+    defaultSelData.value = defaultSelData.value.filter((item) => {
+      return pageData.value.find((v) => v[pk] === item[pk]) != undefined;
+    });
+  }
+  //之前没有选中，现在有
+  if (selection.length > 0 && selectionData.value.length == 0) {
+    defaultSelData.value = selection;
+  }
+  //之前有选中，现在有
+  if (selection.length > 0 && selectionData.value.length > 0) {
+    defaultSelData.value = defaultSelData.value.filter((item) => {
+      const isNowPageData = pageData.value.find((v) => v[pk] === item[pk]);
+      if (isNowPageData) {
+        return selection.find((v) => v[pk] === item[pk]) != undefined;
+      } else {
+        return true;
+      }
+    });
+    for (let i of selection) {
+      if (defaultSelData.value.find((v) => v[pk] === i[pk]) == undefined) {
+        defaultSelData.value.push(i);
+      }
+    }
+  }
+  console.log("defaultSelData.value", defaultSelData.value);
   selectionData.value = selection;
   removeIds.value = selection.map((item) => item[pk]);
 }
@@ -990,6 +1030,9 @@ function fetchPageData(formData: IObject = {}, isRestart = false) {
       } else {
         pageData.value = data;
       }
+      nextTick(() => {
+        setSelectTable(defaultSelData.value);
+      });
     })
     .finally(() => {
       loading.value = false;
@@ -1030,14 +1073,42 @@ function saveXlsx(fileData: BlobPart, fileName: string) {
   document.body.removeChild(downloadLink);
   window.URL.revokeObjectURL(downloadUrl);
 }
-function test(rows: any[]) {
-  console.log(tableRef, "tioshi222222222222222222222");
-  // rows.forEach((row) => {
-  //   tableRef.value!.toggleRowSelection(row, undefined)
-  // })
+function test(rows: any[]) {}
+
+const defaultSelData = ref<IObject[]>([]);
+// 设置默认选择
+function setSelectTable(rows: any[]) {
+  selectionData.value = rows;
+  defaultSelData.value = rows;
+  pageData.value.forEach((element: IObject) => {
+    rows.forEach((row) => {
+      if (element.id == row.id) {
+        console.log("selected", element);
+        tableRef.value!.toggleRowSelection(element, true);
+      }
+    });
+  });
 }
+//清除选中
+function clearSelectTable() {
+  selectionData.value = [];
+  defaultSelData.value = [];
+  pageData.value.forEach((element: IObject) => {
+    tableRef.value!.toggleRowSelection(element, false);
+  });
+}
+
 // 暴露的属性和方法
-defineExpose({ fetchPageData, exportPageData, getFilterParams, getselectTable, pagination, test });
+defineExpose({
+  clearSelectTable,
+  fetchPageData,
+  exportPageData,
+  getFilterParams,
+  getselectTable,
+  pagination,
+  test,
+  setSelectTable,
+});
 </script>
 
 <style lang="scss" scoped>