feat: 更换Pagination组件

src/hooks/useTableSelectionWithPagination.ts

@@ -63,14 +63,17 @@ export function useTableSelectionWithPagination(options: UseTableSelectionWithPa
     options.onSelectChange?.();
   };
 
-  const onPageChange = (page: number) => {
+  const onPageChange = (page: number, pageSize:number) => {
+    // console.log('onPageChange', page, pageSize);
     pageInfo.value.page = page;
+    pageInfo.value.page_size = pageSize;
     options.onPageChange?.(page);
   };
-  const onPageSizeChange = (size: number) => {
+  const onPageSizeChange = (current: number, size: number) => {
-    pageInfo.value.page_size = size;
+    // console.log('onPageSizeChange', current, size);
-    pageInfo.value.page = 1;
+    // pageInfo.value.page_size = size;
-    options.onPageSizeChange?.(size);
+    // pageInfo.value.page = 1;
+    // options.onPageSizeChange?.(size);
   };
   const resetPageInfo = () => {
     pageInfo.value = cloneDeep(DEFAULT_PAGE_INFO)

src/views/material-center/components/finished-products/manuscript/check-list/components/manuscript-check-table/index.vue

@@ -151,7 +151,7 @@ const props = defineProps({
     default: () => [],
   },
   rowSelection: {
-    type: Array,
+    type: Object,
     default: () => {},
   },
   selectedRowKeys: {

src/views/material-center/components/finished-products/manuscript/check-list/index.vue

@@ -46,16 +46,15 @@
         @selectAll="handleSelectAll"
       />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -64,7 +63,7 @@
   </div>
 </template>
 <script lang="jsx" setup>
-import { Button } from 'ant-design-vue';
+import { Button, Pagination } from 'ant-design-vue';
 import { Message as AMessage } from '@arco-design/web-vue';
 import FilterBlock from './components/filter-block';
 import ManuscriptCheckTable from './components/manuscript-check-table';
@@ -88,7 +87,6 @@ const {
   pageInfo,
   rowSelection,
   onPageChange,
-  onPageSizeChange,
   resetPageInfo,
   selectedRowKeys,
   selectedRows,
@@ -99,9 +97,6 @@ const {
   onPageChange: () => {
     getData();
   },
-  onPageSizeChange: () => {
-    getData();
-  },
 });
 const router = useRouter();
 const tableColumns = ref([]);

src/views/material-center/components/finished-products/manuscript/list/index.vue

@@ -8,16 +8,15 @@
     >
       <ManuscriptTable :dataSource="dataSource" @sorterChange="handleSorterChange" @delete="handleDelete" />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -27,7 +26,7 @@
 </template>
 <script lang="jsx" setup>
 import { defineComponent } from 'vue';
-import { Button, Pagination } from '@arco-design/web-vue';
+import { Button, Pagination } from 'ant-design-vue';
 import FilterBlock from './components/filter-block';
 import ManuscriptTable from './components/manuscript-table';
 import DeleteManuscriptModal from './components/manuscript-table/delete-manuscript-modal.vue';
@@ -36,13 +35,10 @@ import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPa
 import { getWorksPage } from '@/api/all/generationWorkshop.ts';
 import { INITIAL_QUERY, EnumCheckStatus } from '@/views/material-center/components/finished-products/manuscript/list/constants.ts';
 
-const { dataSource, pageInfo, onPageChange, onPageSizeChange, resetPageInfo } = useTableSelectionWithPagination({
+const { dataSource, pageInfo, onPageChange, resetPageInfo } = useTableSelectionWithPagination({
   onPageChange: () => {
     getData();
   },
-  onPageSizeChange: () => {
-    getData();
-  },
 });
 const query = ref(cloneDeep(INITIAL_QUERY));
 const addManuscriptModalRef = ref(null);

src/views/material-center/components/raw-material/index.vue

@@ -1,6 +1,6 @@
 <script lang="tsx">
 import { provide } from 'vue';
-import { Tabs, TabPane, Button } from 'ant-design-vue';
+import { Tabs, TabPane, Button, Pagination } from 'ant-design-vue';
 import { TABS_LIST, RawMaterialType, INITIAL_QUERY, TABLE_COLUMNS } from './constants';
 import FilterBlock from './components/filter-block/index.vue';
 import RawMaterialTable from './components/table/index.vue';
@@ -16,7 +16,6 @@ export default defineComponent({
       pageInfo,
       rowSelection,
       onPageChange,
-      onPageSizeChange,
       selectedRowKeys,
       selectedRows,
       handleSelect,
@@ -26,9 +25,6 @@ export default defineComponent({
       onPageChange: () => {
         getData();
       },
-      onPageSizeChange: () => {
-        getData();
-      },
     });
 
     const deleteRawMaterialModalRef = ref(null);
@@ -130,16 +126,15 @@ export default defineComponent({
           />
           {pageInfo.value.total > 0 && (
             <div class="pagination-row">
-              <a-pagination
+              <Pagination
                 total={pageInfo.value.total}
-                size="mini"
+                size="small"
-                show-total
+                showTotal={(total: number) => `共 ${total} 条记录`}
-                show-jumper
+                showSizeChanger
-                show-page-size
+                showQuickJumper
                 current={pageInfo.value.page}
                 pageSize={pageInfo.value.page_size}
                 onChange={onPageChange}
-                onPageSizeChange={onPageSizeChange}
               />
             </div>
           )}

src/views/property-marketing/brands/brand-materials/index.vue

@@ -108,16 +108,16 @@
       </Table>
 
       <div class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.pageSize"
+          :pageSize="pageInfo.pageSize"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
+          :hideOnSinglePage="false"
         />
       </div>
     </div>
@@ -128,7 +128,7 @@
 import { ref, computed, reactive, onMounted } from 'vue';
 import { Message } from '@arco-design/web-vue';
 import { IconDelete } from '@arco-design/web-vue/es/icon';
-import { Button, Modal, Space, Form, FormItem, Input, Table } from 'ant-design-vue';
+import { Button, Modal, Space, Form, FormItem, Pagination, Input, Table } from 'ant-design-vue';
 const { TextArea } = Input;
 
 import {
@@ -199,15 +199,12 @@ const handleReset = () => {
   reload();
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.page = current;
+  pageInfo.pageSize = pageSize;
   handleSearch();
 };
 
-const onPageSizeChange = (pageSize) => {
-  pageInfo.pageSize = pageSize;
-  reload();
-};
 const deleteBrand = (id) => {
   console.log(id, 'id');
   deleteMaterials(id).then(() => {

src/views/property-marketing/intelligent-solution/businessAnalysisReport.vue

@@ -53,16 +53,15 @@
         />
       </Table>
       <div class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.pageSize"
+          :pageSize="pageInfo.pageSize"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -71,7 +70,7 @@
 
 <script setup lang="ts">
 import { reactive, ref } from 'vue';
-import { Button, Input, Space, Table } from 'ant-design-vue';
+import { Button, Input, Space, Table, Pagination } from 'ant-design-vue';
 
 const pageInfo = reactive({
   page: 1,
@@ -86,11 +85,13 @@ const listResult = reactive({
   data: [],
   total: 0,
 });
-const onPageSizeChange = () => {};
 const tableData = ref([]);
 const handleChange = () => {};
-const onPageChange = () => {};
+const onPageChange = (page: number, pageSize:number) => {
-const columns = [
+  pageInfo.page = page;
+  pageInfo.pageSize = pageSize;
+};
+  const columns = [
   {
     title: '服务/产品',
     dataIndex: 'service_name',

src/views/property-marketing/intelligent-solution/competitiveProductAnalysisReport.vue

@@ -83,16 +83,15 @@
         />
       </Table>
       <div class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.pageSize"
+          :pageSize="pageInfo.pageSize"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -100,7 +99,7 @@
 </template>
 
 <script setup lang="ts">
-import { Button, Input, Space, Table } from 'ant-design-vue';
+import { Button, Input, Space, Pagination, Table } from 'ant-design-vue';
 import { reactive, ref } from 'vue';
 
 const pageInfo = reactive({
@@ -113,7 +112,10 @@ const query = reactive({
 });
 
 const handleChange = () => {};
-const onPageChange = () => {};
+const onPageChange = (page: number, pageSize:number) => {
+  pageInfo.page = page;
+  pageInfo.pageSize = pageSize;
+};
 const onPageSizeChange = () => {};
 const tableData = ref([]);
 

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

@@ -40,16 +40,15 @@
         @sorterChange="handleSorterChange"
       />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+         <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -60,7 +59,7 @@
 import FilterBlock from './components/filter-block';
 import AccountTable from './components/account-table';
 
-import { Tooltip } from 'ant-design-vue';
+import { Tooltip, Pagination } from 'ant-design-vue';
 import { getAccountBoardOverview, getAccountBoardList, postAccountBoardExport } from '@/api/all/propertyMarketing';
 import { formatNumberShow } from '@/utils/tools';
 import { INITIAL_QUERY, CARD_FIELDS } from './constants';
@@ -100,8 +99,9 @@ const getData = async () => {
   }
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.page_size = pageSize;
   getData();
 };
 

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

@@ -90,23 +90,22 @@
       </template>
     </Table>
     <div v-if="pageInfo.total > 0" class="pagination-row mb-24px">
-      <a-pagination
+      <Pagination
         :total="pageInfo.total"
-        size="mini"
+        size="small"
-        show-total
+        :showTotal="(total, range) => `共 ${total} 条`"
-        show-jumper
+        showSizeChanger
-        show-page-size
+        showQuickJumper
         :current="pageInfo.page"
-        :page-size="pageInfo.page_size"
+        :pageSize="pageInfo.page_size"
         @change="onPageChange"
-        @page-size-change="onPageSizeChange"
       />
     </div>
   </div>
 </template>
 
 <script setup>
-import { Button, Input, Tooltip, Table } from 'ant-design-vue';
+import { Button, Input, Tooltip, Table, Pagination } from 'ant-design-vue';
 import { TABLE_COLUMNS, INITIAL_QUERY, INITIAL_PAGE_INFO } from './constants';
 import { useRoute } from 'vue-router';
 import { formatTableField, exactFormatTime, formatNumberShow } from '@/utils/tools';
@@ -141,8 +140,9 @@ const onDateChange = (value) => {
   handleSearch();
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.page_size = pageSize;
   getData();
 };
 

src/views/property-marketing/media-account/account-manage/components/group-manage-modal/index.vue

@@ -26,7 +26,7 @@
       </div>
       <Button type="primary" size="middle" @click="openAdd"
         ><template #icon>
-          <icon-plus size="16" class="mr-8px"/>
+          <icon-plus size="16" class="mr-8px" />
         </template>
         <template #default>添加新分组</template>
       </Button>
@@ -40,11 +40,13 @@
       class="h-500px"
       :pagination="false"
       :showSorterTooltip="false"
-      @change="(pagination, filters, sorter) => {
+      @change="
+        (pagination, filters, sorter) => {
           if (sorter && sorter.columnKey) {
             handleSorterChange(sorter.columnKey, sorter.order);
           }
-      }"
+        }
+      "
     >
       <Table.Column title="分组名称" dataIndex="name" />
       <Table.Column title="创建人" dataIndex="creator">
@@ -52,13 +54,7 @@
           {{ record.creator?.name || '-' }}
         </template>
       </Table.Column>
-      <Table.Column
+      <Table.Column title="创建日期" dataIndex="created_at" :width="160" key="created_at" :sorter="true">
-        title="创建日期"
-        dataIndex="created_at"
-        :width="160"
-        key="created_at"
-        :sorter="true"
-      >
         <template #customRender="{ record }">
           {{ exactFormatTime(record.created_at) }}
         </template>
@@ -76,7 +72,7 @@
           <span class="s1 mb-16px">暂无分组</span>
           <Button type="primary" class="mb-16px" size="middle" @click="openAdd"
             ><template #icon>
-              <icon-plus size="16" class="mr-8px"/>
+              <icon-plus size="16" class="mr-8px" />
             </template>
             <template #default>去添加</template>
           </Button>
@@ -84,16 +80,15 @@
       </template>
     </Table>
     <div v-if="pageInfo.total > 0" class="pagination-row flex justify-end">
-      <a-pagination
+      <Pagination
         :total="pageInfo.total"
-        size="mini"
+        size="small"
-        show-total
+        :showTotal="(total, range) => `共 ${total} 条`"
-        show-jumper
+        showSizeChanger
-        show-page-size
+        showQuickJumper
         :current="pageInfo.page"
-        :page-size="pageInfo.pageSize"
+        :pageSize="pageInfo.pageSize"
         @change="onPageChange"
-        @page-size-change="onPageSizeChange"
       />
     </div>
 
@@ -104,7 +99,7 @@
 
 <script setup>
 import { ref, reactive, onMounted } from 'vue';
-import { Button, Input, Modal, Space, Table } from 'ant-design-vue';
+import { Button, Input, Modal, Space, Table, Pagination } from 'ant-design-vue';
 import { getAccountGroup } from '@/api/all/propertyMarketing';
 import { exactFormatTime } from '@/utils/tools';
 
@@ -139,8 +134,6 @@ const loading = ref(false);
 const query = ref(cloneDeep(INITIAL_QUERY));
 const pageInfo = ref(cloneDeep(INITIAL_PAGE_INFO));
 
-
-
 function open() {
   visible.value = true;
   getData();
@@ -195,8 +188,9 @@ const reload = () => {
   getData();
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.pageSize = pageSize;
   getData();
 };
 const onPageSizeChange = (pageSize) => {

src/views/property-marketing/media-account/account-manage/index.vue

@@ -4,7 +4,7 @@
 -->
 <template>
   <div class="account-manage-wrap">
-    <div class="filter-wrap bg-#fff rounded-8px ">
+    <div class="filter-wrap bg-#fff rounded-8px">
       <div class="top flex h-64px px-24px py-10px justify-between items-center">
         <p class="text-18px font-400 lh-26px color-#211F24 title">账号管理</p>
         <div class="flex items-center">
@@ -22,7 +22,7 @@
           </Button>
           <Button type="primary" class="w-112px" size="middle" @click="handleOpenAccountModal">
             <template #icon>
-              <icon-plus size="16" class="mr-8px"/>
+              <icon-plus size="16" class="mr-8px" />
             </template>
             <template #default>添加账号</template>
           </Button>
@@ -92,17 +92,16 @@
       <NoData v-else />
 
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
-          :page-size-options="[8, 16, 20, 32, 64]"
           :current="pageInfo.page"
-          :page-size="pageInfo.pageSize"
+          :pageSize="pageInfo.pageSize"
+          :pageSizeOptions="['8', '16', '20', '32', '64']"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -120,7 +119,7 @@
 <script setup>
 import { ref, provide } from 'vue';
 import { Notification } from '@arco-design/web-vue';
-import { Checkbox, Button, Space } from 'ant-design-vue';
+import { Checkbox, Button, Space, Pagination } from 'ant-design-vue';
 
 import FilterBlock from './components/filter-block';
 import AccountTable from './components/account-table';
@@ -241,8 +240,10 @@ const handleReset = () => {
   reload();
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.pageSize = pageSize;
+
   getData();
 };
 const onPageSizeChange = (pageSize) => {

src/views/property-marketing/project-manage/project-list/components/project-table/constants.ts

@@ -41,7 +41,7 @@ export const TABLE_COLUMNS = [
   {
     title: '操作',
     dataIndex: 'operation',
-    width: 100,
+    width: 120,
     fixed: 'right',
   },
 ];

src/views/property-marketing/project-manage/project-list/index.vue

@@ -22,16 +22,15 @@
         @edit="handleEdit"
       />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -43,7 +42,7 @@
 
 <script setup>
 import { INITIAL_QUERY } from './constants';
-import { Button } from 'ant-design-vue';
+import { Button, Pagination } from 'ant-design-vue';
 import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPagination';
 import { getProjects } from '@/api/all/propertyMarketing';
 
@@ -56,9 +55,6 @@ const { dataSource, pageInfo, onPageChange, onPageSizeChange, resetPageInfo } =
   onPageChange: () => {
     getData();
   },
-  onPageSizeChange: () => {
-    getData();
-  },
 });
 
 const addProjectModalRef = ref(null);

src/views/property-marketing/put-account/account-data/components/group-manage-modal/index.vue

@@ -26,7 +26,7 @@
       </div>
       <Button type="primary" size="medium" @click="openAdd"
         ><template #icon>
-          <icon-plus size="16" class="mr-8px"/>
+          <icon-plus size="16" class="mr-8px" />
         </template>
         <template #default>添加新分组</template>
       </Button>
@@ -68,7 +68,7 @@
           <span class="s1 mb-16px">暂无分组</span>
           <Button type="primary" class="mb-16px" size="medium" @click="openAdd"
             ><template #icon>
-              <icon-plus size="16" class="mr-8px"/>
+              <icon-plus size="16" class="mr-8px" />
             </template>
             <template #default>去添加</template>
           </Button>
@@ -76,16 +76,15 @@
       </template>
     </Table>
     <div v-if="pageInfo.total > 0" class="pagination-row flex justify-end">
-      <a-pagination
+      <Pagination
         :total="pageInfo.total"
-        size="mini"
+        size="small"
-        show-total
+        :showTotal="(total, range) => `共 ${total} 条`"
-        show-jumper
+        showSizeChanger
-        show-page-size
+        showQuickJumper
         :current="pageInfo.page"
-        :page-size="pageInfo.pageSize"
+        :pageSize="pageInfo.pageSize"
         @change="onPageChange"
-        @page-size-change="onPageSizeChange"
       />
     </div>
 
@@ -96,7 +95,7 @@
 
 <script setup>
 import { ref, reactive, onMounted } from 'vue';
-import { Button, Modal, Input, Space, Table } from 'ant-design-vue';
+import { Button, Modal, Pagination, Input, Space, Table } from 'ant-design-vue';
 import { getPlacementAccountProjectGroups } from '@/api/all/propertyMarketing';
 import { exactFormatTime } from '@/utils/tools';
 const { Column } = Table;
@@ -208,8 +207,10 @@ const handleSearch = () => {
   reload();
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.pageSize = pageSize;
+
   getData();
 };
 const onPageSizeChange = (pageSize) => {

src/views/property-marketing/put-account/account-data/index.vue

@@ -35,16 +35,15 @@
         @selectionChange="handleSelectionChange"
       />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -54,7 +53,7 @@
 </template>
 
 <script setup>
-import { Button, Tabs } from 'ant-design-vue';
+import { Button, Tabs, Pagination } from 'ant-design-vue';
 const { TabPane } = Tabs;
 import FilterBlock from './components/filter-block';
 import BoardTable from './components/board-table';
@@ -113,8 +112,9 @@ const getData = async () => {
   }
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.page_size = pageSize;
   getData();
 };
 

src/views/property-marketing/put-account/account-manage/components/select-sub-account-modal/index.vue

@@ -83,16 +83,15 @@
       </template>
     </Table>
     <div v-if="pageInfo.total > 0" class="flex justify-end mt-16px">
-      <a-pagination
+      <Pagination
         :total="pageInfo.total"
-        size="mini"
+        size="small"
-        show-total
+        :showTotal="(total, range) => `共 ${total} 条`"
-        show-jumper
+        showSizeChanger
-        show-page-size
+        showQuickJumper
         :current="pageInfo.page"
-        :page-size="pageInfo.page_size"
+        :pageSize="pageInfo.page_size"
         @change="onPageChange"
-        @page-size-change="onPageSizeChange"
       />
     </div>
     <template #footer>
@@ -110,7 +109,7 @@
 </template>
 
 <script setup>
-import { Button, Input, Modal, Table, Tooltip } from 'ant-design-vue';
+import { Button, Pagination, Input, Modal, Table, Tooltip } from 'ant-design-vue';
 import { INITIAL_FORM, INITIAL_PAGE_INFO, TABLE_COLUMNS } from './constants';
 import { formatTableField } from '@/utils/tools';
 import { postSubAccount, postAddSubAccount } from '@/api/all/propertyMarketing';
@@ -132,7 +131,6 @@ const {
   dataSource,
   pageInfo,
   onPageChange,
-  onPageSizeChange,
   rowSelection,
   handleSelect,
   handleSelectAll,
@@ -141,9 +139,6 @@ const {
   onPageChange: () => {
     getData();
   },
-  onPageSizeChange: () => {
-    getData();
-  },
 });
 
 const open = (formData) => {

src/views/property-marketing/put-account/account-manage/index.vue

@@ -71,17 +71,16 @@
       <NoData v-else />
 
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
-          :page-size-options="[8, 16, 20, 32, 64]"
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSizeOptions="['8', '16', '20', '32', '64']"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -93,7 +92,7 @@
 
 <script setup>
 import { ref } from 'vue';
-import { Checkbox, Button, Space } from 'ant-design-vue';
+import { Checkbox, Button, Space, Pagination } from 'ant-design-vue';
 
 import FilterBlock from './components/filter-block';
 import AccountTable from './components/account-table';
@@ -200,8 +199,9 @@ const handleReset = () => {
   reload();
 };
 
-const onPageChange = (current) => {
+const onPageChange = (current, pageSize) => {
   pageInfo.value.page = current;
+  pageInfo.value.page_size = pageSize;
   getData();
 };
 const onPageSizeChange = (pageSize) => {

src/views/property-marketing/put-account/investment-guidelines/index.vue

@@ -31,16 +31,15 @@
       <a-spin v-if="loading" tip="AI分析中" />
 
       <div v-if="listData.total > 0" class="pagination-box flex justify-end ignore-export">
-        <a-pagination
+         <Pagination
           :total="listData.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total: number) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="query.page"
-          :page-size="query.pageSize"
+          :pageSize="query.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -73,7 +72,7 @@
 
 <script setup lang="ts">
 import { reactive, ref } from 'vue';
-import { Button, Tabs, Space } from 'ant-design-vue';
+import { Button, Tabs, Space, Pagination } from 'ant-design-vue';
 const { TabPane } = Tabs;
 import PlacementGuideList from './components/table-data/placementGuideList.vue';
 import listSearchForm from './components/table-data/listSearchForm.vue';
@@ -106,8 +105,9 @@ const query = reactive({
 const currentComponent = computed(() => {
   return tabData.value === 'placement_guide' ? PlacementGuideList : GuideListHistory;
 });
-const onPageChange = (current) => {
+const onPageChange = (current: number, pageSize: number) => {
   query.page = current;
+  query.page_size = pageSize;
   onSearch();
 };
 const onPageSizeChange = (pageSize) => {

src/views/writer-material-center/components/finished-products/manuscript/check-list/index.vue

@@ -44,16 +44,15 @@
         @selectAll="handleSelectAll"
       />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -63,7 +62,7 @@
 </template>
 <script lang="jsx" setup>
 import { provide } from 'vue';
-import { Button } from 'ant-design-vue';
+import { Button, Pagination } from 'ant-design-vue';
 import { Message as AMessage } from '@arco-design/web-vue';
 import FilterBlock from './components/filter-block';
 import ManuscriptCheckTable from './components/manuscript-check-table';
@@ -88,7 +87,6 @@ const {
   pageInfo,
   rowSelection,
   onPageChange,
-  onPageSizeChange,
   resetPageInfo,
   selectedRowKeys,
   selectedRows,
@@ -99,9 +97,6 @@ const {
   onPageChange: () => {
     getData();
   },
-  onPageSizeChange: () => {
-    getData();
-  },
 });
 const router = useRouter();
 const route = useRoute();

src/views/writer-material-center/components/finished-products/manuscript/list/index.vue

@@ -6,16 +6,15 @@
     <div class="table-wrap bg-#fff rounded-8px px-24px py-24px flex flex-col">
       <ManuscriptTable :dataSource="dataSource" @sorterChange="handleSorterChange" @delete="handleDelete" />
       <div v-if="pageInfo.total > 0" class="pagination-row">
-        <a-pagination
+        <Pagination
           :total="pageInfo.total"
-          size="mini"
+          size="small"
-          show-total
+          :showTotal="(total, range) => `共 ${total} 条`"
-          show-jumper
+          showSizeChanger
-          show-page-size
+          showQuickJumper
           :current="pageInfo.page"
-          :page-size="pageInfo.page_size"
+          :pageSize="pageInfo.page_size"
           @change="onPageChange"
-          @page-size-change="onPageSizeChange"
         />
       </div>
     </div>
@@ -24,6 +23,7 @@
   </div>
 </template>
 <script lang="jsx" setup>
+import { Pagination } from 'ant-design-vue';
 import FilterBlock from './components/filter-block';
 import ManuscriptTable from './components/manuscript-table';
 import DeleteManuscriptModal from './components/manuscript-table/delete-manuscript-modal.vue';
@@ -32,13 +32,10 @@ import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPa
 import { getWorksPageWriter } from '@/api/all/generationWorkshop-writer.ts';
 import { INITIAL_QUERY } from '@/views/writer-material-center/components/finished-products/manuscript/list/constants.ts';
 
-const { dataSource, pageInfo, onPageChange, onPageSizeChange, resetPageInfo } = useTableSelectionWithPagination({
+const { dataSource, pageInfo, onPageChange, resetPageInfo } = useTableSelectionWithPagination({
   onPageChange: () => {
     getData();
   },
-  onPageSizeChange: () => {
-    getData();
-  },
 });
 const route = useRoute();
 const query = ref(cloneDeep(INITIAL_QUERY));