list of admins

src/pages/admin/List.tsx

@@ -0,0 +1,58 @@
+import { useState, type FC } from "react";
+import { useGetAdmins } from "./hooks/useAdminData";
+import Table from "@/components/Table";
+import moment from "moment-jalaali";
+
+const AdminList: FC = () => {
+
+  const [page, setPage] = useState<number>(1);
+  const { data } = useGetAdmins(page);
+
+  return (
+    <div className="mt-5">
+      <div className="flex justify-between items-center">
+        <h1 className="text-lg font-light">مدیران</h1>
+      </div>
+
+      <Table
+        columns={[
+          {
+            key: "fullName",
+            title: "نام و نام خانوادگی",
+            render: (item) => {
+              return <div>{item.firstName + " " + item.lastName}</div>;
+            },
+          },
+          {
+            key: "phone",
+            title: "موبایل",
+          },
+          {
+            key: "role",
+            title: "نقش",
+            render: (item) => {
+              return <div>{item.role.title || item.role.name}</div>;
+            },
+          },
+          {
+            key: "createdAt",
+            title: "تاریخ ثبت",
+            render: (item) => {
+              return (
+                <div>{moment(item.createdAt).format("jYYYY-jMM-jDD")}</div>
+              );
+            },
+          },
+        ]}
+        data={data?.data}
+        pagination={{
+          currentPage: page,
+          onPageChange: setPage,
+          totalPages: data?.meta?.totalPages as number,
+        }}
+      />
+    </div>
+  );
+};
+
+export default AdminList;

src/pages/admin/hooks/useAdminData.ts

@@ -0,0 +1,9 @@
+import * as api from "../service/AdminService";
+import { useQuery } from "@tanstack/react-query";
+
+export const useGetAdmins = (page: number) => {
+  return useQuery({
+    queryKey: ["admins", page],
+    queryFn: () => api.getAdmins(page),
+  });
+};

src/pages/admin/service/AdminService.ts

@@ -0,0 +1,9 @@
+import axios from "@/config/axios";
+import type { AdminsType } from "../types/Types";
+
+export const getAdmins = async (page: number) => {
+  const { data } = await axios.get<AdminsType>("/admin/admins", {
+    params: { page },
+  });
+  return data;
+};

src/pages/admin/types/Types.ts

@@ -0,0 +1,21 @@
+import type { RowDataType } from "@/components/types/TableTypes";
+import type { BaseResponse } from "@/shared/types/Types";
+
+export interface AdminItemType extends RowDataType {
+  id: string;
+  createdAt: string;
+  deletedAt: string | null;
+  firstName: string;
+  lastName: string;
+  role: {
+    id: string;
+    createdAt: string;
+    deletedAt: string | null;
+    name: string;
+    title: string;
+    isSystem: boolean;
+  };
+  phone: string;
+}
+
+export type AdminsType = BaseResponse<AdminItemType[]>;