diff --git a/src/pages/admin-users/admin-users-list/AdminUsersListPage.tsx b/src/pages/admin-users/admin-users-list/AdminUsersListPage.tsx index 69f6601..e01a741 100644 --- a/src/pages/admin-users/admin-users-list/AdminUsersListPage.tsx +++ b/src/pages/admin-users/admin-users-list/AdminUsersListPage.tsx @@ -7,6 +7,81 @@ import { LoadingSpinner } from "@/components/ui/LoadingSpinner"; import { Trash2, Edit3, Plus, Eye, Users, UserPlus } from "lucide-react"; import { Modal } from "@/components/ui/Modal"; +// Skeleton Loading Component +const AdminUserTableSkeleton = () => ( +
+ {/* Desktop Table Skeleton */} +
+
+ + + + + + + + + + + + {[...Array(5)].map((_, index) => ( + + + + + + + + ))} + +
+ نام و نام خانوادگی + + نام کاربری + + وضعیت + + تاریخ ایجاد + + عملیات +
+
+ 		+
+ 		+
+ 		+
+ 		+
+
+
+
+
+
+
+
+ + {/* Mobile Cards Skeleton */} +
+ {[...Array(3)].map((_, index) => ( +
+
+
+
+
+
+
+
+
+
+
+
+ ))} +
+
+); + const AdminUsersListPage = () => { const navigate = useNavigate(); const [deleteUserId, setDeleteUserId] = useState(null); @@ -48,55 +123,47 @@ const AdminUsersListPage = () => { setFilters(prev => ({ ...prev, status: e.target.value })); }; - if (isLoading) { - return ( -
- -
- ); - } - if (error) { return ( -
-

خطا در بارگذاری کاربران ادمین

+
+
+

خطا در بارگذاری کاربران ادمین

+
); } return ( -
+
{/* Header */} -
+
-

+

+ مدیریت کاربران ادمین

- مدیریت کاربران ادمین سیستم + مدیریت کاربران دسترسی به پنل ادمین

-
{/* Filters */} -
-
+
+
@@ -118,118 +185,155 @@ const AdminUsersListPage = () => {
{/* Users Table */} -
- {(users || []).length === 0 ? ( + {isLoading ? ( + + ) : (users || []).length === 0 ? ( +

هیچ کاربر ادمین یافت نشد

- شما هنوز هیچ کاربر ادمین ایجاد نکرده‌اید + {filters.search || filters.status + ? "نتیجه‌ای برای جستجوی شما یافت نشد" + : "شما هنوز هیچ کاربر ادمین ایجاد نکرده‌اید" + }

- ) : ( -
- - - - - - - - - - - - - {(users || []).map((user: AdminUserInfo) => ( - - - - - - - + + ) : ( +
+ {/* Desktop Table */} +
+
+
- کاربر - - نام کاربری - - وضعیت - - نقش‌ها - - تاریخ ایجاد - - عملیات -
-
-
- - {user.first_name?.[0]}{user.last_name?.[0]} - -
-
-
- {user.first_name} {user.last_name} -
-
-
- 		- {user.username} - - - {user.status === 'active' ? 'فعال' : 'غیرفعال'} - - - - {user.roles?.length || 0} نقش - - - {new Date(user.created_at).toLocaleDateString('fa-IR')} - - - - -
+ + + + + + + - ))} - -
+ نام و نام خانوادگی + + نام کاربری + + وضعیت + + تاریخ ایجاد + + عملیات +
+ + + {(users || []).map((user: AdminUserInfo) => ( + + + {user.first_name} {user.last_name} + + + {user.username} + + + + {user.status === 'active' ? 'فعال' : 'غیرفعال'} + + + + {new Date(user.created_at).toLocaleDateString('fa-IR')} + + +
+ + + +
+ + + ))} + + +
- )} -
+ + {/* Mobile Cards */} +
+ {(users || []).map((user: AdminUserInfo) => ( +
+
+
+

+ {user.first_name} {user.last_name} +

+

+ {user.username} +

+
+ + {user.status === 'active' ? 'فعال' : 'غیرفعال'} + +
+
+ تاریخ ایجاد: {new Date(user.created_at).toLocaleDateString('fa-IR')} +
+
+ + + +
+
+ ))} +
+
+ )} {/* Delete Confirmation Modal */} ( +
+ {/* Desktop Table Skeleton */} +
+
+ + + + + + + + + + + {[...Array(5)].map((_, index) => ( + + + + + + + ))} + +
+ عنوان + + توضیحات + + تاریخ ایجاد + + عملیات +
+
+ 		+
+ 		+
+ 		+
+
+
+
+
+
+
+ + {/* Mobile Cards Skeleton */} +
+ {[...Array(3)].map((_, index) => ( +
+
+
+
+
+
+
+
+
+
+
+ ))} +
+
+); + const PermissionsListPage = () => { const navigate = useNavigate(); const [deletePermissionId, setDeletePermissionId] = useState(null); @@ -43,55 +110,47 @@ const PermissionsListPage = () => { setFilters(prev => ({ ...prev, search: e.target.value })); }; - if (isLoading) { - return ( -
- -
- ); - } - if (error) { return ( -
-

خطا در بارگذاری دسترسی‌ها

+
+
+

خطا در بارگذاری دسترسی‌ها

+
); } return ( -
+
{/* Header */} -
+
-

+

+ مدیریت دسترسی‌ها

مدیریت دسترسی‌های سیستم

-
{/* Filters */} -
-
+
+
@@ -99,108 +158,124 @@ const PermissionsListPage = () => {
{/* Permissions Table */} -
- {(permissions || []).length === 0 ? ( + {isLoading ? ( + + ) : (permissions || []).length === 0 ? ( +

هیچ دسترسی یافت نشد

- شما هنوز هیچ دسترسی ایجاد نکرده‌اید + {filters.search + ? "نتیجه‌ای برای جستجوی شما یافت نشد" + : "شما هنوز هیچ دسترسی ایجاد نکرده‌اید" + }

- ) : ( -
- - - - - - - - - - - - {(permissions || []).map((permission: Permission) => ( - - - - - - + + ) : ( +
+ {/* Desktop Table */} +
+
+
- عنوان - - توضیحات - - تاریخ ایجاد - - تاریخ به‌روزرسانی - - عملیات -
-
-
- -
-
-
- {permission.title} -
-
- ID: {permission.id} -
-
-
- 		-
- {permission.description} -
- 		- {new Date(permission.created_at).toLocaleDateString('fa-IR')} - - {new Date(permission.updated_at).toLocaleDateString('fa-IR')} - - - - -
+ + + + + + - ))} - -
+ عنوان + + توضیحات + + تاریخ ایجاد + + عملیات +
+ + + {(permissions || []).map((permission: Permission) => ( + + + {permission.title} + + + {permission.description} + + + {new Date(permission.created_at).toLocaleDateString('fa-IR')} + + +
+ + +
+ + + ))} + + +
- )} -
+ + {/* Mobile Cards */} +
+ {(permissions || []).map((permission: Permission) => ( +
+
+
+

+ {permission.title} +

+

+ {permission.description} +

+
+
+
+ تاریخ ایجاد: {new Date(permission.created_at).toLocaleDateString('fa-IR')} +
+
+ + +
+
+ ))} +
+
+ )} {/* Delete Confirmation Modal */} ( +
+ {/* Desktop Table Skeleton */} +
+
+ + + + + + + + + + + {[...Array(5)].map((_, index) => ( + + + + + + + ))} + +
+ نام نقش + + توضیحات + + تاریخ ایجاد + + عملیات +
+
+ 		+
+ 		+
+ 		+
+
+
+
+
+
+
+
+ + {/* Mobile Cards Skeleton */} +
+ {[...Array(3)].map((_, index) => ( +
+
+
+
+
+
+
+
+
+
+
+
+ ))} +
+
+); + const RolesListPage = () => { const navigate = useNavigate(); const [deleteRoleId, setDeleteRoleId] = useState(null); + const [filters, setFilters] = useState({ + search: '' + }); - const { data: roles, isLoading, error } = useRoles(); + const { data: roles, isLoading, error } = useRoles(filters); const { mutate: deleteRole, isPending: isDeleting } = useDeleteRole(); - const handleEdit = (roleId: number) => { - navigate(`/roles/${roleId}/edit`); + const handleCreate = () => { + navigate('/roles/create'); }; const handleView = (roleId: number) => { navigate(`/roles/${roleId}`); }; + const handleEdit = (roleId: number) => { + navigate(`/roles/${roleId}/edit`); + }; + const handlePermissions = (roleId: number) => { navigate(`/roles/${roleId}/permissions`); }; - const handleDelete = (roleId: number) => { - setDeleteRoleId(roleId.toString()); - }; - - const confirmDelete = () => { + const handleDeleteConfirm = () => { if (deleteRoleId) { deleteRole(deleteRoleId, { onSuccess: () => { @@ -40,123 +112,213 @@ const RolesListPage = () => { } }; + const handleSearchChange = (e: React.ChangeEvent) => { + setFilters(prev => ({ ...prev, search: e.target.value })); + }; + + const handleDelete = (roleId: number) => { + setDeleteRoleId(roleId.toString()); + }; + const cancelDelete = () => { setDeleteRoleId(null); }; - if (isLoading) return ; - if (error) return
خطا در بارگذاری نقش‌ها
; + if (error) { + return ( +
+
+

خطا در بارگذاری نقش‌ها

+
+
+ ); + } return ( -
-
-
-

+
+ {/* Header */} +
+
+

+ مدیریت نقش‌ها

- +

+ مدیریت نقش‌ها و دسترسی‌های سیستم +

+
-
-
- - - - - - - - - - - - {(roles || []).map((role: Role) => ( - - - - - - - ))} - -
- نام نقش - - توضیحات - - تعداد دسترسی‌ها - - تاریخ ایجاد - - عملیات -
-
- {role.title} -
-
- {role.description} -
- 		- - {role.permissions?.length || 0} دسترسی - - - {new Date(role.created_at).toLocaleDateString('fa-IR')} - - - - - -
-
- - {roles?.length === 0 && ( -
-

هیچ نقشی یافت نشد

+ {/* Filters */} +
+
+
+ +
- )} +
+ {/* Roles Table */} + {isLoading ? ( + + ) : (roles || []).length === 0 ? ( +
+
+ +

+ هیچ نقش یافت نشد +

+

+ {filters.search + ? "نتیجه‌ای برای جستجوی شما یافت نشد" + : "شما هنوز هیچ نقش ایجاد نکرده‌اید" + } +

+ +
+
+ ) : ( +
+ {/* Desktop Table */} +
+
+ + + + + + + + + + + {(roles || []).map((role: Role) => ( + + + + + + + ))} + +
+ نام نقش + + توضیحات + + تاریخ ایجاد + + عملیات +
+ {role.name} + + {role.description} + + {new Date(role.created_at).toLocaleDateString('fa-IR')} + +
+ + + + +
+
+
+
+ + {/* Mobile Cards */} +
+ {(roles || []).map((role: Role) => ( +
+
+
+

+ {role.name} +

+

+ {role.description} +

+
+
+
+ تاریخ ایجاد: {new Date(role.created_at).toLocaleDateString('fa-IR')} +
+
+ + + + +
+
+ ))} +
+
+ )} + {/* Delete Confirmation Modal */} {