From 2dd7cbfa150dfdf00a8d966b48f1b1188cdba0c0 Mon Sep 17 00:00:00 2001
From: "He, Wanchen" <hwc14@qq.com>
Date: Tue, 19 Nov 2024 18:22:06 +0800
Subject: [PATCH] Fix TableCustom pagination props.

---
 src/views/system/role.vue     | 27 ++++++++++++++-------------
 src/views/system/user.vue     | 21 +++++++++++----------
 src/views/table/basetable.vue | 22 +++++++++++-----------
 3 files changed, 36 insertions(+), 34 deletions(-)

diff --git a/src/views/system/role.vue b/src/views/system/role.vue
index fa8a6488..eaa6dccd 100644
--- a/src/views/system/role.vue
+++ b/src/views/system/role.vue
@@ -3,8 +3,9 @@
         <TableSearch :query="query" :options="searchOpt" :search="handleSearch" />
         <div class="container">
 
-            <TableCustom :columns="columns" :tableData="tableData" :total="page.total" :viewFunc="handleView"
-                :delFunc="handleDelete" :page-change="changePage" :editFunc="handleEdit">
+            <TableCustom :columns="columns" :tableData="tableData" :total="page.total" :currentPage="page.index"
+                :pageSize="page.size" :viewFunc="handleView" :delFunc="handleDelete" :changePage="changePage"
+                :editFunc="handleEdit">
                 <template #toolbarBtn>
                     <el-button type="warning" :icon="CirclePlusFilled" @click="visible = true">新增</el-button>
                 </template>
@@ -42,7 +43,7 @@ import { Role } from '@/types/role';
 import { fetchRoleData } from '@/api';
 import TableCustom from '@/components/table-custom.vue';
 import TableDetail from '@/components/table-detail.vue';
-import RolePermission from './role-permission.vue'
+import RolePermission from './role-permission.vue';
 import { CirclePlusFilled } from '@element-plus/icons-vue';
 import { FormOption, FormOptionList } from '@/types/form-option';
 
@@ -52,7 +53,7 @@ const query = reactive({
 });
 const searchOpt = ref<FormOptionList[]>([
     { type: 'input', label: '角色名称：', prop: 'name' }
-])
+]);
 const handleSearch = () => {
     changePage(1);
 };
@@ -65,15 +66,15 @@ let columns = ref([
     { prop: 'status', label: '状态' },
     { prop: 'permissions', label: '权限管理' },
     { prop: 'operator', label: '操作', width: 250 },
-])
+]);
 const page = reactive({
     index: 1,
     size: 10,
     total: 0,
-})
+});
 const tableData = ref<Role[]>([]);
 const getData = async () => {
-    const res = await fetchRoleData()
+    const res = await fetchRoleData();
     tableData.value = res.data.list;
     page.total = res.data.pageTotal;
 };
@@ -92,7 +93,7 @@ const options = ref<FormOption>({
         { type: 'input', label: '角色标识', prop: 'key', required: true },
         { type: 'switch', label: '状态', prop: 'status', required: false, activeText: '启用', inactiveText: '禁用' },
     ]
-})
+});
 const visible = ref(false);
 const isEdit = ref(false);
 const rowData = ref({});
@@ -119,7 +120,7 @@ const viewData = ref({
     column: 1
 });
 const handleView = (row: Role) => {
-    viewData.value.row = { ...row }
+    viewData.value.row = { ...row };
     viewData.value.list = [
         {
             prop: 'id',
@@ -137,26 +138,26 @@ const handleView = (row: Role) => {
             prop: 'status',
             label: '角色状态',
         },
-    ]
+    ];
     visible1.value = true;
 };
 
 // 删除相关
 const handleDelete = (row: Role) => {
     ElMessage.success('删除成功');
-}
+};
 
 
 // 权限管理弹窗相关
 const visible2 = ref(false);
-const permissOptions = ref({})
+const permissOptions = ref({});
 const handlePermission = (row: Role) => {
     visible2.value = true;
     permissOptions.value = {
         id: row.id,
         permiss: row.permiss
     };
-}
+};
 </script>
 
 <style scoped></style>
\ No newline at end of file
diff --git a/src/views/system/user.vue b/src/views/system/user.vue
index ea3a3d53..62d018d9 100644
--- a/src/views/system/user.vue
+++ b/src/views/system/user.vue
@@ -2,8 +2,9 @@
     <div>
         <TableSearch :query="query" :options="searchOpt" :search="handleSearch" />
         <div class="container">
-            <TableCustom :columns="columns" :tableData="tableData" :total="page.total" :viewFunc="handleView"
-                :delFunc="handleDelete" :page-change="changePage" :editFunc="handleEdit">
+            <TableCustom :columns="columns" :tableData="tableData" :total="page.total" :currentPage="page.index"
+                :pageSize="page.size" :viewFunc="handleView" :delFunc="handleDelete" :changePage="changePage"
+                :editFunc="handleEdit">
                 <template #toolbarBtn>
                     <el-button type="warning" :icon="CirclePlusFilled" @click="visible = true">新增</el-button>
                 </template>
@@ -37,7 +38,7 @@ const query = reactive({
 });
 const searchOpt = ref<FormOptionList[]>([
     { type: 'input', label: '用户名：', prop: 'name' }
-])
+]);
 const handleSearch = () => {
     changePage(1);
 };
@@ -49,15 +50,15 @@ let columns = ref([
     { prop: 'phone', label: '手机号' },
     { prop: 'role', label: '角色' },
     { prop: 'operator', label: '操作', width: 250 },
-])
+]);
 const page = reactive({
     index: 1,
     size: 10,
     total: 0,
-})
+});
 const tableData = ref<User[]>([]);
 const getData = async () => {
-    const res = await fetchUserData()
+    const res = await fetchUserData();
     tableData.value = res.data.list;
     page.total = res.data.pageTotal;
 };
@@ -79,7 +80,7 @@ let options = ref<FormOption>({
         { type: 'input', label: '邮箱', prop: 'email', required: true },
         { type: 'input', label: '角色', prop: 'role', required: true },
     ]
-})
+});
 const visible = ref(false);
 const isEdit = ref(false);
 const rowData = ref({});
@@ -105,7 +106,7 @@ const viewData = ref({
     list: []
 });
 const handleView = (row: User) => {
-    viewData.value.row = { ...row }
+    viewData.value.row = { ...row };
     viewData.value.list = [
         {
             prop: 'id',
@@ -135,14 +136,14 @@ const handleView = (row: User) => {
             prop: 'date',
             label: '注册日期',
         },
-    ]
+    ];
     visible1.value = true;
 };
 
 // 删除相关
 const handleDelete = (row: User) => {
     ElMessage.success('删除成功');
-}
+};
 </script>
 
 <style scoped></style>
\ No newline at end of file
diff --git a/src/views/table/basetable.vue b/src/views/table/basetable.vue
index 198acfd8..134fc697 100644
--- a/src/views/table/basetable.vue
+++ b/src/views/table/basetable.vue
@@ -2,9 +2,9 @@
 	<div>
 		<TableSearch :query="query" :options="searchOpt" :search="handleSearch" />
 		<div class="container">
-			<TableCustom :columns="columns" :tableData="tableData" :total="page.total" :viewFunc="handleView"
-				:delFunc="handleDelete" :editFunc="handleEdit" :refresh="getData" :currentPage="page.index"
-				:changePage="changePage">
+			<TableCustom :columns="columns" :tableData="tableData" :total="page.total" :currentPage="page.index"
+				:pageSize="page.size" :viewFunc="handleView" :delFunc="handleDelete" :editFunc="handleEdit"
+				:refresh="getData" :changePage="changePage">
 				<template #toolbarBtn>
 					<el-button type="warning" :icon="CirclePlusFilled" @click="visible = true">新增</el-button>
 				</template>
@@ -59,7 +59,7 @@ const query = reactive({
 });
 const searchOpt = ref<FormOptionList[]>([
 	{ type: 'input', label: '用户名：', prop: 'name' }
-])
+]);
 const handleSearch = () => {
 	changePage(1);
 };
@@ -73,15 +73,15 @@ let columns = ref([
 	{ prop: 'thumb', label: '头像' },
 	{ prop: 'state', label: '账户状态' },
 	{ prop: 'operator', label: '操作', width: 250 },
-])
+]);
 const page = reactive({
 	index: 1,
 	size: 10,
 	total: 200,
-})
+});
 const tableData = ref<TableItem[]>([]);
 const getData = async () => {
-	const res = await fetchData()
+	const res = await fetchData();
 	tableData.value = res.data.list;
 };
 getData();
@@ -101,7 +101,7 @@ let options = ref<FormOption>({
 		{ type: 'switch', activeText: '正常', inactiveText: '异常', label: '账户状态', prop: 'state', required: true },
 		{ type: 'upload', label: '头像', prop: 'thumb', required: true },
 	]
-})
+});
 const visible = ref(false);
 const isEdit = ref(false);
 const rowData = ref({});
@@ -127,7 +127,7 @@ const viewData = ref({
 	list: []
 });
 const handleView = (row: TableItem) => {
-	viewData.value.row = { ...row }
+	viewData.value.row = { ...row };
 	viewData.value.list = [
 		{
 			prop: 'id',
@@ -149,14 +149,14 @@ const handleView = (row: TableItem) => {
 			prop: 'thumb',
 			label: '头像',
 		},
-	]
+	];
 	visible1.value = true;
 };
 
 // 删除相关
 const handleDelete = (row: TableItem) => {
 	ElMessage.success('删除成功');
-}
+};
 </script>
 
 <style scoped>