feat: 更换Pagination组件
This commit is contained in:
@ -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) => {
|
||||
pageInfo.value.page_size = size;
|
||||
pageInfo.value.page = 1;
|
||||
options.onPageSizeChange?.(size);
|
||||
const onPageSizeChange = (current: number, size: number) => {
|
||||
// console.log('onPageSizeChange', current, size);
|
||||
// pageInfo.value.page_size = size;
|
||||
// pageInfo.value.page = 1;
|
||||
// options.onPageSizeChange?.(size);
|
||||
};
|
||||
const resetPageInfo = () => {
|
||||
pageInfo.value = cloneDeep(DEFAULT_PAGE_INFO)
|
||||
|
||||
@ -151,7 +151,7 @@ const props = defineProps({
|
||||
default: () => [],
|
||||
},
|
||||
rowSelection: {
|
||||
type: Array,
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
selectedRowKeys: {
|
||||
|
||||
@ -46,16 +46,15 @@
|
||||
@selectAll="handleSelectAll"
|
||||
/>
|
||||
<div v-if="pageInfo.total > 0" class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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([]);
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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);
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
showTotal={(total: number) => `共 ${total} 条记录`}
|
||||
showSizeChanger
|
||||
showQuickJumper
|
||||
current={pageInfo.value.page}
|
||||
pageSize={pageInfo.value.page_size}
|
||||
onChange={onPageChange}
|
||||
onPageSizeChange={onPageSizeChange}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -108,16 +108,16 @@
|
||||
</Table>
|
||||
|
||||
<div class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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(() => {
|
||||
|
||||
@ -53,16 +53,15 @@
|
||||
/>
|
||||
</Table>
|
||||
<div class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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 columns = [
|
||||
const onPageChange = (page: number, pageSize:number) => {
|
||||
pageInfo.page = page;
|
||||
pageInfo.pageSize = pageSize;
|
||||
};
|
||||
const columns = [
|
||||
{
|
||||
title: '服务/产品',
|
||||
dataIndex: 'service_name',
|
||||
|
||||
@ -83,16 +83,15 @@
|
||||
/>
|
||||
</Table>
|
||||
<div class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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([]);
|
||||
|
||||
|
||||
@ -40,16 +40,15 @@
|
||||
@sorterChange="handleSorterChange"
|
||||
/>
|
||||
<div v-if="pageInfo.total > 0" class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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();
|
||||
};
|
||||
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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();
|
||||
};
|
||||
|
||||
|
||||
@ -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) => {
|
||||
if (sorter && sorter.columnKey) {
|
||||
handleSorterChange(sorter.columnKey, sorter.order);
|
||||
@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
|
||||
title="创建日期"
|
||||
dataIndex="created_at"
|
||||
:width="160"
|
||||
key="created_at"
|
||||
:sorter="true"
|
||||
>
|
||||
<Table.Column 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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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) => {
|
||||
|
||||
@ -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">
|
||||
@ -18,11 +18,11 @@
|
||||
<template #icon>
|
||||
<img :src="icon2" width="16" height="16" class="mr-8px" />
|
||||
</template>
|
||||
分组管理
|
||||
分组管理
|
||||
</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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
:page-size-options="[8, 16, 20, 32, 64]"
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
showQuickJumper
|
||||
: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) => {
|
||||
|
||||
@ -41,7 +41,7 @@ export const TABLE_COLUMNS = [
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'operation',
|
||||
width: 100,
|
||||
width: 120,
|
||||
fixed: 'right',
|
||||
},
|
||||
];
|
||||
|
||||
@ -22,16 +22,15 @@
|
||||
@edit="handleEdit"
|
||||
/>
|
||||
<div v-if="pageInfo.total > 0" class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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);
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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) => {
|
||||
|
||||
@ -35,16 +35,15 @@
|
||||
@selectionChange="handleSelectionChange"
|
||||
/>
|
||||
<div v-if="pageInfo.total > 0" class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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();
|
||||
};
|
||||
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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) => {
|
||||
|
||||
@ -71,17 +71,16 @@
|
||||
<NoData v-else />
|
||||
|
||||
<div v-if="pageInfo.total > 0" class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
:page-size-options="[8, 16, 20, 32, 64]"
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
showQuickJumper
|
||||
: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) => {
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total: number) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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) => {
|
||||
|
||||
@ -44,16 +44,15 @@
|
||||
@selectAll="handleSelectAll"
|
||||
/>
|
||||
<div v-if="pageInfo.total > 0" class="pagination-row">
|
||||
<a-pagination
|
||||
<Pagination
|
||||
:total="pageInfo.total"
|
||||
size="mini"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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();
|
||||
|
||||
@ -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"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
size="small"
|
||||
:showTotal="(total, range) => `共 ${total} 条`"
|
||||
showSizeChanger
|
||||
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));
|
||||
|
||||
Reference in New Issue
Block a user