Files
RasadDam_Frontend/src/partials/Access/Pages.tsx

119 lines
4.0 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { useEffect, useState } from "react";
import { getFaPermissions } from "../../utils/getFaPermissions";
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 { AddPage } from "./AddPage";
import { Popover } from "../../components/PopOver/PopOver";
import { Tooltip } from "../../components/Tooltip/Tooltip";
import { DeleteButtonForPopOver } from "../../components/PopOverButtons/PopOverButtons";
import { ArrowPathIcon } from "@heroicons/react/24/outline";
import { BooleanQuestion } from "../../components/BooleanQuestion/BooleanQuestion";
export default function Pages() {
const { openModal } = useModalStore();
const [pagesInfo, setPagesInfo] = useState({ page: 1, page_size: 10 });
const [pagesTableData, setPagesTableData] = useState([]);
const { data: pagesData, refetch } = useApiRequest({
api: "/auth/api/v1/page/",
method: "get",
params: pagesInfo,
queryKey: ["pages", pagesInfo],
});
useEffect(() => {
if (pagesData?.results) {
const formattedData = pagesData.results.map((item: any, i: number) => {
return [
pagesInfo.page === 1
? i + 1
: i + pagesInfo.page_size * (pagesInfo.page - 1) + 1,
getFaPermissions(item?.name),
item?.name,
item?.permissions?.map((option: any) => option.name)?.join(" - "),
<Popover key={i}>
<Tooltip title="ویرایش" position="right">
<Button
page="permission_control"
access="Post-Page"
variant="edit"
onClick={() => {
openModal({
title: "ویرایش صفحه",
content: <AddPage item={item} getData={refetch} />,
});
}}
/>
</Tooltip>
<DeleteButtonForPopOver
page="permission_control"
access="Post-Page"
api={`auth/api/v1/page/${item?.id}/`}
getData={refetch}
/>
</Popover>,
];
});
setPagesTableData(formattedData);
}
}, [pagesData, pagesInfo]);
return (
<Grid container column>
<Grid container className="items-center gap-2">
<Button
size="small"
page="permission_control"
access="Post-Page"
variant="submit"
onClick={() => {
openModal({
title: "ایجاد صفحه",
content: <AddPage getData={refetch} />,
});
}}
>
ایجاد صفحه
</Button>
{(window.location.origin.includes("localhost") ||
window.location.origin.includes("tdam.rasadyar")) && (
<Tooltip title="ارسال لیست به سامانه" position="top">
<Button
size="small"
page="permission_control"
access="Post-Page"
icon={<ArrowPathIcon className="w-5 h-5" />}
onClick={() => {
openModal({
title: "آیا از ارسال لیست به سامانه مطمئنید؟",
content: (
<BooleanQuestion
getData={refetch}
api={`auth/api/v1/update_access/`}
method="post"
/>
),
});
}}
>
{" "}
</Button>
</Tooltip>
)}
</Grid>
<Table
className="mt-2"
onChange={setPagesInfo}
count={pagesData?.count || 10}
isPaginated
title="صفحات سامانه"
columns={["ردیف", "صفحه", "کلید", "دسترسی ها", "عملیات"]}
rows={pagesTableData}
/>
</Grid>
);
}