feat: a-checkbox替换

src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue

@@ -5,26 +5,25 @@
 <template>
   <div class="action-row mb-12px flex justify-between">
     <div>
-      <a-checkbox
+      <Checkbox
         v-if="dataSource.length > 0"
-        :model-value="checkedAll"
+        :checked="checkedAll"
         :indeterminate="indeterminate"
         class="!pl-13px"
-        @change="handleSelectAll"
-        >全选</a-checkbox
-      >
+        @change="(e) => handleSelectAll(e.target.checked)"
+      >全选</Checkbox>
     </div>
     <div class="flex items-center">
-      <a-button type="outline" class="w-110px mr-12px" size="medium" @click="handleExport">
-        <template #icon> <icon-download /> </template>
+      <Button type="outline" class="w-110px mr-12px" size="medium" @click="handleExport">
+        <template #icon> <icon-download class="mr-8px"/> </template>
         <template #default>导出数据</template>
-      </a-button>
-      <a-button type="outline" class="w-110px" size="medium" @click="openCustomColumn">
+      </Button>
+      <Button type="outline" class="w-110px" size="medium" @click="openCustomColumn">
         <template #icon>
-          <img :src="icon1" width="14" height="14" />
+          <img :src="icon1" width="14" height="14" class="mr-8px"/>
         </template>
         <template #default>自定义列</template>
-      </a-button>
+      </Button>
     </div>
   </div>
 
@@ -115,7 +114,7 @@
           }}
         </template>
         <template v-else-if="column.dataIndex === 'operation'" #cell="{ record }">
-          <a-button type="outline" size="small" @click="handleDetail(record)">详情</a-button>
+          <Button type="outline" size="small" @click="handleDetail(record)">详情</Button>
         </template>
 
         <template v-else-if="column.isRateField" #cell="{ record }">
@@ -145,7 +144,7 @@
       </a-table-column>
       <a-table-column data-index="operation" fixed="right" width="100" title="操作">
         <template #cell="{ record }">
-          <a-button type="outline" size="small" @click="handleDetail(record)">详情</a-button>
+          <Button type="outline" size="small" @click="handleDetail(record)">详情</Button>
         </template>
       </a-table-column>
     </template>
@@ -162,6 +161,7 @@
 <script setup>
 import { ref, computed } from 'vue';
 import { useRouter } from 'vue-router';
+import { Checkbox, Button } from 'ant-design-vue';
 
 import { getCustomColumns } from '@/api/all/common';
 import StatusBox from '@/views/property-marketing/media-account/components/status-select/status-box.tsx';

src/views/property-marketing/media-account/account-dashboard/components/custom-column-modal/index.vue

@@ -3,14 +3,14 @@
  * @Date: 2025-06-30 10:54:49
 -->
 <template>
-  <a-modal
-    v-model:visible="visible"
+  <Modal
+    v-model:open="visible"
     title="自定义列"
     width="960px"
     unmountOnClose
     titleAlign="start"
-    class="custom-table-column-modal-98"
-    @close="close"
+    wrapClassName="custom-table-column-modal-98"
+    @cancel="close"
   >
     <div class="modal-body">
       <!-- 左侧分组 -->
@@ -20,16 +20,16 @@
             <span class="text">{{ group.label }}</span>
           </div>
           <div class="fields">
-            <a-checkbox
+            <Checkbox
               v-for="option in group.columns"
               :key="option.value"
-              :model-value="isCheck(option)"
+              :checked="isCheck(option)"
               :value="option.value"
               :disabled="option.is_require === ENUM_STATUS.NO"
-              @change="(checked) => onCheckChange(checked, option)"
+              @change="(e) => onCheckChange(e.target.checked, option)"
             >
               {{ localFields.find((item) => item.prop === option.value)?.title }}
-            </a-checkbox>
+            </Checkbox>
           </div>
         </div>
       </div>
@@ -65,14 +65,15 @@
 
     <template #footer>
       <div style="text-align: right">
-        <a-button class="mr-8px" size="medium" @click="close">取消</a-button>
-        <a-button type="primary" size="medium" @click="onSubmit">确定</a-button>
+        <Button @click="close">取消</Button>
+        <Button type="primary" @click="onSubmit">确定</Button>
       </div>
     </template>
-  </a-modal>
+  </Modal>
 </template>
 
 <script setup>
+import { Checkbox, Modal, Button } from 'ant-design-vue';
 import { ref, defineExpose } from 'vue';
 import { VueDraggable } from 'vue-draggable-plus';
 
@@ -169,6 +170,7 @@ const removeCheckedField = (value) => {
 
 // 勾选/取消
 const onCheckChange = (checked, option) => {
+  console.log(checked, option);
   if (checked) {
     checkColumns.value.push(option.value);
   } else {

src/views/property-marketing/media-account/account-dashboard/components/custom-column-modal/style.scss

@@ -1,5 +1,5 @@
 .custom-table-column-modal-98 {
-  .arco-modal-body {
+  .ant-modal-body {
     .modal-body {
       height: 504px;
       border-radius: 8px;