Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| c20f083115 | |||
| 9ac1e0fc4f | |||
| 1f456f4d17 | |||
| adf180bc5f | |||
| 9ec195870a | |||
| c13a3042c1 |
@@ -11,7 +11,7 @@ import { makeRouter } from "./routes/routes";
|
||||
import { useDarkMode } from "./hooks/useDarkMode";
|
||||
import { ItemWithSubItems } from "./types/userPermissions";
|
||||
import { useFetchProfile } from "./hooks/useFetchProfile";
|
||||
import { getInspectionMenuItems } from "./screen/SideBar";
|
||||
import { getInspectionMenuItems } from "./config/menuItems";
|
||||
|
||||
const versionNumber = "/src/version.txt";
|
||||
import "./index.css";
|
||||
@@ -127,7 +127,7 @@ export default function App() {
|
||||
window.history.replaceState(
|
||||
{},
|
||||
document.title,
|
||||
url.pathname + url.search
|
||||
url.pathname + url.search,
|
||||
);
|
||||
}
|
||||
}, []);
|
||||
|
||||
@@ -4,99 +4,26 @@ import { useUserProfileStore } from "../context/zustand-store/userStore";
|
||||
import { getFaPermissions } from "../utils/getFaPermissions";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
import {
|
||||
UsersIcon,
|
||||
DocumentTextIcon,
|
||||
ChartBarIcon,
|
||||
ChevronDownIcon,
|
||||
UserIcon,
|
||||
GlobeAsiaAustraliaIcon,
|
||||
MapPinIcon,
|
||||
} from "@heroicons/react/24/outline";
|
||||
import { ItemWithSubItems } from "../types/userPermissions";
|
||||
import { checkMenuPermission } from "../utils/checkMenuPermission";
|
||||
import { getInspectionMenuItems } from "../config/menuItems";
|
||||
|
||||
const getInspectionMenuItems = (
|
||||
permissions: string[] = []
|
||||
): ItemWithSubItems[] => {
|
||||
const items: ItemWithSubItems[] = [];
|
||||
|
||||
if (checkMenuPermission("nationalinfo", permissions)) {
|
||||
items.push({
|
||||
en: "nationalinfo",
|
||||
fa: "اطلاعات",
|
||||
icon: () => <UserIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "nationalinfo",
|
||||
path: "/nationalinfo",
|
||||
component: () => import("./NationalInfo"),
|
||||
},
|
||||
{
|
||||
name: "ladinginfo",
|
||||
path: "/ladinginfo",
|
||||
component: () => import("./LadingInfo"),
|
||||
},
|
||||
{
|
||||
name: "veterinarytransfer",
|
||||
path: "/veterinarytransfer",
|
||||
component: () => import("./VeterinaryTransfer"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("users", permissions)) {
|
||||
items.push({
|
||||
en: "users",
|
||||
fa: "کاربران",
|
||||
icon: () => <UsersIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "users",
|
||||
path: "/users",
|
||||
component: () => import("./Users"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("inspections", permissions)) {
|
||||
items.push({
|
||||
en: "inspections",
|
||||
fa: "سوابق بازرسی",
|
||||
icon: () => <DocumentTextIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "inspections",
|
||||
path: "/inspections",
|
||||
component: () => import("./UserInspections"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("statics", permissions)) {
|
||||
items.push({
|
||||
en: "statics",
|
||||
fa: "آمار",
|
||||
icon: () => <ChartBarIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "statics",
|
||||
path: "/statics",
|
||||
component: () => import("./Statics"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
return items;
|
||||
};
|
||||
const ADMIN_PROVINCES = [
|
||||
{ value: "hamedan", label: "همدان" },
|
||||
{ value: "markazi", label: "مرکزی" },
|
||||
] as const;
|
||||
|
||||
export const Menu = () => {
|
||||
const { profile } = useUserProfileStore();
|
||||
const { profile, updateProfile } = useUserProfileStore();
|
||||
const navigate = useNavigate();
|
||||
const menuItems = getInspectionMenuItems(profile?.permissions || []);
|
||||
const [openIndex, setOpenIndex] = useState<number | null>(null);
|
||||
const hasAdmin =
|
||||
Array.isArray(profile?.permissions) &&
|
||||
profile.permissions.includes("admin");
|
||||
const currentProvince = profile?.province || "hamedan";
|
||||
|
||||
const toggleSubmenu = (index: number) => {
|
||||
setOpenIndex((prev) => (prev === index ? null : index));
|
||||
@@ -110,7 +37,7 @@ export const Menu = () => {
|
||||
منو
|
||||
</h1>
|
||||
|
||||
<div className="mb-4">
|
||||
<div className="mb-4 space-y-3">
|
||||
<button
|
||||
onClick={() => navigate({ to: "/" })}
|
||||
className="w-full flex items-center justify-center gap-2 px-4 py-3 rounded-xl bg-primary-500 hover:bg-primary-600 cursor-pointer dark:bg-primary-800 dark:hover:bg-primary-700 text-white font-semibold text-sm transition-all duration-200 shadow-md hover:shadow-lg"
|
||||
@@ -118,6 +45,30 @@ export const Menu = () => {
|
||||
<GlobeAsiaAustraliaIcon className="w-5 h-5" />
|
||||
<span>مشاهده نقشه</span>
|
||||
</button>
|
||||
{hasAdmin && (
|
||||
<div className="flex flex-col gap-2 p-3 rounded-xl bg-white dark:bg-dark-700 border border-gray-200 dark:border-dark-600">
|
||||
<div className="flex items-center gap-2 text-sm font-medium text-gray-600 dark:text-gray-400">
|
||||
<MapPinIcon className="w-4 h-4 shrink-0" />
|
||||
<span>استان</span>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
{ADMIN_PROVINCES.map(({ value, label }) => (
|
||||
<button
|
||||
key={value}
|
||||
type="button"
|
||||
onClick={() => updateProfile({ province: value })}
|
||||
className={`px-4 py-2.5 rounded-lg text-sm font-medium transition-all ${
|
||||
currentProvince === value
|
||||
? "bg-primary-500 text-white dark:bg-primary-600 shadow-md"
|
||||
: "bg-gray-100 dark:bg-dark-600 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-dark-500"
|
||||
}`}
|
||||
>
|
||||
{label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
|
||||
@@ -12,6 +12,7 @@ import { DeleteButtonForPopOver } from "../components/PopOverButtons/PopOverButt
|
||||
import { getFaPermissions } from "../utils/getFaPermissions";
|
||||
import { getFaProvince } from "../utils/getFaProvince";
|
||||
import { getFaCityName } from "../utils/getFaCityName";
|
||||
import { Tooltip } from "../components/Tooltip/Tooltip";
|
||||
|
||||
const Users: React.FC = () => {
|
||||
const { profile } = useUserProfileStore();
|
||||
@@ -38,19 +39,32 @@ const Users: React.FC = () => {
|
||||
)) || "-",
|
||||
getFaProvince(item?.province || ""),
|
||||
getFaCityName(item?.city || ""),
|
||||
item?.mobile === profile?.mobile ? (
|
||||
<Typography variant="body2" className="text-gray-400">
|
||||
-
|
||||
</Typography>
|
||||
) : (
|
||||
<Popover key={i}>
|
||||
<DeleteButtonForPopOver
|
||||
|
||||
<Popover key={i}>
|
||||
<Tooltip title="ویرایش" position="right">
|
||||
<Button
|
||||
variant="edit"
|
||||
access="add"
|
||||
api={`users/${item?._id || item?.Id}`}
|
||||
getData={refetch}
|
||||
onClick={() => {
|
||||
openDrawer({
|
||||
title: "ویرایش کاربر",
|
||||
content: (
|
||||
<SubmitNewUser
|
||||
province={profile?.province || ""}
|
||||
onSuccess={refetch}
|
||||
item={item}
|
||||
/>
|
||||
),
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Popover>
|
||||
),
|
||||
</Tooltip>
|
||||
<DeleteButtonForPopOver
|
||||
access="add"
|
||||
api={`users/${item?._id || item?.Id}`}
|
||||
getData={refetch}
|
||||
/>
|
||||
</Popover>,
|
||||
];
|
||||
});
|
||||
setTableData(d);
|
||||
|
||||
86
src/config/menuItems.tsx
Normal file
86
src/config/menuItems.tsx
Normal file
@@ -0,0 +1,86 @@
|
||||
import {
|
||||
UsersIcon,
|
||||
DocumentTextIcon,
|
||||
ChartBarIcon,
|
||||
UserIcon,
|
||||
} from "@heroicons/react/24/outline";
|
||||
import { ItemWithSubItems } from "../types/userPermissions";
|
||||
import { checkMenuPermission } from "../utils/checkMenuPermission";
|
||||
|
||||
export const getInspectionMenuItems = (
|
||||
permissions: string[] = [],
|
||||
): ItemWithSubItems[] => {
|
||||
const items: ItemWithSubItems[] = [];
|
||||
|
||||
if (checkMenuPermission("nationalinfo", permissions)) {
|
||||
items.push({
|
||||
en: "nationalinfo",
|
||||
fa: "اطلاعات",
|
||||
icon: () => <UserIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "nationalinfo",
|
||||
path: "/nationalinfo",
|
||||
component: () => import("../Pages/NationalInfo"),
|
||||
},
|
||||
{
|
||||
name: "ladinginfo",
|
||||
path: "/ladinginfo",
|
||||
component: () => import("../Pages/LadingInfo"),
|
||||
},
|
||||
{
|
||||
name: "veterinarytransfer",
|
||||
path: "/veterinarytransfer",
|
||||
component: () => import("../Pages/VeterinaryTransfer"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("users", permissions)) {
|
||||
items.push({
|
||||
en: "users",
|
||||
fa: "کاربران",
|
||||
icon: () => <UsersIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "users",
|
||||
path: "/users",
|
||||
component: () => import("../Pages/Users"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("inspections", permissions)) {
|
||||
items.push({
|
||||
en: "inspections",
|
||||
fa: "سوابق بازرسی",
|
||||
icon: () => <DocumentTextIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "inspections",
|
||||
path: "/inspections",
|
||||
component: () => import("../Pages/UserInspections"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("statics", permissions)) {
|
||||
items.push({
|
||||
en: "statics",
|
||||
fa: "آمار",
|
||||
icon: () => <ChartBarIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "statics",
|
||||
path: "/statics",
|
||||
component: () => import("../Pages/Statics"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
return items;
|
||||
};
|
||||
@@ -5,12 +5,13 @@ import { useDashboardTabStore } from "./dashboardTabStore";
|
||||
interface UseUserProfileStore {
|
||||
profile?: Record<string, any> | null;
|
||||
setUserProfile: (profile: Record<string, any>) => void;
|
||||
updateProfile: (updates: Partial<Record<string, any>>) => void;
|
||||
clearProfile: () => void;
|
||||
}
|
||||
|
||||
const arePermissionsEqual = (
|
||||
permissions1?: string[],
|
||||
permissions2?: string[]
|
||||
permissions2?: string[],
|
||||
): boolean => {
|
||||
if (!permissions1 && !permissions2) return true;
|
||||
if (!permissions1 || !permissions2) return false;
|
||||
@@ -24,7 +25,7 @@ const arePermissionsEqual = (
|
||||
|
||||
const areProfilesEqual = (
|
||||
currentProfile: Record<string, any> | null | undefined,
|
||||
newProfile: Record<string, any>
|
||||
newProfile: Record<string, any>,
|
||||
): boolean => {
|
||||
if (!currentProfile) return false;
|
||||
|
||||
@@ -35,10 +36,10 @@ const areProfilesEqual = (
|
||||
}
|
||||
|
||||
const currentKeys = Object.keys(currentProfile).filter(
|
||||
(key) => key !== "permissions"
|
||||
(key) => key !== "permissions",
|
||||
);
|
||||
const newKeys = Object.keys(newProfile).filter(
|
||||
(key) => key !== "permissions"
|
||||
(key) => key !== "permissions",
|
||||
);
|
||||
|
||||
if (currentKeys.length !== newKeys.length) return false;
|
||||
@@ -72,10 +73,15 @@ export const useUserProfileStore = create<UseUserProfileStore>()(
|
||||
console.log("profile", profile);
|
||||
}
|
||||
},
|
||||
updateProfile: (updates) => {
|
||||
const currentProfile = get().profile;
|
||||
if (!currentProfile) return;
|
||||
set({ profile: { ...currentProfile, ...updates } });
|
||||
},
|
||||
clearProfile: () => set({ profile: null }),
|
||||
}),
|
||||
{ name: "userprofile" }
|
||||
)
|
||||
{ name: "userprofile" },
|
||||
),
|
||||
);
|
||||
|
||||
interface UseUserStore {
|
||||
@@ -97,6 +103,6 @@ export const useUserStore = create<UseUserStore>()(
|
||||
}),
|
||||
{
|
||||
name: "user",
|
||||
}
|
||||
)
|
||||
},
|
||||
),
|
||||
);
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import React, { useState } from "react";
|
||||
import { motion, Variants } from "framer-motion";
|
||||
import { useNavigate } from "@tanstack/react-router";
|
||||
import { useApiMutation } from "../../utils/useApiRequest";
|
||||
@@ -52,12 +52,6 @@ const Login: React.FC = () => {
|
||||
disableBackdrop: false,
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (phoneNumber && phoneNumber.length >= 10) {
|
||||
handleGetCaptcha();
|
||||
}
|
||||
}, [phoneNumber]);
|
||||
|
||||
const handleGetCaptcha = async () => {
|
||||
try {
|
||||
const data = await mutationCaptcha.mutateAsync({
|
||||
|
||||
@@ -17,25 +17,42 @@ import {
|
||||
zValidateAutoComplete,
|
||||
} from "../../data/getFormTypeErrors";
|
||||
|
||||
interface UserItem {
|
||||
_id?: string;
|
||||
Id?: string;
|
||||
mobile?: string;
|
||||
fullname?: string;
|
||||
permissions?: string[];
|
||||
province?: string;
|
||||
city?: string;
|
||||
}
|
||||
|
||||
interface SubmitNewUserProps {
|
||||
province: string;
|
||||
onSuccess?: () => void;
|
||||
item?: UserItem | null;
|
||||
}
|
||||
|
||||
const schema = z.object({
|
||||
mobile: zValidateMobile("موبایل"),
|
||||
password: zValidateString("کلمه عبور"),
|
||||
fullname: zValidateString("نام کامل"),
|
||||
permissions: zValidateAutoComplete("دسترسیها"),
|
||||
city: zValidateAutoComplete("شهر"),
|
||||
});
|
||||
const getSchema = (isEdit: boolean) =>
|
||||
z.object({
|
||||
mobile: zValidateMobile("موبایل"),
|
||||
password: isEdit ? z.string().optional() : zValidateString("کلمه عبور"),
|
||||
fullname: zValidateString("نام کامل"),
|
||||
permissions: zValidateAutoComplete("دسترسیها"),
|
||||
city: zValidateAutoComplete("شهر"),
|
||||
});
|
||||
|
||||
type FormValues = z.infer<typeof schema>;
|
||||
type FormValues = z.infer<ReturnType<typeof getSchema>>;
|
||||
|
||||
export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
|
||||
export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({
|
||||
onSuccess,
|
||||
item,
|
||||
}) => {
|
||||
const { profile } = useUserProfileStore();
|
||||
const showToast = useToast();
|
||||
const { closeDrawer } = useDrawerStore();
|
||||
const isEdit = !!item;
|
||||
const schema = useMemo(() => getSchema(isEdit), [isEdit]);
|
||||
|
||||
const {
|
||||
control,
|
||||
@@ -44,20 +61,33 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
|
||||
formState: { errors, isSubmitting },
|
||||
} = useForm<FormValues>({
|
||||
resolver: zodResolver(schema),
|
||||
defaultValues: {
|
||||
mobile: "",
|
||||
password: "",
|
||||
fullname: "",
|
||||
permissions: [],
|
||||
city: [],
|
||||
},
|
||||
defaultValues: item
|
||||
? {
|
||||
mobile: item.mobile ?? "",
|
||||
password: "",
|
||||
fullname: item.fullname ?? "",
|
||||
permissions: Array.isArray(item.permissions) ? item.permissions : [],
|
||||
city: item.city ? [item.city] : [],
|
||||
}
|
||||
: {
|
||||
mobile: "",
|
||||
password: "",
|
||||
fullname: "",
|
||||
permissions: [],
|
||||
city: [],
|
||||
},
|
||||
});
|
||||
|
||||
const submitUserMutation = useApiMutation({
|
||||
const createUserMutation = useApiMutation({
|
||||
api: "user",
|
||||
method: "post",
|
||||
});
|
||||
|
||||
const updateUserMutation = useApiMutation({
|
||||
api: `user/${item?._id ?? item?.Id ?? ""}`,
|
||||
method: "put",
|
||||
});
|
||||
|
||||
const cityOptions = useMemo(() => {
|
||||
return getCitiesOfProvinceInfo(profile?.province || "").map((item) => ({
|
||||
key: item.en,
|
||||
@@ -65,18 +95,23 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
|
||||
}));
|
||||
}, [profile?.province]);
|
||||
|
||||
const hasAdminPermission = profile?.permissions?.includes("admin");
|
||||
|
||||
const permissionOptions = useMemo(() => {
|
||||
return [
|
||||
const options = [
|
||||
{ key: "add", value: "ثبت کاربر" },
|
||||
{ key: "submit", value: "ثبت بازرسی" },
|
||||
];
|
||||
}, []);
|
||||
if (hasAdminPermission) {
|
||||
options.push({ key: "admin", value: "ادمین" });
|
||||
}
|
||||
return options;
|
||||
}, [hasAdminPermission]);
|
||||
|
||||
const onSubmit = async (data: FormValues) => {
|
||||
try {
|
||||
const payload = {
|
||||
const basePayload = {
|
||||
mobile: data.mobile,
|
||||
password: data.password,
|
||||
fullname: data.fullname,
|
||||
pic: "",
|
||||
permissions: data.permissions as string[],
|
||||
@@ -87,15 +122,34 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
|
||||
: "",
|
||||
};
|
||||
|
||||
await submitUserMutation.mutateAsync(payload);
|
||||
showToast("کاربر با موفقیت ثبت شد", "success");
|
||||
if (isEdit) {
|
||||
const payload =
|
||||
data.password && String(data.password).trim() !== ""
|
||||
? { ...basePayload, password: data.password }
|
||||
: basePayload;
|
||||
await updateUserMutation.mutateAsync(payload);
|
||||
showToast("کاربر با موفقیت ویرایش شد", "success");
|
||||
} else {
|
||||
if (!data.password || String(data.password).trim() === "") {
|
||||
showToast("کلمه عبور را وارد کنید", "error");
|
||||
return;
|
||||
}
|
||||
const payload = { ...basePayload, password: data.password };
|
||||
await createUserMutation.mutateAsync(payload);
|
||||
showToast("کاربر با موفقیت ثبت شد", "success");
|
||||
}
|
||||
closeDrawer();
|
||||
if (onSuccess) {
|
||||
onSuccess();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
showToast("مشکلی پیش آمده است، ممکن است کاربر تکراری باشد!", "error");
|
||||
showToast(
|
||||
isEdit
|
||||
? "مشکلی پیش آمده است!"
|
||||
: "مشکلی پیش آمده است، ممکن است کاربر تکراری باشد!",
|
||||
"error",
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -198,9 +252,13 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
|
||||
type="submit"
|
||||
variant="submit"
|
||||
fullWidth
|
||||
disabled={isSubmitting || submitUserMutation.isPending}
|
||||
disabled={
|
||||
isSubmitting ||
|
||||
createUserMutation.isPending ||
|
||||
updateUserMutation.isPending
|
||||
}
|
||||
>
|
||||
ثبت کاربر
|
||||
{isEdit ? "ذخیره تغییرات" : "ثبت کاربر"}
|
||||
</Button>
|
||||
</Grid>
|
||||
</form>
|
||||
|
||||
@@ -17,15 +17,7 @@ export function makeRouter(auth: string | null) {
|
||||
try {
|
||||
const routeConfigs = getRoutes(auth);
|
||||
|
||||
console.log(
|
||||
"Creating router with routes:",
|
||||
routeConfigs.length,
|
||||
"auth:",
|
||||
!!auth
|
||||
);
|
||||
|
||||
if (routeConfigs.length === 0) {
|
||||
console.log("No routes found, adding default Auth route");
|
||||
routeConfigs.push({ path: "/", component: Auth });
|
||||
}
|
||||
|
||||
@@ -57,7 +49,6 @@ export function makeRouter(auth: string | null) {
|
||||
defaultPreload: "intent",
|
||||
});
|
||||
|
||||
console.log("Router created successfully");
|
||||
return router;
|
||||
} catch (error) {
|
||||
console.error("Error creating router:", error);
|
||||
|
||||
@@ -4,24 +4,25 @@ import { useState } from "react";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
import { ChevronDownIcon } from "@heroicons/react/24/solid";
|
||||
import { useUserProfileStore } from "../context/zustand-store/userStore";
|
||||
import { ItemWithSubItems } from "../types/userPermissions";
|
||||
import { useNavigate } from "@tanstack/react-router";
|
||||
import { getFaPermissions } from "../utils/getFaPermissions";
|
||||
import { useSideBarStore } from "../context/zustand-store/appStore";
|
||||
import SVGImage from "../components/SvgImage/SvgImage";
|
||||
import { checkMenuPermission } from "../utils/checkMenuPermission";
|
||||
import { getInspectionMenuItems } from "../config/menuItems";
|
||||
import {
|
||||
ChevronLeftIcon,
|
||||
ChevronRightIcon,
|
||||
MagnifyingGlassIcon,
|
||||
BuildingOfficeIcon,
|
||||
UsersIcon,
|
||||
DocumentTextIcon,
|
||||
ChartBarIcon,
|
||||
UserIcon,
|
||||
GlobeAsiaAustraliaIcon,
|
||||
MapPinIcon,
|
||||
} from "@heroicons/react/24/outline";
|
||||
|
||||
const ADMIN_PROVINCES = [
|
||||
{ value: "hamedan", label: "همدان" },
|
||||
{ value: "markazi", label: "مرکزی" },
|
||||
] as const;
|
||||
|
||||
const containerVariants = {
|
||||
hidden: {},
|
||||
visible: { transition: { staggerChildren: 0.03 } },
|
||||
@@ -69,91 +70,14 @@ const sidebarVariants = {
|
||||
},
|
||||
};
|
||||
|
||||
export const getInspectionMenuItems = (
|
||||
permissions: string[] = []
|
||||
): ItemWithSubItems[] => {
|
||||
const items: ItemWithSubItems[] = [];
|
||||
|
||||
if (checkMenuPermission("nationalinfo", permissions)) {
|
||||
items.push({
|
||||
en: "nationalinfo",
|
||||
fa: "اطلاعات",
|
||||
icon: () => <UserIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "nationalinfo",
|
||||
path: "/nationalinfo",
|
||||
component: () => import("../Pages/NationalInfo"),
|
||||
},
|
||||
|
||||
{
|
||||
name: "ladinginfo",
|
||||
path: "/ladinginfo",
|
||||
component: () => import("../Pages/LadingInfo"),
|
||||
},
|
||||
{
|
||||
name: "veterinarytransfer",
|
||||
path: "/veterinarytransfer",
|
||||
component: () => import("../Pages/VeterinaryTransfer"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("users", permissions)) {
|
||||
items.push({
|
||||
en: "users",
|
||||
fa: "کاربران",
|
||||
icon: () => <UsersIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "users",
|
||||
path: "/users",
|
||||
component: () => import("../Pages/Users"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("inspections", permissions)) {
|
||||
items.push({
|
||||
en: "inspections",
|
||||
fa: "سوابق بازرسی",
|
||||
icon: () => <DocumentTextIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "inspections",
|
||||
path: "/inspections",
|
||||
component: () => import("../Pages/UserInspections"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
if (checkMenuPermission("statics", permissions)) {
|
||||
items.push({
|
||||
en: "statics",
|
||||
fa: "آمار",
|
||||
icon: () => <ChartBarIcon className="w-6 h-6" />,
|
||||
subItems: [
|
||||
{
|
||||
name: "statics",
|
||||
path: "/statics",
|
||||
component: () => import("../Pages/Statics"),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
|
||||
return items;
|
||||
};
|
||||
|
||||
export const SideBar = () => {
|
||||
const isMobile = checkIsMobile();
|
||||
const { profile } = useUserProfileStore();
|
||||
const menuItems: ItemWithSubItems[] = getInspectionMenuItems(
|
||||
profile?.permissions || []
|
||||
);
|
||||
const { profile, updateProfile } = useUserProfileStore();
|
||||
const menuItems = getInspectionMenuItems(profile?.permissions || []);
|
||||
const hasAdmin =
|
||||
Array.isArray(profile?.permissions) &&
|
||||
profile.permissions.includes("admin");
|
||||
const currentProvince = profile?.province || "hamedan";
|
||||
const [search, setSearch] = useState("");
|
||||
|
||||
const { isSideBarOpen, toggleSideBar } = useSideBarStore();
|
||||
@@ -161,7 +85,7 @@ export const SideBar = () => {
|
||||
const getOpenedItem = () => {
|
||||
if (window.location.pathname !== "/") {
|
||||
const matchedIndex = menuItems.findIndex((item) =>
|
||||
item.subItems.some((sub) => sub.path === window.location.pathname)
|
||||
item.subItems.some((sub) => sub.path === window.location.pathname),
|
||||
);
|
||||
return matchedIndex;
|
||||
} else {
|
||||
@@ -180,7 +104,7 @@ export const SideBar = () => {
|
||||
getFaPermissions(subItem.name)
|
||||
.toLowerCase()
|
||||
.includes(search.toLowerCase()) ||
|
||||
subItem.path.toLowerCase().includes(search.toLowerCase())
|
||||
subItem.path.toLowerCase().includes(search.toLowerCase()),
|
||||
);
|
||||
|
||||
return {
|
||||
@@ -191,7 +115,7 @@ export const SideBar = () => {
|
||||
.filter(
|
||||
(item) =>
|
||||
item.subItems.length > 0 ||
|
||||
item.fa.toLowerCase().includes(search.toLowerCase())
|
||||
item.fa.toLowerCase().includes(search.toLowerCase()),
|
||||
);
|
||||
|
||||
if (isMobile) return null;
|
||||
@@ -287,6 +211,30 @@ export const SideBar = () => {
|
||||
<span>مشاهده نقشه</span>
|
||||
</motion.button>
|
||||
)}
|
||||
{isSideBarOpen && hasAdmin && (
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center gap-2 text-xs font-medium text-gray-600 dark:text-gray-400">
|
||||
<MapPinIcon className="w-4 h-4 shrink-0" />
|
||||
<span>استان</span>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-1.5">
|
||||
{ADMIN_PROVINCES.map(({ value, label }) => (
|
||||
<button
|
||||
key={value}
|
||||
type="button"
|
||||
onClick={() => updateProfile({ province: value })}
|
||||
className={`px-3 py-2 rounded-lg text-sm font-medium transition-all ${
|
||||
currentProvince === value
|
||||
? "bg-primary-500 text-white dark:bg-primary-600 shadow-md"
|
||||
: "bg-gray-100 dark:bg-dark-600 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-dark-500"
|
||||
}`}
|
||||
>
|
||||
{label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
|
||||
@@ -33,7 +33,7 @@ api.interceptors.request.use(
|
||||
|
||||
return config;
|
||||
},
|
||||
(error) => Promise.reject(error)
|
||||
(error) => Promise.reject(error),
|
||||
);
|
||||
|
||||
api.interceptors.response.use(
|
||||
@@ -50,12 +50,13 @@ api.interceptors.response.use(
|
||||
rtl: true,
|
||||
});
|
||||
if (typeof logOut === "function") {
|
||||
window.location.href = "/";
|
||||
logOut();
|
||||
}
|
||||
}
|
||||
}
|
||||
return Promise.reject(error);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
export default api;
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
export function getFaPermissions(permission: string) {
|
||||
let faPermission = "";
|
||||
switch (permission) {
|
||||
case "admin":
|
||||
faPermission = "ادمین";
|
||||
break;
|
||||
case "users":
|
||||
faPermission = "کاربران";
|
||||
break;
|
||||
@@ -28,9 +31,7 @@ export function getFaPermissions(permission: string) {
|
||||
case "submit":
|
||||
faPermission = "ثبت بازرسی";
|
||||
break;
|
||||
case "admin":
|
||||
faPermission = "مدیر";
|
||||
break;
|
||||
|
||||
default:
|
||||
faPermission = permission;
|
||||
break;
|
||||
|
||||
Reference in New Issue
Block a user