feat: 账号数据看板、账户详情、投放数据

src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts

@@ -2,7 +2,7 @@
  * @Author: RenXiaoDong
  * @Date: 2025-06-28 10:33:06
  */
-export const tableColumns = [
+export const TABLE_COLUMNS = [
   {
     title: '账号名称',
     dataIndex: 'name',
@@ -147,7 +147,7 @@ export const tableColumns = [
   {
     title: '操作',
     dataIndex: 'operation',
-    width: 120,
+    width: 100,
     fixed: 'right',
   },
 ];

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

@@ -4,7 +4,9 @@
 -->
 <template>
   <div class="action-row mb-12px flex justify-between">
-    <a-checkbox :model-value="checkedAll" :indeterminate="indeterminate" @change="handleSelectAll">全选</a-checkbox>
+    <a-checkbox :model-value="checkedAll" :indeterminate="indeterminate" class="!pl-13px" @change="handleSelectAll"
+      >全选</a-checkbox
+    >
     <div class="flex items-center">
       <a-button class="w-110px search-btn mr-12px" size="medium" @click="handleExport">
         <template #icon> <icon-download /> </template>
@@ -20,6 +22,7 @@
   </div>
 
   <a-table
+    ref="tableRef"
     :data="dataSource"
     row-key="id"
     :row-selection="rowSelection"
@@ -34,7 +37,7 @@
   >
     <template #columns>
       <a-table-column
-        v-for="column in tableColumns"
+        v-for="column in TABLE_COLUMNS"
         :key="column.dataIndex"
         :data-index="column.dataIndex"
         :fixed="column.fixed"
@@ -82,7 +85,7 @@
           </div>
         </template>
         <template v-else-if="column.dataIndex === 'operation'" #cell="{ record }">
-          <a-button type="outline" size="small" @click="handleDetail(record)">详情</a-button>
+          <a-button type="outline" size="small" class="search-btn" @click="handleDetail(record)">详情</a-button>
         </template>
 
         <template v-else-if="['view_chain', 'like_chain'].includes(column.dataIndex)" #cell="{ record }">
@@ -109,7 +112,7 @@
 import { ref, computed } from 'vue';
 import { STATUS_LIST } from '../../constants';
 import { formatTableField } from '@/utils/tools';
-import { tableColumns } from './constants';
+import { TABLE_COLUMNS } from './constants';
 import { useRouter } from 'vue-router';
 
 import icon1 from '@/assets/img/media-account/icon-custom.png';
@@ -130,6 +133,7 @@ const emit = defineEmits(['selectionChange', 'sorterChange', 'export']);
 const router = useRouter();
 
 const selectedItems = ref([]);
+const tableRef = ref(null);
 
 const checkedAll = computed(
   () => selectedItems.value.length > 0 && selectedItems.value.length === props.dataSource.length,
@@ -169,6 +173,15 @@ const handleSelect = (selectedRowKeys, selectedRows) => {
 const handleExport = () => {
   emit('export');
 };
+
+const resetTable = () => {
+  selectedItems.value = [];
+  tableRef.value?.clearSorters();
+};
+
+defineExpose({
+  resetTable,
+});
 </script>
 
 <style scoped lang="scss">