list of admins

This commit is contained in:
hamid zarghami
2026-02-08 12:42:15 +03:30
parent 2667290193
commit cfcf132104
9 changed files with 373 additions and 236 deletions
+17
View File
@@ -45,6 +45,7 @@
"eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.22", "eslint-plugin-react-refresh": "^0.4.22",
"globals": "^16.4.0", "globals": "^16.4.0",
"prettier": "^3.8.1",
"typescript": "~5.9.3", "typescript": "~5.9.3",
"typescript-eslint": "^8.45.0", "typescript-eslint": "^8.45.0",
"vite": "^7.1.7" "vite": "^7.1.7"
@@ -4339,6 +4340,22 @@
"node": ">= 0.8.0" "node": ">= 0.8.0"
} }
}, },
"node_modules/prettier": {
"version": "3.8.1",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.8.1.tgz",
"integrity": "sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg==",
"dev": true,
"license": "MIT",
"bin": {
"prettier": "bin/prettier.cjs"
},
"engines": {
"node": ">=14"
},
"funding": {
"url": "https://github.com/prettier/prettier?sponsor=1"
}
},
"node_modules/prop-types": { "node_modules/prop-types": {
"version": "15.8.1", "version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
+1
View File
@@ -47,6 +47,7 @@
"eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.22", "eslint-plugin-react-refresh": "^0.4.22",
"globals": "^16.4.0", "globals": "^16.4.0",
"prettier": "^3.8.1",
"typescript": "~5.9.3", "typescript": "~5.9.3",
"typescript-eslint": "^8.45.0", "typescript-eslint": "^8.45.0",
"vite": "^7.1.7" "vite": "^7.1.7"
+87 -82
View File
@@ -1,86 +1,91 @@
export const Paths = { export const Paths = {
requests: { requests: {
list: '/requests', list: '/requests',
},
product: {
list: '/product/list',
create: '/product/create',
update: '/product/update/',
category: {
create: '/product/category/create',
list: '/product/category/list',
update: '/product/category/update/',
}, },
product: { attribute: {
list: '/product/list', list: '/product/attribute/',
create: '/product/create', create: '/product/attribute/create/',
update: '/product/update/', update: '/product/attribute/update/',
category: {
create: '/product/category/create',
list: '/product/category/list',
update: '/product/category/update/'
},
attribute: {
list: '/product/attribute/',
create: '/product/attribute/create/',
update: '/product/attribute/update/'
},
attributeValue: {
list: '/product/attribute-value/'
}
}, },
users: { attributeValue: {
list: '/users/list' list: '/product/attribute-value/',
}, },
formBuilder: { },
list: '/form-builder/list/', users: {
create: '/form-builder/create/', list: '/users/list',
update: '/form-builder/update/', },
values: '/form-builder/values/' admin: {
}, list: '/admin/list',
order: { create: '/admin/create',
list: '/order/list', update: '/admin/update/',
details: '/order/detail/', },
create: '/order/create', formBuilder: {
edit: '/order/edit/' list: '/form-builder/list/',
}, create: '/form-builder/create/',
features: { update: '/form-builder/update/',
list: '/features/list', values: '/form-builder/values/',
create: '/features/create' },
}, order: {
service: { list: '/order/list',
print: '/service/print' details: '/order/detail/',
}, create: '/order/create',
home: '/home', edit: '/order/edit/',
myOrders: '/my-orders', },
perfomaInvoice: { features: {
list: '/perfoma-invoice/list', list: '/features/list',
detail: '/perfoma-invoice/' create: '/features/create',
}, },
newOrder: '/new-order', service: {
orderDetails: '/order/', print: '/service/print',
tickets: { },
list: '/tickets', home: '/home',
}, myOrders: '/my-orders',
auth: { perfomaInvoice: {
login: '/auth/login', list: '/perfoma-invoice/list',
}, detail: '/perfoma-invoice/',
ticket: { },
list: "/tickets/list", newOrder: '/new-order',
create: "/tickets/create", orderDetails: '/order/',
detail: "/tickets/messages/", tickets: {
category: "/tickets/category", list: '/tickets',
}, },
announcement: { auth: {
list: "/announcement", login: '/auth/login',
detail: "/announcement/detail/", },
create: "/announcement/create", ticket: {
}, list: '/tickets/list',
criticisms: { create: '/tickets/create',
list: "/criticisms", detail: '/tickets/messages/',
detail: "/criticisms/detail/", category: '/tickets/category',
}, },
learning: { announcement: {
list: "/learning/list", list: '/announcement',
detail: "/learning/detail/", detail: '/announcement/detail/',
create: "/learning/create", create: '/announcement/create',
category: "/learning/category", },
}, criticisms: {
print: { list: '/criticisms',
list: '/print/list', detail: '/criticisms/detail/',
create: '/print/create', },
update: '/print/update/', learning: {
form: '/print/form/' list: '/learning/list',
} detail: '/learning/detail/',
} create: '/learning/create',
category: '/learning/category',
},
print: {
list: '/print/list',
create: '/print/create',
update: '/print/update/',
form: '/print/form/',
},
};
+58
View File
@@ -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;
+9
View File
@@ -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),
});
};
+9
View File
@@ -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;
};
+21
View File
@@ -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[]>;
+3
View File
@@ -45,6 +45,7 @@ import CreateSection from '@/pages/print/Create'
import UpdateSection from '@/pages/print/Update' import UpdateSection from '@/pages/print/Update'
import PrintForm from '@/pages/print/Form' import PrintForm from '@/pages/print/Form'
import UsersList from '@/pages/user/List' import UsersList from '@/pages/user/List'
import AdminList from '@/pages/admin/List'
const MainRouter: FC = () => { const MainRouter: FC = () => {
return ( return (
@@ -90,6 +91,8 @@ const MainRouter: FC = () => {
<Route path={Paths.users.list} element={<UsersList />} /> <Route path={Paths.users.list} element={<UsersList />} />
<Route path={Paths.admin.list} element={<AdminList />} />
<Route path={Paths.features.list} element={<FeaturesList />} /> <Route path={Paths.features.list} element={<FeaturesList />} />
<Route path={Paths.features.create} element={<CreateFeature />} /> <Route path={Paths.features.create} element={<CreateFeature />} />
<Route path={Paths.service.print} element={<PrintService />} /> <Route path={Paths.service.print} element={<PrintService />} />
+168 -154
View File
@@ -1,158 +1,172 @@
import { type FC } from 'react' import { type FC } from 'react';
import LogoImage from '@/assets/images/logo.svg' import LogoImage from '@/assets/images/logo.svg';
import { AddSquare, DocumentText, Element3, ElementEqual, Home2, Messages3, MessageText, NotificationStatus, People, Printer, Profile2User, Receipt21, Teacher } from 'iconsax-react' import {
import SideBarItem from './SidebarItem' AddSquare,
import { useLocation } from 'react-router-dom' DocumentText,
import { Paths } from '../config/Paths' Element3,
import { useSharedStore } from './store/useSharedStore' ElementEqual,
import { clx } from '../helpers/utils' Home2,
import { t } from '../locale' Messages3,
import Button from '@/components/Button' MessageText,
NotificationStatus,
People,
Printer,
Profile2User,
Receipt21,
Teacher,
User,
} from 'iconsax-react';
import SideBarItem from './SidebarItem';
import { useLocation } from 'react-router-dom';
import { Paths } from '../config/Paths';
import { useSharedStore } from './store/useSharedStore';
import { clx } from '../helpers/utils';
import { t } from '../locale';
import Button from '@/components/Button';
const SideBar: FC = () => { const SideBar: FC = () => {
const { openSidebar, setOpenSidebar } = useSharedStore();
const location = useLocation();
const { openSidebar, setOpenSidebar } = useSharedStore() const isActive = (name: string) => {
const location = useLocation() return location.pathname.includes(name);
};
const isActive = (name: string) => { const iconSizeSideBar = 20;
return location.pathname.includes(name)
}
const iconSizeSideBar = 20 return (
<>
{openSidebar && (
<div
className="fixed top-0 left-0 right-0 bottom-0 bg-black bg-opacity-50 z-10"
onClick={() => setOpenSidebar(false)}
/>
)}
<div
className={clx(
'fixed xl:flex translate-x-[400px] xl:translate-x-0 transition-all ease-in-out opacity-0 invisible xl:visible xl:opacity-100 xl:right-4 right-0 xl:top-4 top-0 xl:bottom-4 bottom-0 xl:rounded-[32px] w-[240px] bg-white flex-col py-12',
openSidebar && 'opacity-100 visible -translate-x-[0px] block z-40'
)}
>
<div className="px-6">
<div className="flex border-b-2 border-[#F5F7FC] pb-10">
<img src={LogoImage} className="w-[120px]" />
</div>
</div>
return ( <div className="flex-1 h-full overflow-y-auto no-scrollbar px-6">
<> <div className="mt-10 text-description px-6 text-header text-sm font-bold">{t('sidebar.menu')}</div>
{
openSidebar && <div className='fixed top-0 left-0 right-0 bottom-0 bg-black bg-opacity-50 z-10' onClick={() => setOpenSidebar(false)} /> <div className="mt-3">
} <SideBarItem
<div icon={<Home2 size={iconSizeSideBar} color="#4F5260" />}
className={clx( title={t('sidebar.mainPage')}
'fixed xl:flex translate-x-[400px] xl:translate-x-0 transition-all ease-in-out opacity-0 invisible xl:visible xl:opacity-100 xl:right-4 right-0 xl:top-4 top-0 xl:bottom-4 bottom-0 xl:rounded-[32px] w-[240px] bg-white flex-col py-12', isActive={isActive('/home')}
openSidebar && 'opacity-100 visible -translate-x-[0px] block z-40' link={Paths.home}
)} />
>
<div className='px-6'> <SideBarItem
<div className='flex border-b-2 border-[#F5F7FC] pb-10'> icon={<MessageText size={iconSizeSideBar} color="#4F5260" />}
<img src={LogoImage} className='w-[120px]' /> title={'درخواست ها'}
</div> isActive={isActive('requests')}
link={Paths.requests.list}
/>
<SideBarItem
icon={<Element3 size={iconSizeSideBar} color="#4F5260" />}
title={'سفارشات'}
isActive={isActive('order')}
link={Paths.order.list}
/>
<SideBarItem
icon={<Receipt21 size={iconSizeSideBar} color="#4F5260" />}
title={'پیش فاکتور'}
isActive={isActive('/proforma-invoice')}
link={Paths.perfomaInvoice.list}
/>
<SideBarItem
icon={<ElementEqual size={iconSizeSideBar} color="#4F5260" />}
title={'محصولات'}
isActive={isActive('product')}
link={Paths.product.list}
/>
<SideBarItem
icon={<People size={iconSizeSideBar} color="#4F5260" />}
title={'مشتریان'}
isActive={isActive('customer')}
link={Paths.users.list}
/>
<SideBarItem
icon={<Printer size={iconSizeSideBar} color="#4F5260" />}
title={'چاپ'}
isActive={isActive('print')}
link={Paths.print.list}
/>
<SideBarItem
icon={<User size={iconSizeSideBar} color="#4F5260" />}
title={'ادمین'}
isActive={isActive('admin')}
link={Paths.admin.list}
/>
</div>
<div className="mt-10 px-6 text-description text-sm font-bold">{t('sidebar.other')}</div>
<div className="mt-3">
<SideBarItem
icon={<Profile2User size={iconSizeSideBar} color="#4F5260" />}
title={'کاربران'}
isActive={isActive('/tickets')}
link={Paths.tickets.list}
/>
<SideBarItem
icon={<Messages3 size={iconSizeSideBar} color="#4F5260" />}
title={t('sidebar.tickets')}
isActive={isActive('/tickets')}
link={Paths.tickets.list}
/>
<SideBarItem
icon={<NotificationStatus size={iconSizeSideBar} color="#4F5260" />}
title={t('sidebar.announcement')}
isActive={isActive('/announcement')}
link={Paths.announcement.list}
/>
<SideBarItem
icon={<DocumentText size={iconSizeSideBar} color="#4F5260" />}
title={t('sidebar.criticisms')}
isActive={isActive('/criticisms')}
link={Paths.criticisms.list}
/>
<SideBarItem
icon={<Teacher size={iconSizeSideBar} color="#4F5260" />}
title={t('sidebar.learning')}
isActive={isActive('/learning')}
link={Paths.learning.list}
/>
</div>
<div className="flex-1 items-end mt-14 pb-8">
<div className="bg-[#F5F7FC] rounded-2xl p-4 text-center">
<div className="text-[15px] font-medium">{t('sidebar.submitYourOrder')}</div>
<div className="mt-2.5 text-[13px] text-[#7B7E8B]">{t('sidebar.submitYourOrderDescription')}</div>
<Button className="flex items-center mt-2.5">
<div className="flex gap-1">
<AddSquare size={iconSizeSideBar} color="black" />
<div>{t('sidebar.newOrder')}</div>
</div> </div>
</Button>
</div>
<div className='flex-1 h-full overflow-y-auto no-scrollbar px-6'> {/* <div className='text-xs text-[#8C90A3]'>
<div className='mt-10 text-description px-6 text-header text-sm font-bold'>
{t('sidebar.menu')}
</div>
<div className='mt-3'>
<SideBarItem
icon={<Home2 size={iconSizeSideBar} color='#4F5260' />}
title={t('sidebar.mainPage')}
isActive={isActive('/home')}
link={Paths.home}
/>
<SideBarItem
icon={<MessageText size={iconSizeSideBar} color='#4F5260' />}
title={'درخواست ها'}
isActive={isActive('requests')}
link={Paths.requests.list}
/>
<SideBarItem
icon={<Element3 size={iconSizeSideBar} color='#4F5260' />}
title={'سفارشات'}
isActive={isActive('order')}
link={Paths.order.list}
/>
<SideBarItem
icon={<Receipt21 size={iconSizeSideBar} color='#4F5260' />}
title={'پیش فاکتور'}
isActive={isActive('/proforma-invoice')}
link={Paths.perfomaInvoice.list}
/>
<SideBarItem
icon={<ElementEqual size={iconSizeSideBar} color='#4F5260' />}
title={'محصولات'}
isActive={isActive('product')}
link={Paths.product.list}
/>
<SideBarItem
icon={<People size={iconSizeSideBar} color='#4F5260' />}
title={'مشتریان'}
isActive={isActive('customer')}
link={Paths.users.list}
/>
<SideBarItem
icon={<Printer size={iconSizeSideBar} color='#4F5260' />}
title={'چاپ'}
isActive={isActive('print')}
link={Paths.print.list}
/>
</div>
<div className='mt-10 px-6 text-description text-sm font-bold'>
{t('sidebar.other')}
</div>
<div className='mt-3'>
<SideBarItem
icon={<Profile2User size={iconSizeSideBar} color='#4F5260' />}
title={'کاربران'}
isActive={isActive('/tickets')}
link={Paths.tickets.list}
/>
<SideBarItem
icon={<Messages3 size={iconSizeSideBar} color='#4F5260' />}
title={t('sidebar.tickets')}
isActive={isActive('/tickets')}
link={Paths.tickets.list}
/>
<SideBarItem
icon={<NotificationStatus size={iconSizeSideBar} color='#4F5260' />}
title={t('sidebar.announcement')}
isActive={isActive('/announcement')}
link={Paths.announcement.list}
/>
<SideBarItem
icon={<DocumentText size={iconSizeSideBar} color='#4F5260' />}
title={t('sidebar.criticisms')}
isActive={isActive('/criticisms')}
link={Paths.criticisms.list}
/>
<SideBarItem
icon={<Teacher size={iconSizeSideBar} color='#4F5260' />}
title={t('sidebar.learning')}
isActive={isActive('/learning')}
link={Paths.learning.list}
/>
</div>
<div className='flex-1 items-end mt-14 pb-8'>
<div className='bg-[#F5F7FC] rounded-2xl p-4 text-center'>
<div className='text-[15px] font-medium'>{t('sidebar.submitYourOrder')}</div>
<div className='mt-2.5 text-[13px] text-[#7B7E8B]'>{t('sidebar.submitYourOrderDescription')}</div>
<Button
className='flex items-center mt-2.5'
>
<div className='flex gap-1'>
<AddSquare size={iconSizeSideBar} color='black' />
<div>{t('sidebar.newOrder')}</div>
</div>
</Button>
</div>
{/* <div className='text-xs text-[#8C90A3]'>
<SideBarItem <SideBarItem
icon={<Logout variant={isActive('logout') ? 'Bold' : 'Outline'} color={isActive('logout') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />} icon={<Logout variant={isActive('logout') ? 'Bold' : 'Outline'} color={isActive('logout') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.logout')} title={t('sidebar.logout')}
@@ -161,11 +175,11 @@ const SideBar: FC = () => {
isLogout isLogout
/> />
</div> */} </div> */}
</div> </div>
</div> </div>
</div> </div>
</> </>
) );
} };
export default SideBar export default SideBar;