From 6da0cb533a6b81ef20de39e7a17975cec4a1ada6 Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Sun, 23 Nov 2025 14:18:46 +0330
Subject: [PATCH] create admin

---
 src/config/Pages.ts                     |   1 +
 src/pages/admin/Create.tsx              | 119 ++++++++++++++++++++++++
 src/pages/admin/List.tsx                |  14 +++
 src/pages/admin/hooks/useAdminData.ts   |  30 +++++-
 src/pages/admin/service/AdminService.ts |  16 +++-
 src/pages/admin/types/Types.ts          |  14 ++-
 src/router/Main.tsx                     |   2 +
 7 files changed, 190 insertions(+), 6 deletions(-)
 create mode 100644 src/pages/admin/Create.tsx

diff --git a/src/config/Pages.ts b/src/config/Pages.ts
index 6b80049..d83757d 100644
--- a/src/config/Pages.ts
+++ b/src/config/Pages.ts
@@ -58,6 +58,7 @@ export const Pages = {
   },
   admins: {
     list: "/admins/list",
+    add: "/admins/add",
     update: "/admins/update/",
   },
 };
diff --git a/src/pages/admin/Create.tsx b/src/pages/admin/Create.tsx
new file mode 100644
index 0000000..3c91681
--- /dev/null
+++ b/src/pages/admin/Create.tsx
@@ -0,0 +1,119 @@
+import { type FC } from 'react'
+import { useFormik } from 'formik'
+import * as Yup from 'yup'
+import { TickCircle } from 'iconsax-react'
+import { toast } from 'react-toastify'
+import { useNavigate } from 'react-router-dom'
+import Button from '@/components/Button'
+import Input from '@/components/Input'
+import Select from '@/components/Select'
+import { useCreateAdmin } from './hooks/useAdminData'
+import { useGetRoles } from '@/pages/roles/hooks/useRolesData'
+import type { CreateAdminType } from './types/Types'
+import { Pages } from '@/config/Pages'
+import type { ErrorType } from '@/helpers/types'
+import { extractErrorMessage } from '@/config/func'
+
+const CreateAdmin: FC = () => {
+    const navigate = useNavigate()
+    const { mutate: createAdmin, isPending } = useCreateAdmin()
+    const { data: rolesData } = useGetRoles()
+
+    const roles = rolesData?.data?.map(role => ({
+        label: role.name,
+        value: role.id
+    })) || []
+
+    const formik = useFormik<CreateAdminType>({
+        initialValues: {
+            phone: '',
+            firstName: '',
+            lastName: '',
+            roleId: '',
+        },
+        validationSchema: Yup.object().shape({
+            phone: Yup.string().required('شماره تلفن الزامی است'),
+            firstName: Yup.string().required('نام الزامی است'),
+            lastName: Yup.string().required('نام خانوادگی الزامی است'),
+            roleId: Yup.string().required('نقش الزامی است'),
+        }),
+        onSubmit: (values) => {
+            createAdmin(values, {
+                onSuccess: () => {
+                    toast.success('مدیر با موفقیت ایجاد شد')
+                    navigate(Pages.admins.list)
+                },
+                onError: (error: ErrorType) => {
+                    toast.error(extractErrorMessage(error))
+                },
+            })
+        },
+    })
+
+    return (
+        <div className='mt-5'>
+            <div className='flex w-full justify-between items-center'>
+                <div className='text-lg font-light'>
+                    مدیر جدید
+                </div>
+                <div>
+                    <Button
+                        className='px-5'
+                        onClick={() => formik.handleSubmit()}
+                        isloading={isPending}
+                    >
+                        <div className='flex gap-2 items-center'>
+                            <TickCircle className='size-5' color='white' />
+                            <div>ثبت مدیر</div>
+                        </div>
+                    </Button>
+                </div>
+            </div>
+
+            <div className='mt-6'>
+                <div className='bg-white rounded-3xl p-6'>
+                    <div className='mb-4'>
+                        <Input
+                            label='نام'
+                            name='firstName'
+                            value={formik.values.firstName}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.firstName && formik.errors.firstName ? formik.errors.firstName : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Input
+                            label='نام خانوادگی'
+                            name='lastName'
+                            value={formik.values.lastName}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.lastName && formik.errors.lastName ? formik.errors.lastName : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Input
+                            label='شماره تلفن'
+                            name='phone'
+                            value={formik.values.phone}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.phone && formik.errors.phone ? formik.errors.phone : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Select
+                            label='نقش'
+                            name='roleId'
+                            value={formik.values.roleId}
+                            onChange={formik.handleChange}
+                            items={roles}
+                            placeholder='نقش را انتخاب کنید'
+                            error_text={formik.touched.roleId && formik.errors.roleId ? formik.errors.roleId : ''}
+                        />
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default CreateAdmin
\ No newline at end of file
diff --git a/src/pages/admin/List.tsx b/src/pages/admin/List.tsx
index 4bfaecd..ac031be 100644
--- a/src/pages/admin/List.tsx
+++ b/src/pages/admin/List.tsx
@@ -5,6 +5,10 @@ import { useGetAdmins, useDeleteAdmin } from './hooks/useAdminData'
 import { useAdminFilters } from './hooks/useAdminFilters'
 import { getAdminTableColumns } from './components/AdminTableColumns'
 import { useAdminFiltersFields } from './components/AdminFiltersFields'
+import { Add } from 'iconsax-react'
+import { Link } from 'react-router-dom'
+import { Pages } from '@/config/Pages'
+import Button from '@/components/Button'
 
 const AdminList: FC = () => {
     const {
@@ -32,6 +36,16 @@ const AdminList: FC = () => {
         <div className='mt-5'>
             <div className='flex justify-between items-center'>
                 <h1 className='text-lg font-light'>لیست مدیران</h1>
+                <Link
+                    to={Pages.admins.add}
+                >
+                    <Button className='w-fit px-6'>
+                        <div className='flex gap-2 items-center'>
+                            <Add color='#fff' size={20} />
+                            <span>افزودن مدیر</span>
+                        </div>
+                    </Button>
+                </Link>
             </div>
 
             <div className='mt-8'>
diff --git a/src/pages/admin/hooks/useAdminData.ts b/src/pages/admin/hooks/useAdminData.ts
index 702c08e..2c3abc3 100644
--- a/src/pages/admin/hooks/useAdminData.ts
+++ b/src/pages/admin/hooks/useAdminData.ts
@@ -1,6 +1,6 @@
 import * as api from "../service/AdminService";
 import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
-import type { GetAdminsParams } from "../types/Types";
+import type { GetAdminsParams, CreateAdminType } from "../types/Types";
 
 export const useGetAdmins = (params?: GetAdminsParams) => {
   return useQuery({
@@ -20,3 +20,31 @@ export const useDeleteAdmin = () => {
     },
   });
 };
+
+export const useCreateAdmin = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: api.createAdmin,
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: ["admins"],
+      });
+    },
+  });
+};
+
+export const useUpdateAdmin = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ id, params }: { id: string; params: CreateAdminType }) =>
+      api.updateAdmin(id, params),
+    onSuccess: (_, { id }) => {
+      queryClient.invalidateQueries({
+        queryKey: ["admins"],
+      });
+      queryClient.invalidateQueries({
+        queryKey: ["admins", id],
+      });
+    },
+  });
+};
diff --git a/src/pages/admin/service/AdminService.ts b/src/pages/admin/service/AdminService.ts
index 6e73cf1..cabe6ac 100644
--- a/src/pages/admin/service/AdminService.ts
+++ b/src/pages/admin/service/AdminService.ts
@@ -1,5 +1,9 @@
 import axios from "@/config/axios";
-import type { GetAdminsResponse, GetAdminsParams } from "../types/Types";
+import type {
+  GetAdminsResponse,
+  GetAdminsParams,
+  CreateAdminType,
+} from "../types/Types";
 
 export const getAdmins = async (
   params?: GetAdminsParams
@@ -14,3 +18,13 @@ export const deleteAdmin = async (id: string) => {
   const { data } = await axios.delete(`/admin/admins/${id}`);
   return data;
 };
+
+export const createAdmin = async (params: CreateAdminType) => {
+  const { data } = await axios.post("/admin", params);
+  return data;
+};
+
+export const updateAdmin = async (id: string, params: CreateAdminType) => {
+  const { data } = await axios.patch(`/admin/admins/${id}`, params);
+  return data;
+};
diff --git a/src/pages/admin/types/Types.ts b/src/pages/admin/types/Types.ts
index 5ba7e98..782cb22 100644
--- a/src/pages/admin/types/Types.ts
+++ b/src/pages/admin/types/Types.ts
@@ -31,10 +31,16 @@ export type Admin = {
 };
 
 export type GetAdminsParams = {
-    page?: number
-    limit?: number
-    search?: string
-}
+  page?: number;
+  limit?: number;
+  search?: string;
+};
 
 export type GetAdminsResponse = IResponse<Admin[]>;
 
+export type CreateAdminType = {
+  phone: string;
+  firstName: string;
+  lastName: string;
+  roleId: string;
+};
diff --git a/src/router/Main.tsx b/src/router/Main.tsx
index 44a6086..2b57682 100644
--- a/src/router/Main.tsx
+++ b/src/router/Main.tsx
@@ -28,6 +28,7 @@ import PaymentMethodsList from '@/pages/paymentMethods/List'
 import CreatePaymentMethod from '@/pages/paymentMethods/Create'
 import UpdatePaymentMethod from '@/pages/paymentMethods/Update'
 import AdminList from '@/pages/admin/List'
+import CreateAdmin from '@/pages/admin/Create'
 const MainRouter: FC = () => {
 
     const { hasSubMenu } = useSharedStore()
@@ -69,6 +70,7 @@ const MainRouter: FC = () => {
                             <Route path={Pages.payment_methods.update + ':id'} element={<UpdatePaymentMethod />} />
 
                             <Route path={Pages.admins.list} element={<AdminList />} />
+                            <Route path={Pages.admins.add} element={<CreateAdmin />} />
                         </Routes>
                     </div>
                 </div>