🐛 feat<月对比数据>: 修复翻页报错问题

src/views/components/auto/auto-campaigns/view-target-rules.vue

@@ -89,10 +89,11 @@ const gridOptions = reactive({
 });
 
 function handleGridChange({ records, row, checked }) {
-  console.log(12321312312);
+  console.log('=>(view-target-rules.vue:92) checked', checked);
   if (row) {
     if (!checked) {
       row.isSelected = false;
+      console.log('=>(view-target-rules.vue:96) row.isSelected', row.isSelected);
       updateSelectedAds();
     }
   } else {
@@ -108,13 +109,12 @@ function handleGridChange({ records, row, checked }) {
 
 function toggleCheckboxEvent(row) {
 
-    if (row.isSelected) {
-      // 只有已选择的行可以被取消选中
-      xGridOne.value.setCheckboxRow(row, false);
-      handleGridChange({ records: [row], row, checked: false });
-    }
+  if (row.isSelected) {
+    // 只有已选择的行可以被取消选中
+    xGridOne.value.setCheckboxRow(row, false);
+    handleGridChange({ records: [row], row, checked: false });
   }
-
+}
 
 async function fetchAdCampaign() {
   try {
@@ -122,30 +122,38 @@ async function fetchAdCampaign() {
       profileId: props.checkTarget.profileId,
       campaignId: props.checkTarget.campaignId
     });
+
+    // 计算并设置 targetLength
+    resp.data.adGroupInfo = resp.data.adGroupInfo.map(group => ({
+      ...group,
+      targetLength: (group.selectTargetId?.length || 0) + (group.keywordInfo?.length || 0) + (group.campaignTargetInfo?.length || 0)
+    }));
+
     gridOptions.data = [resp.data];
 
-    // // 默认勾选有 selectTargetId 的数据
-    // const adGroupsToCheck = resp.data.adGroupInfo.filter(group =>
-    //     group.selectTargetId && group.selectTargetId.length > 0
-    // );
-    //
-    // // 更新选中的广告
-    // selectedAds.value = [{
-    //   campaignId: resp.data.campaignId,
-    //   campaignType: resp.data.campaignType,
-    //   campaignName: resp.data.campaignName,
-    //   adGroupInfo: adGroupsToCheck
-    // }];
-    //
-    // // 在 nextTick 中设置选中状态，确保表格已经渲染
-    // nextTick(() => {
-    //   if (xGridOne.value) {
-    //     adGroupsToCheck.forEach(group => {
-    //       group.isSelected = true;
-    //       xGridOne.value.setCheckboxRow(group, true);
-    //     });
-    //   }
-    // });
+    // 默认勾选有 selectTargetId 的数据
+    const adGroupsToCheck = resp.data.adGroupInfo.filter(group =>
+        group.selectTargetId && group.selectTargetId.length > 0
+    );
+
+    // 更新选中的广告
+    selectedAds.value = [{
+      campaignId: resp.data.campaignId,
+      campaignType: resp.data.campaignType,
+      campaignName: resp.data.campaignName,
+      adGroupInfo: adGroupsToCheck
+    }];
+    console.log('selectedAds', selectedAds.value);
+
+    // 在 nextTick 中设置选中状态，确保表格已经渲染
+    nextTick(() => {
+      if (xGridOne.value) {
+        adGroupsToCheck.forEach(group => {
+          group.isSelected = true;
+          xGridOne.value.setCheckboxRow(group, true);
+        });
+      }
+    });
   } catch (error) {
     ElMessage.error('请求广告活动数据失败');
   } finally {
@@ -167,7 +175,6 @@ function handleSelectTarget(row) {
     campaignTargetInfo: row.campaignTargetInfo || [],
   };
   SelectTargetVisible.value = true;
-  console.log('SelectTargetVisible', SelectTargetVisible.value);
 }
 
 function updateSelectedAds() {
@@ -177,7 +184,6 @@ function updateSelectedAds() {
         ...ad,
         adGroupInfo: ad.adGroupInfo.filter(group => group.isSelected),
       }));
-  console.log('selectedAds.value', selectedAds.value);
 }
 
 // 选择定向弹窗确认按钮
@@ -199,13 +205,13 @@ function handleConfirm({ campaignInfo, targetType }) {
         group.campaignTargetInfo = campaignInfo;
       }
       group.isSelected = true; // 更新子节点的选择状态
-      group.targetLength = (group.keywordInfo?.length || 0) + (group.campaignTargetInfo?.length || 0);
+      group.targetLength = (group.keywordInfo?.length || 0) + (group.campaignTargetInfo?.length || 0) + (group.selectTargetId?.length || 0);
     }
 
     // 勾选表格1中的对应行，只有在定向大于0时进行勾选
     if (group && group.targetLength > 0) {
       if (xGridOne.value) {
-        xGridOne.value.toggleCheckboxRow(group, true); // 手动勾选复选框
+        xGridOne.value.setCheckboxRow(group, true); // 使用 setCheckboxRow 而不是 toggleCheckboxRow
       }
     }
   }
@@ -215,6 +221,7 @@ function handleConfirm({ campaignInfo, targetType }) {
 
 // 删除选中的广告
 const removeSelectedAd = async (row) => {
+  console.log('=>(view-target-rules.vue:224) row', row);
   const $grid = xGridTwo.value;
   if ($grid) {
     if (row.adGroupId) {
@@ -249,6 +256,14 @@ function removeAllSelectedAds() {
   }
 }
 
+function confirm() {
+  dialogVisible.value = false;
+}
+
+function cancel() {
+  dialogVisible.value = false;
+}
+
 const headerCellStyle = (args) => {
   if (args.rowIndex === 0) {
     return {
@@ -308,7 +323,7 @@ onMounted(() => {
             <span class="flex-container">
               {{ row.adGroupName }}
             <el-button
-                v-if="row.adGroupName && row.selectTargetId.length!==0"
+                v-if="row.adGroupName &&!row.isSelected"
                 class="btn-link"
                 link
                 @click="handleSelectTarget(row)">

src/views/reportManage/TaskManage/index.vue

@@ -1095,7 +1095,7 @@ onMounted(() => {
 
 :deep(.vxe-table--header .vxe-header--row th .vxe-cell,
 .vxe-table--body .vxe-body--row td .vxe-cell) {
-  padding-left: 5px !important;
+  padding-left: 0 !important;
   padding-right: 0 !important;
 }
 </style>

src/views/reportManage/TaskManage/utils/columns.ts

@@ -9,7 +9,7 @@ export const taskColumns = ref([
     fixed: 'left',
     editRender: { autofocus: '.vxe-input--inner' },
     slots: { edit: 'number_edit' },
-    minWidth: 77
+    minWidth: 72
   },
   {
     field: 'platformName',
@@ -18,7 +18,7 @@ export const taskColumns = ref([
     editRender: { autofocus: '.vxe-input--inner' },
     slots: { edit: 'name_edit' },
     align: 'center',
-    minWidth: 100, isEditing: false
+    minWidth: 98, isEditing: false
   },
   {
     field: 'country',

src/views/reportManage/dataCenter/combinedDisplay/components/tableData/monthlyComparativeData.vue

@@ -67,7 +67,7 @@ const gridEvents = {
     if (gridOptions.pagerConfig) {
       gridOptions.pagerConfig.currentPage = currentPage;
       gridOptions.pagerConfig.pageSize = pageSize;
-      fetchMonthlyData(props.taskIds);
+      fetchMonthlyData(taskIds.value);
     }
   },
 };