From 2b4e691f4e656e17cb7311d0ab3605c010e118f9 Mon Sep 17 00:00:00 2001
From: rd <>
Date: Wed, 2 Jul 2025 17:55:20 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=8A=95=E6=94=BE=E8=B4=A6=E6=88=B7?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 config/unplugin/auto-import.ts                |   2 +-
 src/api/all/propertyMarketing.ts              |  25 ++
 .../custom-table-column-modal/test.vue        | 389 ------------------
 src/layouts/Basic.vue                         |   2 -
 src/utils/tools.ts                            |   2 +-
 .../components/account-table/constants.ts     |   2 +-
 .../components/account-table/index.vue        |  29 +-
 .../components/filter-block/index.vue         |  23 +-
 .../account-dashboard/constants.ts            |   2 +-
 .../media-account/account-dashboard/index.vue | 212 ++--------
 .../components/account-info/index.vue         |  68 ++-
 .../components/note-table/constants.ts        |  16 +-
 .../components/note-table/index.vue           |  39 +-
 .../media-account/account-detail/constants.ts |   2 +-
 .../constants.ts                              |   0
 .../{account-table => board-table}/index.vue  |  31 +-
 .../{account-table => board-table}/style.scss |   0
 .../components/filter-block/index.vue         |   1 +
 .../components/group-manage-modal/index.vue   |  10 +-
 .../put-account/account-data/index.vue        | 209 +++-------
 .../put-account/account-manage/index.vue      |  18 +-
 21 files changed, 222 insertions(+), 860 deletions(-)
 delete mode 100644 src/components/custom-table-column-modal/test.vue
 rename src/views/property-marketing/put-account/account-data/components/{account-table => board-table}/constants.ts (100%)
 rename src/views/property-marketing/put-account/account-data/components/{account-table => board-table}/index.vue (92%)
 rename src/views/property-marketing/put-account/account-data/components/{account-table => board-table}/style.scss (100%)

diff --git a/config/unplugin/auto-import.ts b/config/unplugin/auto-import.ts
index 783951f..1036483 100644
--- a/config/unplugin/auto-import.ts
+++ b/config/unplugin/auto-import.ts
@@ -21,7 +21,7 @@ export function configAutoImport() {
       '@vueuse/core',
       {
         dayjs: [['default', 'dayjs']],
-        'lodash-es': ['cloneDeep', 'omit', 'pick', 'union'],
+        'lodash-es': ['cloneDeep', 'omit', 'pick', 'union', 'isNumber'],
         '@/hooks': ['useModal'],
       },
     ],
diff --git a/src/api/all/propertyMarketing.ts b/src/api/all/propertyMarketing.ts
index 97db12b..531e513 100644
--- a/src/api/all/propertyMarketing.ts
+++ b/src/api/all/propertyMarketing.ts
@@ -234,3 +234,28 @@ export const putPlacementAccountProjectGroups = (params = {}) => {
 export const deletePlacementAccountProjectGroups = (id: string) => {
   return Http.delete(`/v1/placement-account-project-groups/${id}`);
 };
+
+// 账号笔记-分页
+export const getMediaAccountBoardWorks = (id: string, params = {}) => {
+  return Http.get(`/v1/media-account-boards/${id}/works`, params);
+};
+
+// 投放账号数据-分页
+export const getPlacementAccountData = (params = {}) => {
+  return Http.get('/v1/placement-account-boards', params);
+};
+
+// 投放账号数据-导出
+export const postPlacementAccountDataExport = (params = {}) => {
+  return Http.post('/v1/placement-account-boards/export', params);
+};
+
+// 投放账户项目数据-分页
+export const getPlacementAccountDataList = (params = {}) => {
+  return Http.get('/v1/placement-account-projects', params);
+};
+
+// 投放账户项目数据-导出
+export const postPlacementAccountDataListExport = (params = {}) => {
+  return Http.post('/v1/placement-account-projects/export', params);
+};
diff --git a/src/components/custom-table-column-modal/test.vue b/src/components/custom-table-column-modal/test.vue
deleted file mode 100644
index 7fda6df..0000000
--- a/src/components/custom-table-column-modal/test.vue
+++ /dev/null
@@ -1,389 +0,0 @@
-<!--
- * @Author: RenXiaoDong
- * @Date: 2025-06-30 13:51:40
--->
-<template>
-  <el-drawer v-model:visible="visible" direction="rtl" :wrapperClosable="false" class="com-custom-table-field">
-    <div slot="title" class="drawer-header flex align-items-center">
-      <span class="title">{{ title }}</span>
-      <span class="range">指标最少选择{{ min }}个字段，最多选择{{ max }}个，已选择{{ checkLength }}个</span>
-      <slot></slot>
-      <!-- <div
-          class="font-weight-400 font-size-12 color-primary cursor-pointer"
-          @click="onFieldDescClick"
-        >
-          <span>数据字段说明</span>
-          <i class="el-icon-arrow-right"></i>
-        </div> -->
-    </div>
-
-    <div class="panel-wrapper">
-      <div class="custom-panel left ui-card-block">
-        <!-- <div class="flex justify-content-space-between">
-            <div class="hd">
-              全部字段【{{ columnLength }}个】
-              <span>请至少选择{{ min }}个字段</span
-              ><span v-if="max">至多{{ max }}个字段</span>
-            </div>
-            <slot></slot>
-          </div> -->
-
-        <div class="bd">
-          <template v-for="column in columns">
-            <div v-if="column.children.length" :key="column.prop" class="bd-item">
-              <div class="flex">
-                <p class="title width-fit-content">{{ column.label }}</p>
-                <svg-icon v-if="column.icon" :icon-class="column.icon.name" :style="column.icon.style" class="icon" />
-              </div>
-              <el-checkbox
-                v-for="item in column.children"
-                :key="`${item.prop}${Math.random()}`"
-                :label="item"
-                :disabled="
-                  !column.editable ||
-                  !item.editable ||
-                  (isMax && !getItemChecked(item)) ||
-                  (isMin && getItemChecked(item))
-                "
-                :data-checked="getItemChecked(item)"
-                :checked="getItemChecked(item) || item.selectDisabled"
-                @change="onCheckColumns(item, column.prop, column)"
-              >
-                <div class="flex align-item-center">
-                  <FieldTooltip
-                    v-if="showNewTooltip"
-                    :openDelay="300"
-                    :fieldTooltip="item.fieldTooltip"
-                    :fieldTooltip2="item.fieldTooltip2"
-                    :title="item.label"
-                    :fieldCase="item.fieldCase"
-                  >
-                    <span>{{ item.label }}</span>
-                  </FieldTooltip>
-                  <el-tooltip
-                    v-else
-                    popper-class="ui-overflow-tooltip"
-                    effect="dark"
-                    :content="item.fieldTooltip"
-                    placement="top-start"
-                    :open-delay="300"
-                    :disabled="!item.fieldTooltip"
-                  >
-                    <div slot="content">
-                      <div v-html="item.fieldTooltip"></div>
-                    </div>
-                    <span>{{ item.label }}</span>
-                  </el-tooltip>
-
-                  <svg-icon v-if="item.icon" :icon-class="item.icon.name" :style="item.icon.style" class="icon" />
-                </div>
-              </el-checkbox>
-            </div>
-          </template>
-        </div>
-      </div>
-
-      <div class="custom-panel right ui-card-block">
-        <div class="hd flex justify-content-space-between align-items-center mr14">
-          <span class="hd-check-num">已选({{ `${checkLength}` }})</span>
-
-          <span class="label">长按可拖动调整展示排序</span>
-        </div>
-        <div class="bd">
-          <div class="column-row">
-            <draggable v-model="checkColumns">
-              <transition-group>
-                <div v-for="checkColumn in checkColumns" :key="checkColumn.prop" class="column-item mb16">
-                  <p class="title">{{ checkColumn.label }}</p>
-                  <draggable v-model="checkColumn.children">
-                    <transition-group>
-                      <div v-for="item in checkColumn.children" :key="item.prop" class="column-children-item">
-                        <i class="el-icon-more"></i>
-                        <i class="el-icon-more"></i>
-                        <span class="label">{{ item.label }}</span>
-
-                        <i class="el-icon-close" @click="onDelete(item, checkColumn.prop)"></i>
-                      </div>
-                    </transition-group>
-                  </draggable>
-                </div>
-              </transition-group>
-            </draggable>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div class="submit-row">
-      <el-button @click="visible = false">&nbsp;&nbsp;取消&nbsp;&nbsp;</el-button>
-      <el-button type="primary" @click="onSubmit">&nbsp;&nbsp;确定&nbsp;&nbsp;</el-button>
-    </div>
-  </el-drawer>
-</template>
-
-<script>
-import { cloneDeep } from 'lodash';
-import draggable from 'vuedraggable';
-import { setCustomTableFields } from '@/api/common';
-import { includes } from '@/utils/tools';
-import FieldTooltip from '@/components/CommonTooltip/FieldTooltip';
-
-export default {
-  components: {
-    draggable,
-    FieldTooltip,
-  },
-  props: {
-    title: {
-      type: String,
-      default: '自定义表格字段',
-    },
-    // 表格类型
-    type: {
-      type: String,
-      default: '',
-    },
-    // 默认字段
-    defaultColumns: {
-      type: Array,
-      default: () => [],
-    },
-    // 至少字段
-    min: {
-      type: Number,
-      default: 3,
-    },
-    // 至多字段
-    max: {
-      type: Number,
-      default: null,
-    },
-    showNewTooltip: {
-      type: Boolean,
-      default: false,
-    },
-    other_setting: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  data() {
-    return {
-      checkColumns: [], // 选中字段
-      visible: false,
-    };
-  },
-  computed: {
-    // 选择区，显示字段
-    columns() {
-      const list = cloneDeep(this.defaultColumns);
-      list.forEach((item) => {
-        item.children = item.children.sort((a, b) => {
-          return a.order - b.order;
-        });
-      });
-      return list.sort((a, b) => {
-        return a.order - b.order;
-      });
-    },
-    columnLength() {
-      return this.columns.length || 0;
-    },
-    checkLength() {
-      return this.getFlatColumns().length || 0;
-    },
-    isMin() {
-      return this.min && this.checkLength - 1 < this.min;
-    },
-    // 勾选数量达到最大值
-    isMax() {
-      return this.max && this.checkLength + 1 > this.max;
-    },
-  },
-  watch: {},
-  mounted() {},
-  methods: {
-    includes,
-    init() {
-      this.initCheckColumns();
-    },
-    // 初始化选中字段
-    initCheckColumns() {
-      const list = cloneDeep(this.defaultColumns);
-      this.checkColumns = this.getCheckColumns(list);
-    },
-    getFlatColumns() {
-      const fields = cloneDeep(this.checkColumns);
-      let _flatColumns = [];
-      for (let i = 0; i < fields.length; i++) {
-        const { children, ...props } = fields[i];
-        _flatColumns = [..._flatColumns, ...children];
-      }
-      return _flatColumns;
-    },
-    getItemChecked(item) {
-      return !!this.getFlatColumns().some((column) => column.prop === item.prop);
-    },
-
-    onCheckColumns(data, parentProp, column) {
-      const _target = this.checkColumns.find((v) => v.prop === parentProp);
-      const isChecked = this.getItemChecked(data);
-      const fn = () => {
-        if (this.checkLength === this.max) {
-          this.$message.warning(`指标最多选择${this.max}个`);
-        }
-      };
-
-      // 新增一组
-      if (!_target) {
-        const { children, ...props } = column;
-        this.checkColumns.push({
-          ...props,
-          children: [
-            {
-              ...data,
-              is_show: true,
-            },
-          ],
-        });
-
-        fn();
-        return;
-      }
-      if (isChecked) {
-        if (_target.children.length === 1) {
-          const _index = this.checkColumns.findIndex((v) => v.prop === parentProp);
-          this.checkColumns.splice(_index, 1);
-          return;
-        }
-
-        _target.children.forEach((item, index) => {
-          if (item.prop == data.prop) {
-            _target.children.splice(index, 1);
-          }
-        });
-      } else {
-        _target.children.push({
-          ...data,
-          is_show: true,
-        });
-
-        fn();
-      }
-    },
-    onDelete(data, parentProp) {
-      if (this.isMin) {
-        return this.$message.warning(`最少选择${this.min}个指标`);
-      }
-
-      const _target = this.checkColumns.find((v) => v.prop === parentProp);
-      // 该组最后一项，直接删除整组
-      if (_target.children.length === 1) {
-        const _index = this.checkColumns.findIndex((v) => v.prop === parentProp);
-        this.checkColumns.splice(_index, 1);
-        return;
-      }
-
-      _target.children.forEach((item, index) => {
-        if (item.prop == data.prop) {
-          _target.children.splice(index, 1);
-        }
-      });
-
-      // this.$forceUpdate();
-    },
-    // 获取重新排序后数组
-    getSortedColumns() {
-      let columns = cloneDeep(this.columns); // 复制原数据列
-      const checkColumns = cloneDeep(this.checkColumns); // 复制已选数据列
-
-      // 全部置为false
-      columns.forEach((column) => {
-        if (column.editable) {
-          column.is_show = false;
-          column.children.forEach((item) => item.editable && (item.is_show = false));
-        }
-      });
-
-      // 对父级分组排序
-      checkColumns.forEach((checkColumn) => {
-        const _index = columns.findIndex((column) => column.prop === checkColumn.prop);
-        if (_index > -1) {
-          const item = columns.splice(_index, 1)[0];
-          columns.push(item);
-        }
-      });
-
-      // 对子级元素分组排序
-      for (let i = 0; i < checkColumns.length; i++) {
-        const { prop, children } = checkColumns[i];
-        const _target = columns.find((v) => v.prop === prop);
-        const _allIndex = children.map((item) => item.prop);
-
-        // if (_allIndex === 0) {
-        //   _target.is_show = false;
-        //   break;
-        // }
-
-        _target.is_show = true;
-        // 删除已勾选的数据，再把这些数据插入到数组最后面
-        _target.children = _target.children.filter((item) => !_allIndex.includes(item.prop));
-
-        _target.children = [..._target.children, ...children];
-      }
-      return columns;
-    },
-    async onSubmit() {
-      if (this.max && this.checkLength > this.max) {
-        this.$message.error(`你已经选择${this.checkLength}个,最多不能超过${this.max}个`);
-        return;
-      }
-      if (this.min && this.checkLength < this.min) {
-        this.$message.error(`你已经选择${this.checkLength}个,至少不能少于${this.min}个`);
-        return;
-      }
-      const fields = this.getSortedColumns();
-
-      try {
-        const { code } = await setCustomTableFields({
-          custom_type: this.type,
-          fields,
-          other_setting: this.other_setting,
-        });
-        if (code === 0) this.$message.success('保存成功');
-        this.visible = false;
-        this.$emit('submit', fields);
-      } catch (err) {
-        this.$message.error(err);
-      }
-    },
-    showDrawer() {
-      this.visible = true;
-      this.init();
-    },
-    onFieldDescClick() {
-      this.$emit('onFieldDescClick');
-    },
-    getCheckColumns(list) {
-      let arr = [];
-      for (let i = 0, j = list.length; i < j; i++) {
-        if (list[i].editable) {
-          let obj = { ...list[i], children: [] };
-          for (let l = 0, k = list[i].children.length; l < k; l++) {
-            if (list[i].children[l].is_show && list[i].children[l].editable) {
-              obj.children.push(list[i].children[l]);
-            }
-          }
-          if (obj.children.length) {
-            arr.push(obj);
-          }
-        }
-      }
-      return arr;
-    },
-  },
-};
-</script>
-<style lang="scss" scoped>
-@import './style.scss';
-</style>
diff --git a/src/layouts/Basic.vue b/src/layouts/Basic.vue
index 7b9221c..f3879ae 100644
--- a/src/layouts/Basic.vue
+++ b/src/layouts/Basic.vue
@@ -11,8 +11,6 @@ const appStore = useAppStore();
 const router = useRouter();
 const route = useRoute();
 
-console.log({ appStore });
-
 useResponsive(true);
 const navbarHeight = `72px`;
 const navbar = computed(() => appStore.navbar);
diff --git a/src/utils/tools.ts b/src/utils/tools.ts
index 256ec57..e182c34 100644
--- a/src/utils/tools.ts
+++ b/src/utils/tools.ts
@@ -74,7 +74,7 @@ export function formatTableField(fieldItem: any, rowValue: any, showExactValue =
   };
 
   const _getValue = (value: any) => {
-    if (isNaN(value)) return value;
+    if (!isNumber(value)) return value || '-';
     return formatNumberShow({ value, showExactValue });
   };
 
diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts b/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts
index 48b93fb..4bfb578 100644
--- a/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts
+++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/constants.ts
@@ -43,7 +43,7 @@ export const TABLE_COLUMNS = [
   },
   {
     title: '总赞藏数',
-    dataIndex: 'like_number',
+    dataIndex: 'like_collect_number',
     width: 180,
     tooltip: '账号所有内容的点赞和收藏总数',
     align: 'right',
diff --git a/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue b/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue
index 746dcb1..c7b65ac 100644
--- a/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue
+++ b/src/views/property-marketing/media-account/account-dashboard/components/account-table/index.vue
@@ -4,9 +4,16 @@
 -->
 <template>
   <div class="action-row mb-12px flex justify-between">
-    <a-checkbox :model-value="checkedAll" :indeterminate="indeterminate" class="!pl-13px" @change="handleSelectAll"
-      >全选</a-checkbox
-    >
+    <div>
+      <a-checkbox
+        v-if="dataSource.length > 0"
+        :model-value="checkedAll"
+        :indeterminate="indeterminate"
+        class="!pl-13px"
+        @change="handleSelectAll"
+        >全选</a-checkbox
+      >
+    </div>
     <div class="flex items-center">
       <a-button class="w-110px search-btn mr-12px" size="medium" @click="handleExport">
         <template #icon> <icon-download /> </template>
@@ -35,6 +42,9 @@
     @select="handleSelect"
     @select-all="handleSelectAll"
   >
+    <template #empty>
+      <NoData />
+    </template>
     <template #columns>
       <a-table-column
         v-for="column in TABLE_COLUMNS"
@@ -84,6 +94,9 @@
             </div>
           </div>
         </template>
+        <template v-else-if="column.dataIndex === 'like_collect_number'" #cell="{ record }">
+          {{ formatNumberShow({ value: record.like_number + record.collect_number, showExactValue: true }) }}
+        </template>
         <template v-else-if="column.dataIndex === 'operation'" #cell="{ record }">
           <a-button type="outline" size="small" class="search-btn" @click="handleDetail(record)">详情</a-button>
         </template>
@@ -107,7 +120,7 @@
     </template>
   </a-table>
 
-  <CustomTableColumnModal ref="modalRef" type="media_account" @success="onCustomColumnSuccess" />
+  <CustomTableColumnModal ref="customTableColumnModalRef" type="media_account" @success="onCustomColumnSuccess" />
 </template>
 
 <script setup>
@@ -115,7 +128,7 @@ import { ref, computed } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { STATUS_LIST } from '../../constants';
-import { formatTableField } from '@/utils/tools';
+import { formatTableField, formatNumberShow } from '@/utils/tools';
 import { TABLE_COLUMNS } from './constants';
 import CustomTableColumnModal from '@/components/custom-table-column-modal';
 
@@ -138,7 +151,7 @@ const router = useRouter();
 
 const selectedItems = ref([]);
 const tableRef = ref(null);
-const modalRef = ref(null);
+const customTableColumnModalRef = ref(null);
 
 const checkedAll = computed(
   () => selectedItems.value.length > 0 && selectedItems.value.length === props.dataSource.length,
@@ -167,6 +180,7 @@ const handleDetail = (record) => {
 
 // 处理排序变化
 const handleSorterChange = (column, order) => {
+  console.log(column, order);
   emit('sorterChange', column, order === 'ascend' ? 'asc' : 'desc');
 };
 
@@ -181,11 +195,10 @@ const handleExport = () => {
 
 const resetTable = () => {
   selectedItems.value = [];
-  tableRef.value?.clearSorters();
 };
 
 const openCustomColumn = () => {
-  modalRef.value.open();
+  customTableColumnModalRef.value.open();
 };
 
 const onCustomColumnSuccess = (selectedColumns) => {
diff --git a/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue b/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue
index df72627..74c478a 100644
--- a/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue
+++ b/src/views/property-marketing/media-account/account-dashboard/components/filter-block/index.vue
@@ -5,7 +5,7 @@
 -->
 <template>
   <div class="container">
-    <div class="filter-row flex mb-20px">
+    <div class="filter-row flex">
       <div class="filter-row-item flex items-center">
         <span class="label">账号名称</span>
         <a-space size="medium" class="w-240px">
@@ -42,26 +42,7 @@
           </a-select>
         </a-space>
       </div>
-    </div>
-    <div class="filter-row flex">
-      <div class="filter-row-item flex items-center">
-        <span class="label">时间筛选</span>
-        <a-space class="w-240px">
-          <a-select
-            v-model="query.date_range"
-            size="medium"
-            placeholder="全部"
-            class="w-120px"
-            allow-clear
-            @change="handleSearch"
-          >
-            <template #arrow-icon> <icon-calendar size="16" /> </template>
-            <a-option :value="7" label="近7天">近7天</a-option>
-            <a-option :value="14" label="近14天">近14天</a-option>
-            <a-option :value="30" label="近30天">近30天</a-option>
-          </a-select>
-        </a-space>
-      </div>
+
       <a-button class="w-84px search-btn mr-12px" size="medium" @click="handleSearch">
         <template #icon>
           <icon-search />
diff --git a/src/views/property-marketing/media-account/account-dashboard/constants.ts b/src/views/property-marketing/media-account/account-dashboard/constants.ts
index 916b6a0..ea36b1c 100644
--- a/src/views/property-marketing/media-account/account-dashboard/constants.ts
+++ b/src/views/property-marketing/media-account/account-dashboard/constants.ts
@@ -39,7 +39,7 @@ export const INITIAL_QUERY = {
   status: '',
   operator_id: '',
   group_ids: [],
-  date_range: '',
+  // date_range: '',
   column: '',
   order: '',
 };
diff --git a/src/views/property-marketing/media-account/account-dashboard/index.vue b/src/views/property-marketing/media-account/account-dashboard/index.vue
index e321c56..2138510 100644
--- a/src/views/property-marketing/media-account/account-dashboard/index.vue
+++ b/src/views/property-marketing/media-account/account-dashboard/index.vue
@@ -6,10 +6,12 @@
 <template>
   <div class="account-dashboard-wrap">
     <div class="filter-wrap bg-#fff rounded-8px border-1px border-#D7D7D9 border-solid px-24px pb-20px mb-16px">
-      <div class="top flex h-64px py-10px justify-between items-center mb-19px">
+      <div class="top flex h-64px py-10px justify-between items-center">
         <div class="flex items-center">
           <p class="text-18px font-400 lh-26px color-#211F24 title">数据总览</p>
-          <img :src="icon1" width="14" height="14" class="cursor-pointer ml-4px" />
+          <a-tooltip content="数据纵览">
+            <img :src="icon1" width="14" height="14" class="ml-4px" />
+          </a-tooltip>
         </div>
       </div>
       <div class="overview-row flex">
@@ -42,7 +44,7 @@
         @export="handleExport"
         @sorterChange="handleSorterChange"
       />
-      <div class="pagination-box">
+      <div v-if="pageInfo.total > 0" class="pagination-box">
         <a-pagination
           :total="pageInfo.total"
           size="mini"
@@ -74,201 +76,34 @@ const dataSource = ref([]);
 const overviewData = ref({});
 const selectedRowKeys = ref([]);
 const accountTableRef = ref(null);
-const pageInfo = reactive({
+const pageInfo = ref({
   page: 1,
   pageSize: 20,
-  total: 100,
+  total: 0,
 });
 
-// 测试数据
-const mockData = [
-  {
-    id: 1,
-    name: '抖音官方账号',
-    mobile: '13800138001',
-    account_id: 'douyin_001',
-    holder_name: '张三',
-    operator_id: 1,
-    platform: 0,
-    group_id: 1,
-    status: 1,
-    is_pause: 0,
-    fans_number: 1250000,
-    like_number: 890000,
-    collect_number: 45000,
-    view_number: 5600000,
-    view_chain: 12.5,
-    like_chain: 8.3,
-    ai_evaluation: {
-      status: 1,
-      text: '表现优质 | 建议保持',
-      look_chain: 12.5,
-      like_chain: 8.3,
-    },
-    operator: {
-      id: 1,
-      name: '李运营',
-    },
-    group: {
-      id: 1,
-      name: '抖音组',
-    },
-  },
-  {
-    id: 2,
-    name: '小红书美妆号',
-    mobile: '13800138002',
-    account_id: 'xhs_001',
-    holder_name: '李四',
-    operator_id: 2,
-    platform: 1,
-    group_id: 2,
-    status: 1,
-    is_pause: 1,
-    fans_number: 890000,
-    like_number: 670000,
-    collect_number: 89000,
-    view_number: 3200000,
-    view_chain: -5.2,
-    like_chain: 15.7,
-    ai_evaluation: {
-      status: 2,
-      text: '表现中等 | 建议优化',
-      look_chain: -12.5,
-      like_chain: 8.3,
-    },
-    operator: {
-      id: 2,
-      name: '王运营',
-    },
-    group: {
-      id: 2,
-      name: '小红书组',
-    },
-  },
-  {
-    id: 3,
-    name: '抖音美食号',
-    mobile: '13800138003',
-    account_id: 'douyin_002',
-    holder_name: '王五',
-    operator_id: 1,
-    platform: 0,
-    group_id: 1,
-    status: 0,
-    is_pause: 0,
-    fans_number: 0,
-    like_number: 0,
-    collect_number: 0,
-    view_number: 0,
-    view_chain: 0,
-    like_chain: 0,
-    ai_evaluation: {
-      status: 3,
-      text: '表现较差 | 建议整改',
-      look_chain: -12.5,
-      like_chain: -8.3,
-    },
-    operator: {
-      id: 1,
-      name: '李运营',
-    },
-    group: {
-      id: 1,
-      name: '抖音组',
-    },
-  },
-  {
-    id: 4,
-    name: '小红书穿搭号',
-    mobile: '13800138004',
-    account_id: 'xhs_002',
-    holder_name: '赵六',
-    operator_id: 2,
-    platform: 1,
-    group_id: 2,
-    status: 2,
-    is_pause: 0,
-    fans_number: 450000,
-    like_number: 320000,
-    collect_number: 23000,
-    view_number: 1800000,
-    view_chain: -12.8,
-    like_chain: -8.5,
-    operator: {
-      id: 2,
-      name: '王运营',
-    },
-    group: {
-      id: 2,
-      name: '小红书组',
-    },
-  },
-  {
-    id: 5,
-    name: '抖音科技号',
-    mobile: '13800138005',
-    account_id: 'douyin_003',
-    holder_name: '钱七',
-    operator_id: 3,
-    platform: 0,
-    group_id: 3,
-    status: 1,
-    is_pause: 0,
-    fans_number: 2100000,
-    like_number: 1500000,
-    collect_number: 120000,
-    view_number: 8900000,
-    view_chain: 25.6,
-    like_chain: 18.9,
-    operator: {
-      id: 3,
-      name: '陈运营',
-    },
-    group: {
-      id: 3,
-      name: '科技组',
-    },
-  },
-];
-
 const getOverviewData = async () => {
-  // 使用模拟数据
-  overviewData.value = {
-    total_number: 5,
-    total_fans_number: 4690000,
-    total_like_number: 3380000,
-    total_collect_number: 1230000,
-    in_the_past_seven_days_view_number: 19500000,
-  };
-
-  // 如果有真实接口，可以这样调用：
-  // const { code, data } = await getAccountBoardOverview();
-  // if (code === 200) {
-  //   overviewData.value = data;
-  // }
+  const { code, data } = await getAccountBoardOverview();
+  if (code === 200) {
+    overviewData.value = data;
+  }
 };
 
 const getData = async () => {
-  // 使用模拟数据
-  dataSource.value = mockData;
-  pageInfo.total = mockData.length;
-
-  // 如果有真实接口，可以这样调用：
-  // const { code, data } = await getAccountBoardList(query.value);
-  // if (code === 200) {
-  //   dataSource.value = data.data;
-  //   pageInfo.total = data.total;
-  // }
+  const { code, data } = await getAccountBoardList(query.value);
+  if (code === 200) {
+    dataSource.value = data?.data ?? [];
+    pageInfo.value.total = data.total;
+  }
 };
 
 const onPageChange = (current) => {
-  pageInfo.page = current;
+  pageInfo.value.page = current;
   getData();
 };
 
 const onPageSizeChange = (pageSize) => {
-  pageInfo.pageSize = pageSize;
+  pageInfo.value.pageSize = pageSize;
   reload();
 };
 
@@ -277,15 +112,15 @@ const handleSearch = () => {
 };
 
 const reload = () => {
-  pageInfo.page = 1;
+  pageInfo.value.page = 1;
   getData();
 };
 
 const handleReset = () => {
   selectedRowKeys.value = [];
-  pageInfo.page = 1;
-  pageInfo.pageSize = 20;
-  pageInfo.total = 0;
+  pageInfo.value.page = 1;
+  pageInfo.value.pageSize = 20;
+  pageInfo.value.total = 0;
   query.value = cloneDeep(INITIAL_QUERY);
   accountTableRef.value?.resetTable();
   reload();
@@ -293,7 +128,6 @@ const handleReset = () => {
 
 const handleSelectionChange = (selectedRows) => {
   selectedRowKeys.value = selectedRows;
-  console.log('选中的账号:', selectedRowKeys.value);
 };
 
 const handleExport = () => {
@@ -302,7 +136,7 @@ const handleExport = () => {
   }).then((res) => {
     const { code, data } = res;
     if (code === 200) {
-      console.log(data.download_url);
+      window.open(data.download_url, '_blank');
     }
   });
 };
diff --git a/src/views/property-marketing/media-account/account-detail/components/account-info/index.vue b/src/views/property-marketing/media-account/account-detail/components/account-info/index.vue
index 17e3410..b67262f 100644
--- a/src/views/property-marketing/media-account/account-detail/components/account-info/index.vue
+++ b/src/views/property-marketing/media-account/account-detail/components/account-info/index.vue
@@ -41,7 +41,6 @@
               </span>
             </div>
           </template>
-          <!-- 其他项占1/4宽度 -->
           <template v-else>
             <div class="flex items-center mb-4px">
               <p class="cts !color-#737478 !mr-4px">{{ field.label }}</p>
@@ -50,7 +49,6 @@
               </a-tooltip>
             </div>
             <p class="cts">
-              <!-- 状态特殊渲染 -->
               <template v-if="field.type === 'status'">
                 <span v-if="detailData.status === 1" style="color: #4ad991">正常</span>
                 <span v-else style="color: #ff4d4f">异常</span>
@@ -63,7 +61,6 @@
                   {{ detailData[field.dataIndex] }}%
                 </span>
               </template>
-              <!-- 普通字段，支持多层key -->
               <template v-else>
                 {{ formatTableField(field, detailData, true) }}
               </template>
@@ -89,38 +86,39 @@ import icon4 from '@/assets/img/media-account/icon-success.png';
 
 const route = useRoute();
 const id = route.params.id;
-const detailData = ref({
-  id: 1,
-  name: '抖音官方账号',
-  mobile: '13800138001',
-  account_id: 'douyin_001',
-  holder_name: '张三',
-  operator_id: 1,
-  platform: 0,
-  group_id: 1,
-  status: 1,
-  is_pause: 0,
-  fans_number: 1250000,
-  like_number: 890000,
-  collect_number: 45000,
-  view_number: 5600000,
-  view_chain: -12.5,
-  like_chain: 8.3,
-  ai_evaluation: {
-    status: 1,
-    text: '表现优质 | 建议保持',
-    look_chain: 12.5,
-    like_chain: 8.3,
-  },
-  operator: {
-    id: 1,
-    name: '李运营',
-  },
-  group: {
-    id: 1,
-    name: '抖音组',
-  },
-});
+const detailData = ref({});
+// const detailData = ref({
+//   id: 1,
+//   name: '抖音官方账号',
+//   mobile: '13800138001',
+//   account_id: 'douyin_001',
+//   holder_name: '张三',
+//   operator_id: 1,
+//   platform: 0,
+//   group_id: 1,
+//   status: 1,
+//   is_pause: 0,
+//   fans_number: 1250000,
+//   like_number: 890000,
+//   collect_number: 45000,
+//   view_number: 5600000,
+//   view_chain: -12.5,
+//   like_chain: 8.3,
+//   ai_evaluation: {
+//     status: 1,
+//     text: '表现优质 | 建议保持',
+//     look_chain: 12.5,
+//     like_chain: 8.3,
+//   },
+//   operator: {
+//     id: 1,
+//     name: '李运营',
+//   },
+//   group: {
+//     id: 1,
+//     name: '抖音组',
+//   },
+// });
 
 const getDetail = async () => {
   const { code, data } = await getAccountBoardDetail(id);
diff --git a/src/views/property-marketing/media-account/account-detail/components/note-table/constants.ts b/src/views/property-marketing/media-account/account-detail/components/note-table/constants.ts
index 7225e0f..996567c 100644
--- a/src/views/property-marketing/media-account/account-detail/components/note-table/constants.ts
+++ b/src/views/property-marketing/media-account/account-detail/components/note-table/constants.ts
@@ -5,19 +5,21 @@
 
 export const INITIAL_QUERY = {
   name: '',
-  publish_date: [],
+  published_at: [],
 };
 
 export const TABLE_COLUMNS = [
   {
     title: '笔记标题',
-    dataIndex: 'name',
+    dataIndex: 'title',
     width: 240,
+    fixed: 'left',
   },
   {
     title: '发布日期',
-    dataIndex: 'publish_date',
+    dataIndex: 'published_at',
     width: 160,
+    fixed: 'left',
   },
   {
     title: '曝光量',
@@ -35,28 +37,28 @@ export const TABLE_COLUMNS = [
   },
   {
     title: '点赞量',
-    dataIndex: 'like_count',
+    dataIndex: 'like_number',
     width: 180,
     tooltip: '账号所有内容的总点赞数',
     align: 'right',
   },
   {
     title: '收藏量',
-    dataIndex: 'collect_count',
+    dataIndex: 'collect_number',
     width: 180,
     tooltip: '账号所有内容的总收藏数',
     align: 'right',
   },
   {
     title: '评论数',
-    dataIndex: 'comment_count',
+    dataIndex: 'comment_number',
     width: 180,
     tooltip: '账号所有内容的总评论数',
     align: 'right',
   },
   {
     title: '分享量',
-    dataIndex: 'share_count',
+    dataIndex: 'share_number',
     width: 180,
     tooltip: '账号所有内容的总转发数',
     align: 'right',
diff --git a/src/views/property-marketing/media-account/account-detail/components/note-table/index.vue b/src/views/property-marketing/media-account/account-detail/components/note-table/index.vue
index 0616e47..2595e57 100644
--- a/src/views/property-marketing/media-account/account-detail/components/note-table/index.vue
+++ b/src/views/property-marketing/media-account/account-detail/components/note-table/index.vue
@@ -25,7 +25,7 @@
         <span class="label">发布日期</span>
         <a-space size="medium" class="w-240px">
           <a-range-picker
-            v-model="query.publish_date"
+            v-model="query.published_at"
             size="medium"
             allow-clear
             format="YYYY-MM-DD HH:mm"
@@ -47,6 +47,9 @@
       </a-button>
     </div>
     <a-table :data="dataSource" row-key="id" :pagination="false" :scroll="{ x: '100%' }" class="w-100%" bordered>
+      <template #empty>
+        <NoData />
+      </template>
       <template #columns>
         <a-table-column
           v-for="column in TABLE_COLUMNS"
@@ -62,7 +65,6 @@
         >
           <template #title>
             <div class="flex items-center">
-              <img v-if="column.dataIndex === 'ai_evaluation'" width="16" height="16" :src="icon5" class="mr-4px" />
               <span class="cts mr-4px">{{ column.title }}</span>
               <a-tooltip v-if="column.tooltip" :content="column.tooltip" position="top">
                 <icon-question-circle class="tooltip-icon color-#737478" size="16" />
@@ -71,8 +73,8 @@
           </template>
 
           <template #cell="{ record }">
-            <template v-if="column.dataIndex === 'publish_date'">
-              {{ exactFormatTime(record.publish_date) }}
+            <template v-if="column.dataIndex === 'published_at'">
+              {{ exactFormatTime(record.published_at) }}
             </template>
             <template v-else>
               {{ formatTableField(column, record, true) }}
@@ -81,7 +83,7 @@
         </a-table-column>
       </template>
     </a-table>
-    <div class="pagination-box">
+    <div v-if="pageInfo.total > 0" class="pagination-box">
       <a-pagination
         :total="pageInfo.total"
         size="mini"
@@ -101,14 +103,15 @@
 import { TABLE_COLUMNS, INITIAL_QUERY } from './constants';
 import { useRoute } from 'vue-router';
 import { formatTableField, exactFormatTime } from '@/utils/tools';
+import { getMediaAccountBoardWorks } from '@/api/all/propertyMarketing';
 
 const route = useRoute();
 const id = route.params.id;
 const dataSource = ref([]);
-const pageInfo = reactive({
+const pageInfo = ref({
   page: 1,
   pageSize: 20,
-  total: 100,
+  total: 0,
 });
 
 const query = ref(cloneDeep(INITIAL_QUERY));
@@ -118,34 +121,34 @@ const handleSearch = () => {
 };
 
 const handleReset = () => {
-  pageInfo.page = 1;
-  pageInfo.pageSize = 20;
-  pageInfo.total = 0;
+  pageInfo.value.page = 1;
+  pageInfo.value.pageSize = 20;
+  pageInfo.value.total = 0;
   query.value = cloneDeep(INITIAL_QUERY);
   reload();
 };
 
 const onPageChange = (current) => {
-  pageInfo.page = current;
+  pageInfo.value.page = current;
   getData();
 };
 
 const onPageSizeChange = (pageSize) => {
-  pageInfo.pageSize = pageSize;
+  pageInfo.value.pageSize = pageSize;
   reload();
 };
 
 const reload = () => {
-  pageInfo.page = 1;
+  pageInfo.value.page = 1;
   getData();
 };
 
 const getData = async () => {
-  // const { code, data } = await getAccountBoardList(query.value);
-  // if (code === 200) {
-  //   dataSource.value = data?.list || [];
-  //   pageInfo.total = data.total;
-  // }
+  const { code, data } = await getMediaAccountBoardWorks(query.value);
+  if (code === 200) {
+    dataSource.value = data?.data || [];
+    pageInfo.value.total = data.total;
+  }
 };
 
 onMounted(() => {
diff --git a/src/views/property-marketing/media-account/account-detail/constants.ts b/src/views/property-marketing/media-account/account-detail/constants.ts
index 8c60511..1fb3fcd 100644
--- a/src/views/property-marketing/media-account/account-detail/constants.ts
+++ b/src/views/property-marketing/media-account/account-detail/constants.ts
@@ -7,7 +7,7 @@ export const accountInfoFields = [
     { label: '账号名称', dataIndex: 'name' },
     { label: '项目分组', dataIndex: 'group.name' },
     { label: '状态', dataIndex: 'status', type: 'status' },
-    { label: '运营人员', dataIndex: 'operator.name' },
+    { label: '运营人员', dataIndex: 'operator_name' },
   ],
   [
     { label: 'AI评价', dataIndex: 'ai_evaluation' },
diff --git a/src/views/property-marketing/put-account/account-data/components/account-table/constants.ts b/src/views/property-marketing/put-account/account-data/components/board-table/constants.ts
similarity index 100%
rename from src/views/property-marketing/put-account/account-data/components/account-table/constants.ts
rename to src/views/property-marketing/put-account/account-data/components/board-table/constants.ts
diff --git a/src/views/property-marketing/put-account/account-data/components/account-table/index.vue b/src/views/property-marketing/put-account/account-data/components/board-table/index.vue
similarity index 92%
rename from src/views/property-marketing/put-account/account-data/components/account-table/index.vue
rename to src/views/property-marketing/put-account/account-data/components/board-table/index.vue
index 3ac1133..978bd66 100644
--- a/src/views/property-marketing/put-account/account-data/components/account-table/index.vue
+++ b/src/views/property-marketing/put-account/account-data/components/board-table/index.vue
@@ -4,9 +4,17 @@
 -->
 <template>
   <div class="action-row mb-12px flex justify-between">
-    <a-checkbox :model-value="checkedAll" :indeterminate="indeterminate" class="!pl-13px" @change="handleSelectAll"
-      >全选</a-checkbox
-    >
+    <div>
+      <a-checkbox
+        v-if="dataSource.length > 0"
+        :model-value="checkedAll"
+        :indeterminate="indeterminate"
+        class="!pl-13px"
+        @change="handleSelectAll"
+        >全选</a-checkbox
+      >
+    </div>
+
     <div class="flex items-center">
       <a-button class="w-110px search-btn mr-12px" size="medium" @click="handleExport">
         <template #icon> <icon-download /> </template>
@@ -35,6 +43,9 @@
     @select="handleSelect"
     @select-all="handleSelectAll"
   >
+    <template #empty>
+      <NoData />
+    </template>
     <template #columns>
       <a-table-column
         v-for="column in getColumns()"
@@ -77,7 +88,7 @@
               class="mr-8px icon"
             />
             <div>
-              <p class="cts">{{ record.ai_evaluation?.text }}</p>
+              <p class="cts">{{ record.ai_evaluation?.text || '-' }}</p>
               <p class="cts text-12px lh-20px !color-#939499">
                 {{ `ROI: ${record.ai_evaluation?.look_chain}%  CVR: ${record.ai_evaluation?.like_chain}%` }}
               </p>
@@ -119,7 +130,7 @@
     </template>
   </a-table>
 
-  <CustomTableColumnModal ref="modalRef" type="media_account" @success="onCustomColumnSuccess" />
+  <CustomTableColumnModal ref="modalRef" type="placement_account" @success="onCustomColumnSuccess" />
 </template>
 
 <script setup>
@@ -141,10 +152,6 @@ const props = defineProps({
     type: Array,
     default: () => [],
   },
-  isAccountTab: {
-    type: Boolean,
-    default: false,
-  },
 });
 
 const emit = defineEmits(['selectionChange', 'sorterChange', 'export']);
@@ -195,16 +202,12 @@ const handleExport = () => {
 };
 const getColumns = () => {
   const columns = cloneDeep(TABLE_COLUMNS);
-  // if (!props.isAccountTab) {
-  //   const _target = columns.find((item) => item.dataIndex === 'name');
-  //   _target.title = '项目名称';
-  // }
   return columns;
 };
 
 const resetTable = () => {
   selectedItems.value = [];
-  tableRef.value?.clearSorters();
+  // tableRef.value?.clearSorters();
 };
 
 const openCustomColumn = () => {
diff --git a/src/views/property-marketing/put-account/account-data/components/account-table/style.scss b/src/views/property-marketing/put-account/account-data/components/board-table/style.scss
similarity index 100%
rename from src/views/property-marketing/put-account/account-data/components/account-table/style.scss
rename to src/views/property-marketing/put-account/account-data/components/board-table/style.scss
diff --git a/src/views/property-marketing/put-account/account-data/components/filter-block/index.vue b/src/views/property-marketing/put-account/account-data/components/filter-block/index.vue
index 5def9a3..1c321f9 100644
--- a/src/views/property-marketing/put-account/account-data/components/filter-block/index.vue
+++ b/src/views/property-marketing/put-account/account-data/components/filter-block/index.vue
@@ -100,6 +100,7 @@ const handleReset = () => {
 };
 
 const getGroups = async () => {
+  console.log('getGroups');
   const { code, data } = await getPlacementAccountProjectGroupsList();
   if (code === 200) {
     groups.value = data;
diff --git a/src/views/property-marketing/put-account/account-data/components/group-manage-modal/index.vue b/src/views/property-marketing/put-account/account-data/components/group-manage-modal/index.vue
index bd6254a..b71f848 100644
--- a/src/views/property-marketing/put-account/account-data/components/group-manage-modal/index.vue
+++ b/src/views/property-marketing/put-account/account-data/components/group-manage-modal/index.vue
@@ -81,8 +81,8 @@
       </div>
     </template>
 
-    <AddGroup ref="addGroupRef" @success="getData" />
-    <DeleteGroup ref="deleteGroupRef" @success="getData" />
+    <AddGroup ref="addGroupRef" @success="update" />
+    <DeleteGroup ref="deleteGroupRef" @success="update" />
   </a-modal>
 </template>
 
@@ -98,6 +98,7 @@ import icon1 from '@/assets/img/media-account/icon-delete.png';
 import icon2 from '@/assets/img/media-account/icon-empty.png';
 import icon3 from '@/assets/img/media-account/icon-add.png';
 
+const emit = defineEmits(['update']);
 const visible = ref(false);
 const addGroupRef = ref(null);
 const deleteGroupRef = ref(null);
@@ -133,7 +134,10 @@ const columns = [
   },
   { title: '操作', slotName: 'action', align: 'center', width: 120 },
 ];
-
+const update = () => {
+  getData();
+  emit('update');
+};
 function open() {
   visible.value = true;
   getData();
diff --git a/src/views/property-marketing/put-account/account-data/index.vue b/src/views/property-marketing/put-account/account-data/index.vue
index fb70dd9..dea333e 100644
--- a/src/views/property-marketing/put-account/account-data/index.vue
+++ b/src/views/property-marketing/put-account/account-data/index.vue
@@ -6,8 +6,8 @@
   <div class="account-data-wrap">
     <div class="filter-wrap bg-#fff rounded-8px border-1px border-#D7D7D9 border-solid pb-24px mb-16px">
       <a-tabs v-model="activeTab" @tab-click="handleTabClick">
-        <a-tab-pane :key="1" title="账户"></a-tab-pane>
-        <a-tab-pane :key="2" title="项目"></a-tab-pane>
+        <a-tab-pane key="1" title="账户"></a-tab-pane>
+        <a-tab-pane key="2" title="项目"></a-tab-pane>
         <template v-if="!isAccountTab" #extra>
           <a-button class="w-112px mr-12px search-btn flex items-center" size="medium" @click="handleOpenGroupModal">
             <template #icon>
@@ -17,20 +17,19 @@
           </a-button>
         </template>
       </a-tabs>
-      <FilterBlock ref="filterBlockRef" v-model:query="query" @onSearch="handleSearch" @onReset="handleReset" />
+      <FilterBlock ref="filterBlockRef" v-model:query="query" @onSearch="getData" @onReset="handleReset" />
     </div>
     <div
       class="table-wrap bg-#fff rounded-8px border-1px border-#D7D7D9 border-solid px-24px py-24px flex-1 flex flex-col"
     >
-      <AccountTable
+      <BoardTable
         ref="accountTableRef"
-        :isAccountTab="isAccountTab"
         :dataSource="dataSource"
         @export="handleExport"
         @sorterChange="handleSorterChange"
         @selectionChange="handleSelectionChange"
       />
-      <div class="pagination-box">
+      <div v-if="pageInfo.total > 0" class="pagination-box">
         <a-pagination
           :total="pageInfo.total"
           size="mini"
@@ -45,190 +44,69 @@
       </div>
     </div>
 
-    <GroupManageModal ref="groupManageModalRef" @update="filterBlockRef?.getGroups()" />
+    <GroupManageModal ref="groupManageModalRef" @update="() => filterBlockRef?.getGroups()" />
   </div>
 </template>
 
 <script setup>
 import FilterBlock from './components/filter-block';
-import AccountTable from './components/account-table';
+import BoardTable from './components/board-table';
 import GroupManageModal from './components/group-manage-modal';
+
+import {
+  getPlacementAccountData,
+  postPlacementAccountDataExport,
+  getPlacementAccountDataList,
+  postPlacementAccountDataListExport,
+} from '@/api/all/propertyMarketing';
+
 import { INITIAL_QUERY } from './constants';
 
 import icon2 from '@/assets/img/media-account/icon-group.png';
 
+const selectedRowKeys = ref([]);
+const activeTab = ref('1');
+const accountTableRef = ref(null);
+const groupManageModalRef = ref(null);
+const filterBlockRef = ref(null);
 const query = ref({});
 const dataSource = ref([]);
-const pageInfo = reactive({
+const pageInfo = ref({
   page: 1,
   pageSize: 20,
   total: 100,
 });
-const selectedRowKeys = ref([]);
-const activeTab = ref(1);
-const accountTableRef = ref(null);
-const groupManageModalRef = ref(null);
-const filterBlockRef = ref(null);
 
-const isAccountTab = computed(() => activeTab.value === 1);
+const isAccountTab = computed(() => activeTab.value === '1');
 
-const mockData = [
-  {
-    id: 1,
-    name: '抖音官方账号',
-    mobile: '13800138001',
-    account_id: 'douyin_001',
-    holder_name: '张三',
-    operator_id: 1,
-    platform: 0,
-    group_id: 1,
-    status: 1,
-    is_pause: 0,
-    fans_number: 1250000,
-    like_number: 890000,
-    collect_number: 45000,
-    view_number: 5600000,
-    view_chain: 12.5,
-    like_chain: 8.3,
-    total_consumption: 1000000,
-    balance: 1000000,
-    roi: 1.2,
-    roi_chain: -32.5,
-    cpa: 1.2,
-    cpa_chain: -32.5,
-    conversion_number: 10000,
-    conversion_chain: 12.5,
-    conversion_rate: 1.2,
-    conversion_rate_chain: -2.5,
-    ai_evaluation: {
-      status: 1,
-      text: '表现优质 | 建议保持',
-      look_chain: 12.5,
-      like_chain: 8.3,
-    },
-    operator: {
-      id: 1,
-      name: '李运营',
-    },
-    group: {
-      id: 1,
-      name: '抖音组',
-    },
-  },
-  {
-    id: 2,
-    name: '小红书美妆号',
-    mobile: '13800138002',
-    account_id: 'xhs_001',
-    holder_name: '李四',
-    operator_id: 2,
-    platform: 1,
-    group_id: 2,
-    status: 1,
-    is_pause: 1,
-    fans_number: 890000,
-    like_number: 670000,
-    collect_number: 89000,
-    view_number: 3200000,
-    view_chain: -5.2,
-    like_chain: 15.7,
-    total_consumption: 1000000,
-    balance: 1000000,
-    roi: 1.2,
-    roi_chain: 12.5,
-    cpa: 1.2,
-    cpa_chain: 22.5,
-    conversion_number: 10000,
-    conversion_chain: 12.5,
-    conversion_rate: 1.2,
-    conversion_rate_chain: -2.5,
-    ai_evaluation: {
-      status: 2,
-      text: '表现中等 | 建议优化',
-      look_chain: -12.5,
-      like_chain: 8.3,
-    },
-    operator: {
-      id: 2,
-      name: '王运营',
-    },
-    group: {
-      id: 2,
-      name: '小红书组',
-    },
-  },
-  {
-    id: 3,
-    name: '抖音美食号',
-    mobile: '13800138003',
-    account_id: 'douyin_002',
-    holder_name: '王五',
-    operator_id: 1,
-    platform: 0,
-    group_id: 1,
-    status: 0,
-    is_pause: 0,
-    fans_number: 0,
-    like_number: 0,
-    collect_number: 0,
-    view_number: 0,
-    view_chain: 0,
-    like_chain: 0,
-    total_consumption: 1000000,
-    balance: 1000000,
-    roi: 32898,
-    roi_chain: 12.5,
-    cpa: 1.2,
-    cpa_chain: -32.5,
-    conversion_number: 10000,
-    conversion_chain: 12.5,
-    conversion_rate: 1.2,
-    conversion_rate_chain: -2.5,
-    ai_evaluation: {
-      status: 3,
-      text: '表现较差 | 建议整改',
-      look_chain: -12.5,
-      like_chain: -8.3,
-    },
-    operator: {
-      id: 1,
-      name: '李运营',
-    },
-    group: {
-      id: 1,
-      name: '抖音组',
-    },
-  },
-];
-
-const getData = () => {
-  dataSource.value = mockData;
-  pageInfo.total = mockData.length;
+const getData = async () => {
+  const _fn = isAccountTab.value ? getPlacementAccountData : getPlacementAccountDataList;
+  const { code, data } = await _fn(query.value);
+  if (code === 200) {
+    dataSource.value = data?.data ?? [];
+    pageInfo.value.total = data.total;
+  }
 };
 
 const onPageChange = (current) => {
-  pageInfo.page = current;
+  pageInfo.value.page = current;
   getData();
 };
 
 const onPageSizeChange = (pageSize) => {
-  pageInfo.pageSize = pageSize;
+  pageInfo.value.pageSize = pageSize;
   reload();
 };
 
-const handleSearch = () => {
-  getData();
-};
-
 const reload = () => {
-  pageInfo.page = 1;
+  pageInfo.value.page = 1;
   getData();
 };
 
 const handleReset = () => {
-  pageInfo.page = 1;
-  pageInfo.pageSize = 20;
-  pageInfo.total = 0;
+  pageInfo.value.page = 1;
+  pageInfo.value.pageSize = 20;
+  pageInfo.value.total = 0;
   selectedRowKeys.value = [];
   accountTableRef.value?.resetTable();
   query.value = cloneDeep(INITIAL_QUERY);
@@ -242,14 +120,25 @@ const handleSorterChange = (column, order) => {
 };
 const handleSelectionChange = (selectedRows) => {
   selectedRowKeys.value = selectedRows;
-  console.log('选中的账号:', selectedRowKeys.value);
 };
 
-const handleTabClick = (tab) => {
-  activeTab.value = tab.key;
+const handleTabClick = (key) => {
+  activeTab.value = key;
   handleReset();
 };
 
+const handleExport = () => {
+  const _fn = isAccountTab.value ? postPlacementAccountDataExport : postPlacementAccountDataListExport;
+  _fn({
+    ...query.value,
+  }).then((res) => {
+    const { code, data } = res;
+    if (code === 200) {
+      window.open(data.download_url, '_blank');
+    }
+  });
+};
+
 const handleOpenGroupModal = () => {
   groupManageModalRef.value?.open();
 };
diff --git a/src/views/property-marketing/put-account/account-manage/index.vue b/src/views/property-marketing/put-account/account-manage/index.vue
index 75cb74b..394bdca 100644
--- a/src/views/property-marketing/put-account/account-manage/index.vue
+++ b/src/views/property-marketing/put-account/account-manage/index.vue
@@ -105,7 +105,7 @@ const tagsManageModalRef = ref(null);
 const addAccountModalRef = ref(null);
 const deleteAccountRef = ref(null);
 
-const pageInfo = reactive({
+const pageInfo = ref({
   page: 1,
   pageSize: 8,
   total: 0,
@@ -124,7 +124,7 @@ onMounted(() => {
 });
 
 const getData = async () => {
-  const { page, pageSize } = pageInfo;
+  const { page, pageSize } = pageInfo.value;
   const { code, data, total } = await getPlacementAccounts({
     page,
     page_size: pageSize,
@@ -132,31 +132,31 @@ const getData = async () => {
   });
   if (code === 200) {
     dataSource.value = data?.data ?? [];
-    pageInfo.total = data?.total ?? 0;
+    pageInfo.value.total = data?.total ?? 0;
   }
 };
 const reload = () => {
-  pageInfo.page = 1;
+  pageInfo.value.page = 1;
   getData();
 };
 const handleSearch = () => {
   getData();
 };
 const handleReset = () => {
-  pageInfo.page = 1;
-  pageInfo.pageSize = 20;
-  pageInfo.total = 0;
+  pageInfo.value.page = 1;
+  pageInfo.value.pageSize = 20;
+  pageInfo.value.total = 0;
   selectedItems.value = [];
   query.value = cloneDeep(INITIAL_QUERY);
   reload();
 };
 
 const onPageChange = (current) => {
-  pageInfo.page = current;
+  pageInfo.value.page = current;
   getData();
 };
 const onPageSizeChange = (pageSize) => {
-  pageInfo.pageSize = pageSize;
+  pageInfo.value.pageSize = pageSize;
   reload();
 };