自动化规则更新

src/views/efTools/automation/components/adActivityDialog.vue

@@ -105,6 +105,13 @@ const gridOptions = reactive({
     labelField: 'name',
     reserve: true,
     checkStrictly: false,
+    checkMethod: ({ row }) => {
+      if (activeModel.value === 'specified') {
+        // 如果是 specified 模式，只有已选择的行可以被取消选中
+        return row.isSelected;
+      }
+      return true; // 其他模式下都可以选中
+    }
   },
   columns: computed(() => [
     {
@@ -113,7 +120,12 @@ const gridOptions = reactive({
       slots: { default: 'campaignName_default' },
       treeNode: activeModel.value == 'specified' || activeModel.value == 'adGroup'
     },
-    { type: 'checkbox', width: 55, fixed: 'right' },
+    {
+      type: 'checkbox',
+      width: 55,
+      fixed: 'right',
+      slots: activeModel.value == 'specified' ? { header: 'checkbox_header', checkbox: 'checkbox_cell' } : ''
+    },
   ]),
   data: []
 });
@@ -165,13 +177,49 @@ async function fetchAdCampaign() {
 }
 
 // 处理表格复选框选择变化(是否为树形结构)
-const handleGridChange = (event) => {
-  if (activeModel.value == 'specified' || activeModel.value == 'adGroup') {
-    handleSelectionChange(event);
+// const handleGridChange = (event) => {
+//   if (activeModel.value == 'specified' || activeModel.value == 'adGroup') {
+//     handleSelectionChange(event);
+//   } else {
+//     handelSelect(event);
+//   }
+// };
+
+function handleGridChange({ records, row, checked }) {
+  if (activeModel.value === 'specified') {
+    if (row) {
+      if (!checked) {
+        row.isSelected = false;
+        updateSelectedAds();
+      }
+    } else {
+      // 全选/取消全选
+      records.forEach(record => {
+        if (record.isSelected) {
+          record.isSelected = checked;
+        }
+      });
+      updateSelectedAds();
+    }
+  } else if (activeModel.value === 'adGroup') {
+    handleSelectionChange({ records });
   } else {
-    handelSelect(event);
+    handelSelect({ records });
   }
-};
+}
+
+function toggleCheckboxEvent(row) {
+  if (activeModel.value === 'specified') {
+    if (row.isSelected) {
+      // 只有已选择的行可以被取消选中
+      xGridOne.value.setCheckboxRow(row, false);
+      handleGridChange({ records: [row], row, checked: false });
+    }
+  } else {
+    // 其他模式下正常切换复选框状态
+    xGridOne.value.toggleCheckboxRow(row);
+  }
+}
 
 // 非树形结构的表格选择变化
 function handelSelect({ records }) {
@@ -363,7 +411,7 @@ async function confirm() {
     campaignTargetInfo,
     campaignKeywordInfo
   };
-  console.log('requestData',requestData);
+  console.log('requestData', requestData);
   try {
     const response = await updateAdCampaign(requestData);
     if (response.code === 2000) {
@@ -508,6 +556,27 @@ onMounted(() => {
             <span v-else-if="row.adGroupName">已选择定向</span>
             </span>
           </template>
+          <template #checkbox_header="{ checked, indeterminate }">
+        <span class="custom-checkbox" @click.stop="toggleAllCheckboxEvent">
+          <i v-if="indeterminate" class="vxe-icon-square-minus-fill" style="color: #0d84ff"></i>
+          <i v-else-if="checked" class="vxe-icon-square-checked-fill" style="color: #0d84ff"></i>
+          <i v-else class="vxe-icon-checkbox-unchecked" style="color: #0d84ff"></i>
+        </span>
+          </template>
+          <template #checkbox_cell="{ row, checked, indeterminate }">
+            <span class="custom-checkbox" @click.stop="toggleCheckboxEvent(row)">
+              <i v-if="indeterminate" class="vxe-icon-square-minus-fill" style="color: #0d84ff"></i>
+              <i v-else-if="checked" class="vxe-icon-square-checked-fill" style="color: #0d84ff"></i>
+              <el-tooltip v-else
+                          class="box-item"
+                          content="请选择定向"
+                          effect="dark"
+                          placement="top"
+              >
+                <i class="vxe-icon-checkbox-unchecked" style="color: #0d84ff"></i>
+              </el-tooltip>
+            </span>
+          </template>
         </vxe-grid>
         <div class="pagination-container mt-4">
           <el-pagination