114 lines
3.5 KiB
TypeScript
114 lines
3.5 KiB
TypeScript
import React, { useEffect, useState } from "react";
|
||
import { Grid } from "../components/Grid/Grid";
|
||
import { useUserProfileStore } from "../context/zustand-store/userStore";
|
||
import { useApiRequest } from "../utils/useApiRequest";
|
||
import Table from "../components/Table/Table";
|
||
import Typography from "../components/Typography/Typography";
|
||
import Button from "../components/Button/Button";
|
||
import { useDrawerStore } from "../context/zustand-store/appStore";
|
||
import { SubmitNewUser } from "../partials/users/SubmitNewUser";
|
||
import { Popover } from "../components/PopOver/PopOver";
|
||
import { DeleteButtonForPopOver } from "../components/PopOverButtons/PopOverButtons";
|
||
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();
|
||
const { openDrawer } = useDrawerStore();
|
||
const [tableData, setTableData] = useState<any[][]>([]);
|
||
|
||
const { data: usersData, refetch } = useApiRequest({
|
||
api: `/users/${profile?.province || "hamedan"}`,
|
||
method: "get",
|
||
queryKey: ["users", profile?.province],
|
||
});
|
||
|
||
useEffect(() => {
|
||
if (usersData) {
|
||
const d = usersData.map((item: any, i: number) => {
|
||
return [
|
||
i + 1,
|
||
item?.fullname || "-",
|
||
item?.mobile || "-",
|
||
item?.permissions?.map((perm: string, idx: number) => (
|
||
<Typography key={idx} variant="body2" className="text-xs">
|
||
{getFaPermissions(perm)}
|
||
</Typography>
|
||
)) || "-",
|
||
getFaProvince(item?.province || ""),
|
||
getFaCityName(item?.city || ""),
|
||
|
||
<Popover key={i}>
|
||
<Tooltip title="ویرایش" position="right">
|
||
<Button
|
||
variant="edit"
|
||
access="add"
|
||
onClick={() => {
|
||
openDrawer({
|
||
title: "ویرایش کاربر",
|
||
content: (
|
||
<SubmitNewUser
|
||
province={profile?.province || ""}
|
||
onSuccess={refetch}
|
||
item={item}
|
||
/>
|
||
),
|
||
});
|
||
}}
|
||
/>
|
||
</Tooltip>
|
||
<DeleteButtonForPopOver
|
||
access="add"
|
||
api={`users/${item?._id || item?.Id}`}
|
||
getData={refetch}
|
||
/>
|
||
</Popover>,
|
||
];
|
||
});
|
||
setTableData(d);
|
||
}
|
||
}, [usersData, profile]);
|
||
|
||
return (
|
||
<Grid container column className="justify-center">
|
||
<Grid>
|
||
<Button
|
||
variant="submit"
|
||
access="add"
|
||
onClick={() => {
|
||
openDrawer({
|
||
title: "ثبت کاربر جدید",
|
||
content: (
|
||
<SubmitNewUser
|
||
province={profile?.province || ""}
|
||
onSuccess={refetch}
|
||
/>
|
||
),
|
||
});
|
||
}}
|
||
>
|
||
ثبت کاربر جدید
|
||
</Button>
|
||
</Grid>
|
||
|
||
<Table
|
||
title="کاربران"
|
||
columns={[
|
||
"ردیف",
|
||
"نام کامل",
|
||
"شماره موبایل",
|
||
"دسترسیها",
|
||
"استان",
|
||
"شهر",
|
||
"عملیات",
|
||
]}
|
||
rows={tableData}
|
||
/>
|
||
</Grid>
|
||
);
|
||
};
|
||
|
||
export default Users;
|