feat: domains management
This commit is contained in:
84
src/Pages/Domains.tsx
Normal file
84
src/Pages/Domains.tsx
Normal file
@@ -0,0 +1,84 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { useApiRequest } from "../utils/useApiRequest";
|
||||
import { useModalStore } from "../context/zustand-store/appStore";
|
||||
import Table from "../components/Table/Table";
|
||||
import { Grid } from "../components/Grid/Grid";
|
||||
import Button from "../components/Button/Button";
|
||||
import { AddDomain } from "../partials/Admin/AddDomain";
|
||||
import { Popover } from "../components/PopOver/PopOver";
|
||||
import { Tooltip } from "../components/Tooltip/Tooltip";
|
||||
import { DeleteButtonForPopOver } from "../components/PopOverButtons/PopOverButtons";
|
||||
|
||||
export default function Domains() {
|
||||
const { openModal } = useModalStore();
|
||||
const [domainsInfo, setDomainsInfo] = useState({ page: 1, page_size: 10 });
|
||||
const [domainsTableData, setDomainsTableData] = useState([]);
|
||||
|
||||
const { data: domainsData, refetch } = useApiRequest({
|
||||
api: "/core/domain/",
|
||||
method: "get",
|
||||
params: domainsInfo,
|
||||
queryKey: ["domains", domainsInfo],
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (domainsData?.results) {
|
||||
const formattedData = domainsData.results.map((item: any, i: number) => {
|
||||
return [
|
||||
domainsInfo.page === 1
|
||||
? i + 1
|
||||
: i + domainsInfo.page_size * (domainsInfo.page - 1) + 1,
|
||||
item?.fa_name,
|
||||
item?.code,
|
||||
item?.name,
|
||||
<Popover key={i}>
|
||||
<Tooltip title="ویرایش" position="right">
|
||||
<Button
|
||||
variant="edit"
|
||||
onClick={() => {
|
||||
openModal({
|
||||
title: "ویرایش حوزه",
|
||||
content: <AddDomain item={item} getData={refetch} />,
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
<DeleteButtonForPopOver
|
||||
api={`core/domain/${item?.id}/`}
|
||||
getData={refetch}
|
||||
/>
|
||||
</Popover>,
|
||||
];
|
||||
});
|
||||
setDomainsTableData(formattedData);
|
||||
}
|
||||
}, [domainsData, domainsInfo]);
|
||||
|
||||
return (
|
||||
<Grid container column>
|
||||
<Grid container className="items-center gap-2">
|
||||
<Button
|
||||
size="small"
|
||||
variant="submit"
|
||||
onClick={() => {
|
||||
openModal({
|
||||
title: "ایجاد حوزه",
|
||||
content: <AddDomain getData={refetch} />,
|
||||
});
|
||||
}}
|
||||
>
|
||||
ایجاد حوزه
|
||||
</Button>
|
||||
</Grid>
|
||||
<Table
|
||||
className="mt-2"
|
||||
onChange={setDomainsInfo}
|
||||
count={domainsData?.count || 10}
|
||||
isPaginated
|
||||
title="حوزه ها"
|
||||
columns={["ردیف", "نام حوزه", "کد حوزه", "نام انگلیسی", "عملیات"]}
|
||||
rows={domainsTableData}
|
||||
/>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
@@ -11,7 +11,7 @@ import {
|
||||
useDrawerStore,
|
||||
useModalStore,
|
||||
} from "../../context/zustand-store/appStore";
|
||||
import { EditAccess } from "../../partials/Access/EditAccess";
|
||||
import { EditAccess } from "../../partials/Admin/EditAccess";
|
||||
import { AddUser } from "../../partials/LiveStock/management/AddUser";
|
||||
import ShowStringList from "../../components/ShowStringList/ShowStringList";
|
||||
import ShowMoreInfo from "../../components/ShowMoreInfo/ShowMoreInfo";
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { useState } from "react";
|
||||
import { Grid } from "../components/Grid/Grid";
|
||||
import Tabs from "../components/Tab/Tab";
|
||||
import Pages from "../partials/Access/Pages";
|
||||
import Access from "../partials/Access/Access";
|
||||
import UnusedAccess from "../partials/Access/UnusedAccess";
|
||||
import Pages from "../partials/Admin/Pages";
|
||||
import Access from "../partials/Admin/Access";
|
||||
import UnusedAccess from "../partials/Admin/UnusedAccess";
|
||||
|
||||
const tabItems = [
|
||||
{ label: "صفحات" },
|
||||
|
||||
125
src/partials/Admin/AddDomain.tsx
Normal file
125
src/partials/Admin/AddDomain.tsx
Normal file
@@ -0,0 +1,125 @@
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import Button from "../../components/Button/Button";
|
||||
import { Grid } from "../../components/Grid/Grid";
|
||||
import Textfield from "../../components/Textfeild/Textfeild";
|
||||
import { useForm, Controller } from "react-hook-form";
|
||||
import {
|
||||
zValidateString,
|
||||
zValidateEnglishString,
|
||||
} from "../../data/getFormTypeErrors";
|
||||
import { z } from "zod";
|
||||
import { useApiMutation } from "../../utils/useApiRequest";
|
||||
import { useToast } from "../../hooks/useToast";
|
||||
import { useModalStore } from "../../context/zustand-store/appStore";
|
||||
import { getToastResponse } from "../../data/getToastResponse";
|
||||
|
||||
const schema = z.object({
|
||||
code: zValidateString("کد حوزه"),
|
||||
name: zValidateEnglishString("نام انگلیسی حوزه"),
|
||||
fa_name: zValidateString("نام حوزه"),
|
||||
});
|
||||
|
||||
type AddDomainProps = {
|
||||
getData: () => void;
|
||||
item?: any;
|
||||
};
|
||||
|
||||
type FormValues = z.infer<typeof schema>;
|
||||
|
||||
export const AddDomain = ({ getData, item }: AddDomainProps) => {
|
||||
const showToast = useToast();
|
||||
const { closeModal } = useModalStore();
|
||||
|
||||
const {
|
||||
control,
|
||||
handleSubmit,
|
||||
formState: { errors },
|
||||
} = useForm<FormValues>({
|
||||
resolver: zodResolver(schema),
|
||||
defaultValues: {
|
||||
code: item?.code || "",
|
||||
name: item?.name || "",
|
||||
fa_name: item?.fa_name || "",
|
||||
},
|
||||
});
|
||||
|
||||
const mutation = useApiMutation({
|
||||
api: `/core/domain/${item ? item?.id + "/" : ""}`,
|
||||
method: item ? "put" : "post",
|
||||
});
|
||||
|
||||
const onSubmit = async (data: FormValues) => {
|
||||
try {
|
||||
await mutation.mutateAsync({
|
||||
code: data.code,
|
||||
name: data.name,
|
||||
fa_name: data.fa_name,
|
||||
});
|
||||
showToast(getToastResponse(item, "حوزه"), "success");
|
||||
closeModal();
|
||||
getData();
|
||||
} catch (error: any) {
|
||||
if (error?.status === 403) {
|
||||
showToast(
|
||||
error?.response?.data?.message || "این مورد تکراری است!",
|
||||
"error",
|
||||
);
|
||||
} else {
|
||||
showToast(
|
||||
error?.response?.data?.message || "خطا در ثبت اطلاعات!",
|
||||
"error",
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<Grid container column className="gap-2">
|
||||
<Controller
|
||||
name="code"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Textfield
|
||||
fullWidth
|
||||
placeholder="کد حوزه"
|
||||
value={field.value}
|
||||
onChange={field.onChange}
|
||||
error={!!errors.code}
|
||||
helperText={errors.code?.message}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Controller
|
||||
name="name"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Textfield
|
||||
fullWidth
|
||||
placeholder="نام انگلیسی حوزه"
|
||||
value={field.value}
|
||||
onChange={field.onChange}
|
||||
error={!!errors.name}
|
||||
helperText={errors.name?.message}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Controller
|
||||
name="fa_name"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Textfield
|
||||
fullWidth
|
||||
placeholder="نام حوزه"
|
||||
value={field.value}
|
||||
onChange={field.onChange}
|
||||
error={!!errors.fa_name}
|
||||
helperText={errors.fa_name?.message}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Button type="submit">ثبت</Button>
|
||||
</Grid>
|
||||
</form>
|
||||
);
|
||||
};
|
||||
@@ -6,6 +6,7 @@ export const MENU = "/menu";
|
||||
export const TRAINING = "/training";
|
||||
|
||||
//Admin Routes
|
||||
export const DOMAINS = "/domains";
|
||||
export const PERMISSION_ACCESS = "/permission-access";
|
||||
|
||||
//Management
|
||||
|
||||
@@ -26,8 +26,14 @@ import Tagging from "../Pages/LiveStock/Tagging";
|
||||
import TagDistribtution from "../Pages/LiveStock/TagDistribution";
|
||||
import TagDistribtutionDetails from "../Pages/LiveStock/TagDistributionDetails";
|
||||
import Tags from "../partials/LiveStock/tagging/Tags";
|
||||
import Domains from "../Pages/Domains";
|
||||
|
||||
export const adminCategoryItems = [
|
||||
{
|
||||
name: "domains",
|
||||
path: R.DOMAINS,
|
||||
component: Domains,
|
||||
},
|
||||
{
|
||||
name: "permission_control",
|
||||
path: R.PERMISSION_ACCESS,
|
||||
|
||||
@@ -4,6 +4,9 @@ export function getFaPermissions(permission: string) {
|
||||
case "permission_control":
|
||||
faPermission = "مدیریت دسترسی";
|
||||
break;
|
||||
case "domains":
|
||||
faPermission = "مدیریت حوزه ها";
|
||||
break;
|
||||
case "users":
|
||||
faPermission = "کاربران";
|
||||
break;
|
||||
|
||||
Reference in New Issue
Block a user