Added utilities for pagination.

Imiss-U1025 · Imiss-U1025 · commit d2715f8a1705 · 2024-11-27T17:40:55.000-05:00
diff --git a/client/packages/lowcoder/src/util/pagination/Pagination.tsx b/client/packages/lowcoder/src/util/pagination/Pagination.tsx
@@ -0,0 +1,52 @@
+import styled from "styled-components";
+import { Pagination } from "antd";
+
+const PaginationLayout = styled(Pagination)`
+    display: flex;
+    justify-content: center;
+    margin-top: 40px;
+    margin-bottom: 20px;
+`;
+
+interface PaginationCompProps {
+    setCurrentPage: (page: number) => void;
+    setPageSize: (size: number) => void;
+    currentPage: number;
+    pageSize: number;
+    total: number;
+}
+
+const PaginationComp = (props: PaginationCompProps) => {
+    const {
+        setCurrentPage,
+        setPageSize,
+        currentPage,
+        pageSize,
+        total,
+    } = props;
+
+    const handlePageChange = (page: number, pageSize: number | undefined) => {
+        if (setCurrentPage) {
+            setCurrentPage(page);
+        }
+    };
+
+    const handlePageSizeChange = (current: number, size: number) => {
+        if (setPageSize) {
+            setPageSize(size);
+        }
+    };
+
+    return (
+        <PaginationLayout
+            current={currentPage}
+            pageSize={pageSize}
+            onChange={handlePageChange}
+            onShowSizeChange={handlePageSizeChange}
+            total={total}
+            showSizeChanger
+        />
+    );
+};
+
+export default PaginationComp;
diff --git a/client/packages/lowcoder/src/util/pagination/axios.ts b/client/packages/lowcoder/src/util/pagination/axios.ts
@@ -1,11 +1,10 @@
 import { FolderApi } from "@lowcoder-ee/api/folderApi";
-import { FetchFolderElementsPaginationPayload } from "@lowcoder-ee/redux/reduxActions/folderActions";
-import {
-    FetchApplicationElementsPaginationPayload,
-} from "@lowcoder-ee/redux/reduxActions/applicationActions";
 import ApplicationApi from "@lowcoder-ee/api/applicationApi";
+import {fetchAppRequestType, fetchFolderRequestType} from "@lowcoder-ee/util/pagination/type";
 
-export const fetchFolderElements = async (request: FetchFolderElementsPaginationPayload) => {
+
+
+export const fetchFolderElements = async (request: fetchFolderRequestType) => {
     try {
         const response = await FolderApi.fetchFolderElementsPagination(request);
         return {
@@ -23,7 +22,7 @@ export const fetchFolderElements = async (request: FetchFolderElementsPagination
 }
 
 
-export const fetchApplicationElements = async (request: FetchApplicationElementsPaginationPayload)=> {
+export const fetchApplicationElements = async (request: fetchAppRequestType)=> {
     try {
         const response = await ApplicationApi.fetchAllApplicationsPagination(request);
         return {
diff --git a/client/packages/lowcoder/src/util/pagination/type.ts b/client/packages/lowcoder/src/util/pagination/type.ts
@@ -11,4 +11,26 @@ export const ApplicationPaginationType: ApplicationType = {
     4: "FOLDER",
     6: "MOBILETABLAYOUT",
     7: "NAVIGATION",
-};
+};
+
+export interface fetchAppRequestType {
+    pageNum?: number;
+    pageSize?: number;
+    name?: string;
+    applicationType?: number;
+}
+
+export interface fetchFolderRequestType {
+    pageNum?: number;
+    pageSize?: number;
+    name?: string;
+    applicationType?: string;
+}
+
+export interface GenericApiPaginationResponse<T> {
+    total: number;
+    success: boolean;
+    code: number;
+    message: string;
+    data: T;
+}
