Files
Rasadyar_FrontEnd/src/features/province-jahad/components/province-jahad-unions-operations/ProvinceJahadUnionsOperations.js

193 lines
6.4 KiB
JavaScript

import {
Button,
FormControlLabel,
IconButton,
Popover,
Switch,
Tooltip,
} from "@mui/material";
import { useContext, useState } from "react";
import TuneIcon from "@mui/icons-material/Tune";
import EditIcon from "@mui/icons-material/Edit";
import { Grid } from "../../../../components/grid/Grid";
import {
CLOSE_MODAL,
DRAWER,
OPEN_MODAL,
} from "../../../../lib/redux/slices/appSlice";
import { useDispatch } from "react-redux";
import DeleteIcon from "@mui/icons-material/Delete";
import { AppContext } from "../../../../contexts/AppContext";
import { provinceJahadDeleteUnionsService } from "../../services/province-jahad-unions-delete-union";
import { ProvinceJahadUnionsSubmit } from "../province-jahad-unions-submit/ProvinceJahadUnionsSubmit";
import { provinceJahadUpdateUnionService } from "../../services/province-jahad-edit-union";
export const ProvinceJahadUnionsOperations = ({ item, updateTable }) => {
const dispatch = useDispatch();
const [popoverOpen, setPopoverOpen] = useState(false);
const [anchorEl, setAnchorEl] = useState(null);
const [openNotif] = useContext(AppContext);
const openPopover = (event) => {
setPopoverOpen(true);
setAnchorEl(event.currentTarget);
};
const closePopover = () => {
setPopoverOpen(false);
setAnchorEl(null);
};
return (
<Grid>
<IconButton variant="contained" color="primary" onClick={openPopover}>
<TuneIcon />
</IconButton>
<Popover
open={popoverOpen}
anchorEl={anchorEl}
onClose={closePopover}
anchorOrigin={{
vertical: "bottom",
horizontal: "right",
}}
transformOrigin={{
vertical: "top",
horizontal: "left",
}}
>
<div style={{ padding: 2 }}>
<Grid
container
direction="column"
alignItems="center"
justifyContent="center"
gap={1}
>
<Tooltip title={"ویرایش اتحادیه"} placement="left-start">
<IconButton
color="primary"
onClick={() => {
closePopover();
dispatch(
DRAWER({
right: true,
top: false,
content: (
<ProvinceJahadUnionsSubmit
item={item}
updateTable={updateTable}
/>
),
title: "ویرایش اتحادیه ",
})
);
}}
>
<EditIcon />
</IconButton>
</Tooltip>
<FormControlLabel
control={
<Switch
size="small"
checked={item?.active}
onChange={() => {
dispatch(
provinceJahadUpdateUnionService({
union_key: item?.key,
active: !item?.active,
})
).then((r) => {
if (r.payload.error) {
openNotif({
vertical: "top",
horizontal: "center",
msg: r.payload.error,
severity: "error",
});
} else {
updateTable();
openNotif({
vertical: "top",
horizontal: "center",
msg: "عملیات با موفقیت انجام شد.",
severity: "success",
});
}
});
}}
color="primary"
/>
}
label={item?.active ? "فعال" : "غیرفعال"}
style={{
justifyContent: "center",
alignItems: "center",
display: "flex",
}}
/>
<Tooltip title={"حذف"} placement="left-start">
<IconButton
aria-label="delete"
color="error"
onClick={() => {
closePopover();
dispatch(
OPEN_MODAL({
title: "آیا مطمئن هستید؟",
content: (
<Grid container>
<Button
color="error"
variant="contained"
onClick={() => {
dispatch(
provinceJahadDeleteUnionsService(item?.key)
).then((r) => {
if (r.payload.error) {
openNotif({
vertical: "top",
horizontal: "center",
msg: r.payload.error,
severity: "error",
});
} else {
updateTable();
dispatch(CLOSE_MODAL());
openNotif({
vertical: "top",
horizontal: "center",
msg: r.payload.data.result,
severity: "success",
});
}
});
}}
>
تایید
</Button>
<Button
onClick={() => {
dispatch(CLOSE_MODAL());
}}
>
لغو
</Button>
</Grid>
),
})
);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
</Grid>
</div>
</Popover>
</Grid>
);
};