🐛 fix: 修复PopoverTable选择产品线后滚动到底部会自动全选的问题

src/views/adManage/sp/components/PopoverFilter.vue

@@ -20,6 +20,11 @@ const searchLoading = ref(false)
 let page = 1
 let limit = 8
 
+// 监听选项变化, 发送请求
+emitter.on('PopoverFilterTable-sendRequest', () => {
+  fetchSearchResult()
+})
+
 // 获取产品线数据
 async function fetchProductLine() {
   try {
@@ -61,33 +66,29 @@ async function fetchSearchResult() {
 }
 
 function handleSelectChange() {
-  page = 1
-  searchResult.value = [];  // 清空搜索结果
+  resetSearchResult()
   emitter.emit('PopoverFilter-productLineSelect', productLineSelect)
   fetchSearchResult()
 }
 
 function searchInputBlur() {
-  page = 1
-  searchResult.value = []
+  resetSearchResult()
   fetchSearchResult()
 }
 
-emitter.on('PopoverFilterTable-sendRequest', () => {
-  console.log('开始发送')
-  fetchSearchResult()
-})
+function resetSearchResult() {
+  page = 1
+  searchResult.value = []
+}
 
 watch(
   searchResult,
   () => {
     emitter.emit('PopoverFilter-searchResult', searchResult)
-    console.log('监听到了searchResult')
   },
   { deep: true }
 )
 
-// 在组件挂载时获取产品线数据
 onMounted(() => {
   fetchProductLine()
 })

src/views/adManage/sp/components/PopoverFilterTable.vue

@@ -22,6 +22,7 @@ let page = 1
 let rightPage = 1
 let limit = 15
 let hasMoreParentAsin = true
+let isFirstTime = true
 
 emitter.on('PopoverFilter-noMoreParenAsin', () => {
   hasMoreParentAsin = false
@@ -32,12 +33,17 @@ emitter.on('PopoverFilter-productLineSelect', (data: any) => {
   gridOptions.data.splice(0)
 })
 
-let isFirstTime = true
 emitter.on('PopoverFilter-searchResult', (data: any) => {
   gridOptions.data = data.value
   isFirstTime = false
 })
 
+emitter.on('PopoverFilter-productLineSelect', () => {
+  vxeRef.value.clearAll()
+  // vxeRef.value.setAllCheckboxRow(false)
+  isScrollSelectAll.value = false
+})
+
 emitter.on('TopFilter', (value: any) => {
   if (value.isVisible?.value) {
     fetchParentAsin()
@@ -102,7 +108,9 @@ async function selectChangeEvent(table: any) {
 
 // 左侧全选事件
 async function selectAllChangeEvent(table: any) {
+  // await vxeRef.value.clearAll()
   // console.log('多选:', table)
+
   if (table.checked) {
     table.records.forEach((record: any) => {
       selectedParentAsins.value.push(record.parentAsin)
@@ -133,10 +141,9 @@ function handleCellClick(table: any) {
   })
 }
 
-// 这个函数用来勾选右侧表格的行
+// 勾选右侧表格的行
 function checkRightTableRows() {
   const rightData = vxeRefRight.value.getTableData().tableData
-
   rightData.forEach((row: any) => {
     const concatValue = searchType === 'sku' ? row.parentAsin + row.sku : row.parentAsin + row.asin
     if (parentAsinsSet.value.has(concatValue)) {
@@ -149,33 +156,36 @@ function checkRightTableRows() {
 async function selectChangeRight(table: any) {
   if (table.checked) {
     getRightSelectedItem()
-    // 新增代码: 查找并选中左侧表格对应的条目
-    const parentAsin = table.row.parentAsin
-    const leftTableData = vxeRef.value.getTableData().tableData
-    const leftRow = leftTableData.find((row: any) => row.parentAsin === parentAsin)
+    // 查找并选中左侧表格对应的条目
+    const leftRow = findParentAsin(table.row.parentAsin)
     if (leftRow) {
       await vxeRef.value.setCheckboxRow(leftRow, true)
     }
   } else {
     emitter.emit('PopoverFilterTable-needDeleteBySearchType', searchType === 'sku' ? table.row.sku : table.row.asin)
-    // 新增代码: 查找并取消选中左侧表格对应的条目
-    const parentAsin = table.row.parentAsin
-    const leftTableData = vxeRef.value.getTableData().tableData
-    const leftRow = leftTableData.find((row: any) => row.parentAsin === parentAsin)
+    // 查找并取消选中左侧表格对应的条目
+    const leftRow = findParentAsin(table.row.parentAsin)
     if (leftRow && table.records.length === 0) {
       await vxeRef.value.setCheckboxRow(leftRow, false)
     }
   }
 }
 
+// 查找左侧表格对应的条目
+function findParentAsin(tableParentAsin: string) {
+  const parentAsin = tableParentAsin
+  const leftTableData = vxeRef.value.getTableData().tableData
+  return leftTableData.find((row: any) => row.parentAsin === parentAsin)
+}
+
 // 右侧表格全选事件
 async function selectAllChangeRight(table: any) {
   if (table.checked) {
     getRightSelectedItem()
     const rightTableData = vxeRefRight.value.getTableData().tableData
+    // 勾选左侧表格中对应的条目
     for (const data of rightTableData) {
-      const leftTableData = vxeRef.value.getTableData().tableData
-      const leftRow = leftTableData.find((row: any) => row.parentAsin === data.parentAsin)
+      const leftRow = findLeftCorrespondItem(data)
       if (leftRow) {
         await vxeRef.value.setCheckboxRow(leftRow, true)
       }
@@ -185,8 +195,7 @@ async function selectAllChangeRight(table: any) {
     emitter.emit('PopoverFilterTable-needDelete', vxeRefRight.value.getTableData().tableData[0].parentAsin)
     const rightTableData = vxeRefRight.value.getTableData().tableData
     for (const data of rightTableData) {
-      const leftTableData = vxeRef.value.getTableData().tableData
-      const leftRow = leftTableData.find((row: any) => row.parentAsin === data.parentAsin)
+      const leftRow = findLeftCorrespondItem(data)
       if (leftRow) {
         await vxeRef.value.setCheckboxRow(leftRow, false)
       }
@@ -194,6 +203,11 @@ async function selectAllChangeRight(table: any) {
   }
 }
 
+function findLeftCorrespondItem(data: any) {
+  const leftTableData = vxeRef.value.getTableData().tableData
+  return leftTableData.find((row: any) => row.parentAsin === data.parentAsin)
+}
+
 // 获取右侧表格选中的数据
 function getRightSelectedItem() {
   const selectedData = vxeRefRight.value.getCheckboxRecords()
@@ -260,7 +274,7 @@ async function handleScroll(event: any) {
         await vxeRef.value.setAllCheckboxRow(true)
       }
     } else {
-      console.log('Reached the bottom, but no more data to load.')
+      // console.log('Reached the bottom, but no more data to load.')
     }
   }
 }