RMS/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feature/amiriis missions

Browse Source
This commit is contained in:
AmirHossein Mahmoodi
2025-06-25 07:41:03 +00:00
parent 9ae5b8934c
commit 12d6d08bef
734 changed files with 48930 additions and 46048 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/components/dashboard/azmayesh/Actions/Create/index.jsx
View File

@@ -1,33 +1,33 @@
"use client";
import { Button, IconButton, useMediaQuery } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import { AddCircle } from "@mui/icons-material";
import CandUAzmayesh from "@/components/dashboard/azmayesh/Forms/CandUAzmayesh";
const AzmayeshCreate = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت آزمایش جدید" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button variant="contained" color="primary" startIcon={<AddCircle />} onClick={handleOpen}>
ثبت آزمایش
</Button>
)}
{open && <CandUAzmayesh open={open} setOpen={setOpen} mutate={mutate} />}
</>
);
};
export default AzmayeshCreate;
"use client";
import { Button, IconButton, useMediaQuery } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import { AddCircle } from "@mui/icons-material";
import CandUAzmayesh from "@/components/dashboard/azmayesh/Forms/CandUAzmayesh";
const AzmayeshCreate = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت آزمایش جدید" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button variant="contained" color="primary" startIcon={<AddCircle />} onClick={handleOpen}>
ثبت آزمایش
</Button>
)}
{open && <CandUAzmayesh open={open} setOpen={setOpen} mutate={mutate} />}
</>
);
};
export default AzmayeshCreate;

432
src/components/dashboard/azmayesh/AzmayeshList.jsx
View File

@@ -1,216 +1,216 @@
"use client";
import { useMemo } from "react";
import { Box, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import { GET_AZMAYESH_LIST } from "@/core/utils/routes";
import ShowLocation from "./ShowLocation";
import moment from "jalali-moment";
import RowActions from "./RowActions";
import ShowSampleOfAzmayesh from "./RowActions/ShowSampleOfAzmayesh";
const AzmayeshList = () => {
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
grow: false,
size: 100,
},
{
accessorKey: "province_name",
header: "استان",
id: "province_name",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "azmayesh_type_name",
header: "نوع آزمایش",
id: "azmayesh_type_name",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "contract_subitem_id",
header: "کد یکتا پروژه",
id: "contract_subitem_id",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "project_name",
header: "پروژه",
id: "project_name",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "location",
header: "نمایش مختصات",
id: "location",
enableColumnFilter: false,
datatype: "text",
enableSorting: false,
filterMode: "equals",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => <ShowLocation lat={row.original.lat} lng={row.original.lng} />,
},
{
accessorKey: "employer",
header: "کارفرما",
id: "employer",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "consultant",
header: "مشاور",
id: "consultant",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "contractor",
header: "پیمانکار",
id: "contractor",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "applicant",
header: "متقاضی",
id: "applicant",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "work_number",
header: "شماره کار",
id: "work_number",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "request_number",
header: "شماره درخواست",
id: "request_number",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "request_date",
header: "تاریخ درخواست",
id: "request_date",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
</Typography>
),
},
{
accessorKey: "report_date",
header: "تاریخ گزارش",
id: "report_date",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
</Typography>
),
},
{
accessorKey: "updated_at",
header: "تاریخ بروزرسانی",
id: "updated_at",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("HH:mm | YYYY/MM/DD") : "-"}
</Typography>
),
},
{
accessorKey: "samples",
header: "نمونه ها",
id: "samples",
enableColumnFilter: false,
datatype: "text",
enableSorting: false,
filterMode: "equals",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => <ShowSampleOfAzmayesh rowData={row.original} />,
},
],
[]
);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
table_title={"لیست آزمایشات"}
need_filter={false}
columns={columns}
table_url={GET_AZMAYESH_LIST}
page_name={"azmayesh"}
table_name={"azmayeshList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default AzmayeshList;
"use client";
import { useMemo } from "react";
import { Box, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import { GET_AZMAYESH_LIST } from "@/core/utils/routes";
import ShowLocation from "./ShowLocation";
import moment from "jalali-moment";
import RowActions from "./RowActions";
import ShowSampleOfAzmayesh from "./RowActions/ShowSampleOfAzmayesh";
const AzmayeshList = () => {
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
grow: false,
size: 100,
},
{
accessorKey: "province_name",
header: "استان",
id: "province_name",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "azmayesh_type_name",
header: "نوع آزمایش",
id: "azmayesh_type_name",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "contract_subitem_id",
header: "کد یکتا پروژه",
id: "contract_subitem_id",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "project_name",
header: "پروژه",
id: "project_name",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "location",
header: "نمایش مختصات",
id: "location",
enableColumnFilter: false,
datatype: "text",
enableSorting: false,
filterMode: "equals",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => <ShowLocation lat={row.original.lat} lng={row.original.lng} />,
},
{
accessorKey: "employer",
header: "کارفرما",
id: "employer",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "consultant",
header: "مشاور",
id: "consultant",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "contractor",
header: "پیمانکار",
id: "contractor",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "applicant",
header: "متقاضی",
id: "applicant",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "work_number",
header: "شماره کار",
id: "work_number",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "request_number",
header: "شماره درخواست",
id: "request_number",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
},
{
accessorKey: "request_date",
header: "تاریخ درخواست",
id: "request_date",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
</Typography>
),
},
{
accessorKey: "report_date",
header: "تاریخ گزارش",
id: "report_date",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("YYYY/MM/DD") : "-"}
</Typography>
),
},
{
accessorKey: "updated_at",
header: "تاریخ بروزرسانی",
id: "updated_at",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("HH:mm | YYYY/MM/DD") : "-"}
</Typography>
),
},
{
accessorKey: "samples",
header: "نمونه ها",
id: "samples",
enableColumnFilter: false,
datatype: "text",
enableSorting: false,
filterMode: "equals",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => <ShowSampleOfAzmayesh rowData={row.original} />,
},
],
[]
);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
table_title={"لیست آزمایشات"}
need_filter={false}
columns={columns}
table_url={GET_AZMAYESH_LIST}
page_name={"azmayesh"}
table_name={"azmayeshList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default AzmayeshList;

426
src/components/dashboard/azmayesh/Forms/CandUAzmayesh/CandUChooseLocation.jsx
View File

@@ -1,213 +1,213 @@
"use client";
import { Marker, useMapEvents } from "react-leaflet";
import { useEffect, useRef, useState } from "react";
import L from "leaflet";
import AzmayeshIcon from "@/assets/images/examine_marker.png";
import AzmayeshActiveIcon from "@/assets/images/examine_marker_active.png";
import {
Alert,
Box,
Button,
FormControl,
InputAdornment,
InputLabel,
OutlinedInput,
Stack,
Tooltip,
Zoom,
useMediaQuery,
} from "@mui/material";
import NewReleasesIcon from "@mui/icons-material/NewReleases";
import VerifiedIcon from "@mui/icons-material/Verified";
import EditIcon from "@mui/icons-material/Edit";
import { useTheme } from "@emotion/react";
const MAX_ZOOM_FOR_MARKER = 13;
const CandUChooseLocation = ({ mapBoxData, setMapBoxData }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [enableSend, setEnableSend] = useState(false);
const mapAzmayeshMarker = useRef();
const defaultIconSize = [35, 35];
const createCustomIcon = (size, iconUrl) => {
return L.icon({
iconUrl: iconUrl,
iconSize: size,
iconAnchor: [size[0] / 2, size[1]],
popupAnchor: [0, -size[1]],
});
};
const map = useMapEvents({
move(e) {
setEnableSend(e.target.getZoom() > MAX_ZOOM_FOR_MARKER);
if (!mapBoxData) {
mapAzmayeshMarker.current.setLatLng(e.target.getCenter());
}
},
movestart() {
if (!mapBoxData) {
mapAzmayeshMarker.current.setIcon(createCustomIcon([45, 45], AzmayeshIcon.src));
}
},
moveend() {
if (!mapBoxData) {
mapAzmayeshMarker.current.setIcon(createCustomIcon(defaultIconSize, AzmayeshIcon.src));
}
},
zoom(e) {
setEnableSend(e.target.getZoom() > MAX_ZOOM_FOR_MARKER);
},
});
useEffect(() => {
if (!mapAzmayeshMarker.current) return;
if (mapBoxData) {
mapAzmayeshMarker.current.setIcon(createCustomIcon([45, 45], AzmayeshActiveIcon.src));
mapAzmayeshMarker.current.setLatLng(mapBoxData);
map.setView(mapBoxData, 14);
} else {
mapAzmayeshMarker.current.setIcon(createCustomIcon(defaultIconSize, AzmayeshIcon.src));
}
}, [mapBoxData, mapAzmayeshMarker.current]);
const handleMarkerClick = () => {
if (!enableSend) return;
if (!mapBoxData) {
setMapBoxData({
lat: mapAzmayeshMarker.current.getLatLng().lat,
lng: mapAzmayeshMarker.current.getLatLng().lng,
});
}
};
const handleEditLocation = () => {
setMapBoxData(null);
};
return (
<>
<Marker
position={map.getCenter()}
ref={mapAzmayeshMarker}
eventHandlers={{ click: handleMarkerClick }}
icon={L.divIcon({ className: "" })}
/>
<Stack
direction={"row"}
justifyContent={"center"}
sx={{
zIndex: "400",
width: "100%",
position: "absolute",
top: 0,
left: 0,
}}
>
<Zoom in={!enableSend}>
<Alert sx={{ mt: 1, py: 0.5, px: 2, borderRadius: 2, border: 1 }} icon={false} color={"warning"}>
برای ثبت محل آزمایش، لطفاً نقشه را بیشتر زوم کنید.
</Alert>
</Zoom>
</Stack>
<Stack
direction={"row"}
sx={{
zIndex: "400",
width: "100%",
position: "absolute",
bottom: 0,
left: 0,
}}
>
<Box
sx={{
background: "#ffffff94",
flex: isMobile ? 1 : "",
m: 1,
p: 2,
borderRadius: 2,
boxShadow: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
}}
>
<Stack sx={{ gap: 2 }}>
<Tooltip title="با کلیک بر روی مارکر، محل آزمایش را انتخاب کنید" arrow>
<FormControl size="small" variant="outlined">
<InputLabel sx={{ color: mapBoxData ? "success.main" : "" }} htmlFor="lat">
طول جغرافیایی
</InputLabel>
<OutlinedInput
id="lat"
type="text"
size="small"
readOnly
sx={{
"& .MuiOutlinedInput-notchedOutline": {
borderColor: mapBoxData ? "success.main" : "",
},
color: mapBoxData ? "success.main" : "",
}}
value={mapBoxData ? `${mapBoxData.lat}` : ""}
endAdornment={
<InputAdornment position="end">
{mapBoxData ? (
<VerifiedIcon color="success" />
) : (
<NewReleasesIcon color="error" />
)}
</InputAdornment>
}
label="طول جغرافیایی"
/>
</FormControl>
</Tooltip>
<Tooltip title="با کلیک بر روی مارکر، محل آزمایش را انتخاب کنید" arrow>
<FormControl size="small" variant="outlined">
<InputLabel sx={{ color: mapBoxData ? "success.main" : "" }} htmlFor="lng">
عرض جغرافیایی
</InputLabel>
<OutlinedInput
id="lng"
type="text"
size="small"
readOnly
sx={{
"& .MuiOutlinedInput-notchedOutline": {
borderColor: mapBoxData ? "success.main" : "",
},
color: mapBoxData ? "success.main" : "",
}}
value={mapBoxData ? `${mapBoxData.lng}` : ""}
endAdornment={
<InputAdornment position="end">
{mapBoxData ? (
<VerifiedIcon color="success" />
) : (
<NewReleasesIcon color="error" />
)}
</InputAdornment>
}
label="عرض جغرافیایی"
/>
</FormControl>
</Tooltip>
<Button
variant="contained"
color="primary"
disabled={!mapBoxData}
startIcon={<EditIcon />}
onClick={handleEditLocation}
>
ویرایش مختصات
</Button>
</Stack>
</Box>
</Stack>
</>
);
};
export default CandUChooseLocation;
"use client";
import { Marker, useMapEvents } from "react-leaflet";
import { useEffect, useRef, useState } from "react";
import L from "leaflet";
import AzmayeshIcon from "@/assets/images/examine_marker.png";
import AzmayeshActiveIcon from "@/assets/images/examine_marker_active.png";
import {
Alert,
Box,
Button,
FormControl,
InputAdornment,
InputLabel,
OutlinedInput,
Stack,
Tooltip,
Zoom,
useMediaQuery,
} from "@mui/material";
import NewReleasesIcon from "@mui/icons-material/NewReleases";
import VerifiedIcon from "@mui/icons-material/Verified";
import EditIcon from "@mui/icons-material/Edit";
import { useTheme } from "@emotion/react";
const MAX_ZOOM_FOR_MARKER = 13;
const CandUChooseLocation = ({ mapBoxData, setMapBoxData }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [enableSend, setEnableSend] = useState(false);
const mapAzmayeshMarker = useRef();
const defaultIconSize = [35, 35];
const createCustomIcon = (size, iconUrl) => {
return L.icon({
iconUrl: iconUrl,
iconSize: size,
iconAnchor: [size[0] / 2, size[1]],
popupAnchor: [0, -size[1]],
});
};
const map = useMapEvents({
move(e) {
setEnableSend(e.target.getZoom() > MAX_ZOOM_FOR_MARKER);
if (!mapBoxData) {
mapAzmayeshMarker.current.setLatLng(e.target.getCenter());
}
},
movestart() {
if (!mapBoxData) {
mapAzmayeshMarker.current.setIcon(createCustomIcon([45, 45], AzmayeshIcon.src));
}
},
moveend() {
if (!mapBoxData) {
mapAzmayeshMarker.current.setIcon(createCustomIcon(defaultIconSize, AzmayeshIcon.src));
}
},
zoom(e) {
setEnableSend(e.target.getZoom() > MAX_ZOOM_FOR_MARKER);
},
});
useEffect(() => {
if (!mapAzmayeshMarker.current) return;
if (mapBoxData) {
mapAzmayeshMarker.current.setIcon(createCustomIcon([45, 45], AzmayeshActiveIcon.src));
mapAzmayeshMarker.current.setLatLng(mapBoxData);
map.setView(mapBoxData, 14);
} else {
mapAzmayeshMarker.current.setIcon(createCustomIcon(defaultIconSize, AzmayeshIcon.src));
}
}, [mapBoxData, mapAzmayeshMarker.current]);
const handleMarkerClick = () => {
if (!enableSend) return;
if (!mapBoxData) {
setMapBoxData({
lat: mapAzmayeshMarker.current.getLatLng().lat,
lng: mapAzmayeshMarker.current.getLatLng().lng,
});
}
};
const handleEditLocation = () => {
setMapBoxData(null);
};
return (
<>
<Marker
position={map.getCenter()}
ref={mapAzmayeshMarker}
eventHandlers={{ click: handleMarkerClick }}
icon={L.divIcon({ className: "" })}
/>
<Stack
direction={"row"}
justifyContent={"center"}
sx={{
zIndex: "400",
width: "100%",
position: "absolute",
top: 0,
left: 0,
}}
>
<Zoom in={!enableSend}>
<Alert sx={{ mt: 1, py: 0.5, px: 2, borderRadius: 2, border: 1 }} icon={false} color={"warning"}>
برای ثبت محل آزمایش، لطفاً نقشه را بیشتر زوم کنید.
</Alert>
</Zoom>
</Stack>
<Stack
direction={"row"}
sx={{
zIndex: "400",
width: "100%",
position: "absolute",
bottom: 0,
left: 0,
}}
>
<Box
sx={{
background: "#ffffff94",
flex: isMobile ? 1 : "",
m: 1,
p: 2,
borderRadius: 2,
boxShadow: "rgba(0, 0, 0, 0.24) 0px 3px 8px",
}}
>
<Stack sx={{ gap: 2 }}>
<Tooltip title="با کلیک بر روی مارکر، محل آزمایش را انتخاب کنید" arrow>
<FormControl size="small" variant="outlined">
<InputLabel sx={{ color: mapBoxData ? "success.main" : "" }} htmlFor="lat">
طول جغرافیایی
</InputLabel>
<OutlinedInput
id="lat"
type="text"
size="small"
readOnly
sx={{
"& .MuiOutlinedInput-notchedOutline": {
borderColor: mapBoxData ? "success.main" : "",
},
color: mapBoxData ? "success.main" : "",
}}
value={mapBoxData ? `${mapBoxData.lat}` : ""}
endAdornment={
<InputAdornment position="end">
{mapBoxData ? (
<VerifiedIcon color="success" />
) : (
<NewReleasesIcon color="error" />
)}
</InputAdornment>
}
label="طول جغرافیایی"
/>
</FormControl>
</Tooltip>
<Tooltip title="با کلیک بر روی مارکر، محل آزمایش را انتخاب کنید" arrow>
<FormControl size="small" variant="outlined">
<InputLabel sx={{ color: mapBoxData ? "success.main" : "" }} htmlFor="lng">
عرض جغرافیایی
</InputLabel>
<OutlinedInput
id="lng"
type="text"
size="small"
readOnly
sx={{
"& .MuiOutlinedInput-notchedOutline": {
borderColor: mapBoxData ? "success.main" : "",
},
color: mapBoxData ? "success.main" : "",
}}
value={mapBoxData ? `${mapBoxData.lng}` : ""}
endAdornment={
<InputAdornment position="end">
{mapBoxData ? (
<VerifiedIcon color="success" />
) : (
<NewReleasesIcon color="error" />
)}
</InputAdornment>
}
label="عرض جغرافیایی"
/>
</FormControl>
</Tooltip>
<Button
variant="contained"
color="primary"
disabled={!mapBoxData}
startIcon={<EditIcon />}
onClick={handleEditLocation}
>
ویرایش مختصات
</Button>
</Stack>
</Box>
</Stack>
</>
);
};
export default CandUChooseLocation;

746
src/components/dashboard/azmayesh/Forms/CandUAzmayesh/CandUGeneralInfo.jsx
View File

@@ -1,373 +1,373 @@
"use client";
import { Controller } from "react-hook-form";
import {
Autocomplete,
CircularProgress,
FormControl,
FormHelperText,
Grid,
IconButton,
InputAdornment,
InputLabel,
OutlinedInput,
TextField,
Typography,
} from "@mui/material";
import useAzmayesh from "@/lib/hooks/useAzmayesh";
import useProvinces from "@/lib/hooks/useProvince";
import { LocalizationProvider, MobileDatePicker } from "@mui/x-date-pickers";
import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
import { faIR } from "@mui/x-date-pickers/locales";
import ClearIcon from "@mui/icons-material/Clear";
import React from "react";
const CandUGeneralInfo = ({ control, register, setValue, errors }) => {
const { azmayeshes, errorAzmayeshes, loadingAzmayeshes } = useAzmayesh();
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
return (
<Grid container spacing={2}>
<Grid item xs={12} md={6} sx={{ display: "flex", alignItems: "center", justifyContent: "center" }}>
<Controller
name="azmayesh_type_id"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.azmayesh_type_id} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="azmayesh_type_id" />
{errorAzmayeshes ? (
<Typography color={"red"} sx={{ display: "flex", alignItems: "center", gap: 2 }}>
خطایی در دریافت لیست آزمایش ها رخ داده است!
</Typography>
) : loadingAzmayeshes ? (
<Typography sx={{ display: "flex", alignItems: "center", gap: 2 }}>
<CircularProgress size={20} />
درحال دریافت لیست آزمایش ها
</Typography>
) : (
<Autocomplete
id="azmayesh_type_id"
size="small"
value={azmayeshes.find((azmayesh) => azmayesh.id === value) || null}
disablePortal
options={azmayeshes}
getOptionLabel={(azmayesh) => azmayesh.name}
isOptionEqualToValue={(option, value) => option.id === value?.id}
onChange={(event, newValue) => {
onChange(newValue ? newValue.id : "");
setValue("azmayesh_type_name", newValue ? newValue.name : "");
}}
renderInput={(params) => (
<TextField
{...params}
autoComplete="off"
error={!!errors.azmayesh_type_id}
fullWidth
label="نوع آزمایش"
/>
)}
renderOption={(props, option) => (
<li {...props} key={option.id}>
{option.name}
</li>
)}
/>
)}
<FormHelperText id="azmayesh_type_id">
{errors.azmayesh_type_id ? errors.azmayesh_type_id.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
<Grid item xs={12} md={6} sx={{ display: "flex", alignItems: "center", justifyContent: "center" }}>
<Controller
name="province_id"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.province_id} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="province_id" />
{errorProvinces ? (
<Typography color={"red"} sx={{ display: "flex", alignItems: "center", gap: 2 }}>
خطایی در دریافت لیست استان ها رخ داده است!
</Typography>
) : loadingProvinces ? (
<Typography sx={{ display: "flex", alignItems: "center", gap: 2 }}>
<CircularProgress size={20} />
درحال دریافت لیست استان ها
</Typography>
) : (
<Autocomplete
id="province_id"
size="small"
value={provinces.find((province) => province.id === value) || null}
disablePortal
options={provinces}
getOptionLabel={(province) => province.name_fa}
isOptionEqualToValue={(option, value) => option.id === value?.id}
onChange={(event, newValue) => {
onChange(newValue ? newValue.id : "");
setValue("province_name", newValue ? newValue.name_fa : "");
}}
renderInput={(params) => (
<TextField
{...params}
autoComplete="off"
error={!!errors.province_id}
fullWidth
label="استان"
/>
)}
/>
)}
<FormHelperText id="province_id">
{errors.province_id ? errors.province_id.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.contract_subitem_id} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="contract_subitem_id">کد یکتا پروژه</InputLabel>
<OutlinedInput
id="contract_subitem_id"
label={"کد یکتا پروژه"}
autoComplete="off"
{...register("contract_subitem_id")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="contract_subitem_id">
{errors.contract_subitem_id ? errors.contract_subitem_id.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.project_name} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="project_name">پروژه</InputLabel>
<OutlinedInput
id="project_name"
label={"پروژه"}
autoComplete="off"
{...register("project_name")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="project_name">
{errors.project_name ? errors.project_name.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.employer} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="employer">کارفرما</InputLabel>
<OutlinedInput
id="employer"
label={"کارفرما"}
autoComplete="off"
{...register("employer")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="employer">{errors.employer ? errors.employer.message : null}</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.consultant} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="consultant">مشاور</InputLabel>
<OutlinedInput
id="consultant"
label={"مشاور"}
autoComplete="off"
{...register("consultant")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="consultant">
{errors.consultant ? errors.consultant.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.contractor} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="contractor">پیمانکار</InputLabel>
<OutlinedInput
id="contractor"
label={"پیمانکار"}
autoComplete="off"
{...register("contractor")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="contractor">
{errors.contractor ? errors.contractor.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.applicant} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="applicant">متقاضی</InputLabel>
<OutlinedInput
id="applicant"
label={"متقاضی"}
autoComplete="off"
{...register("applicant")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="applicant">{errors.applicant ? errors.applicant.message : null}</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.work_number} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="work_number">شماره کار</InputLabel>
<OutlinedInput
id="work_number"
label={"شماره کار"}
autoComplete="off"
{...register("work_number")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="work_number">
{errors.work_number ? errors.work_number.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.request_number} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="request_number">شماره درخواست</InputLabel>
<OutlinedInput
id="request_number"
label={"شماره درخواست"}
autoComplete="off"
{...register("request_number")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="request_number">
{errors.request_number ? errors.request_number.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="request_date"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.request_date} fullWidth size="small" variant="outlined">
<LocalizationProvider
dateAdapter={AdapterDateFnsJalali}
localeText={faIR.components.MuiLocalizationProvider.defaultProps.localeText}
>
<MobileDatePicker
value={value || null}
onChange={(newValue) => {
onChange(newValue);
}}
closeOnSelect
slotProps={{
textField: {
size: "small",
error: !!errors.request_date,
placeholder: "تاریخ درخواست",
InputProps: {
endAdornment: (
<InputAdornment position="end">
<IconButton
size="small"
onClick={(event) => {
event.stopPropagation();
setValue("request_date", "");
}}
sx={{
color: "#bfbfbf",
"&:hover": {
backgroundColor: "rgba(189, 189, 189, 0.1)",
color: "#363434",
},
}}
>
<ClearIcon />
</IconButton>
</InputAdornment>
),
},
},
}}
/>
</LocalizationProvider>
<FormHelperText id="request_date">
{errors.request_date ? errors.request_date.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="report_date"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.report_date} fullWidth size="small" variant="outlined">
<LocalizationProvider
dateAdapter={AdapterDateFnsJalali}
localeText={faIR.components.MuiLocalizationProvider.defaultProps.localeText}
>
<MobileDatePicker
value={value || null}
onChange={(newValue) => {
onChange(newValue);
}}
closeOnSelect
slotProps={{
textField: {
size: "small",
error: !!errors.report_date,
placeholder: "تاریخ گزارش",
InputProps: {
endAdornment: (
<InputAdornment position="end">
<IconButton
size="small"
onClick={(event) => {
event.stopPropagation();
setValue("report_date", "");
}}
sx={{
color: "#bfbfbf",
"&:hover": {
backgroundColor: "rgba(189, 189, 189, 0.1)",
color: "#363434",
},
}}
>
<ClearIcon />
</IconButton>
</InputAdornment>
),
},
},
}}
/>
</LocalizationProvider>
<FormHelperText id="report_date">
{errors.report_date ? errors.report_date.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
</Grid>
);
};
export default CandUGeneralInfo;
"use client";
import { Controller } from "react-hook-form";
import {
Autocomplete,
CircularProgress,
FormControl,
FormHelperText,
Grid,
IconButton,
InputAdornment,
InputLabel,
OutlinedInput,
TextField,
Typography,
} from "@mui/material";
import useAzmayesh from "@/lib/hooks/useAzmayesh";
import useProvinces from "@/lib/hooks/useProvince";
import { LocalizationProvider, MobileDatePicker } from "@mui/x-date-pickers";
import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
import { faIR } from "@mui/x-date-pickers/locales";
import ClearIcon from "@mui/icons-material/Clear";
import React from "react";
const CandUGeneralInfo = ({ control, register, setValue, errors }) => {
const { azmayeshes, errorAzmayeshes, loadingAzmayeshes } = useAzmayesh();
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
return (
<Grid container spacing={2}>
<Grid item xs={12} md={6} sx={{ display: "flex", alignItems: "center", justifyContent: "center" }}>
<Controller
name="azmayesh_type_id"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.azmayesh_type_id} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="azmayesh_type_id" />
{errorAzmayeshes ? (
<Typography color={"red"} sx={{ display: "flex", alignItems: "center", gap: 2 }}>
خطایی در دریافت لیست آزمایش ها رخ داده است!
</Typography>
) : loadingAzmayeshes ? (
<Typography sx={{ display: "flex", alignItems: "center", gap: 2 }}>
<CircularProgress size={20} />
درحال دریافت لیست آزمایش ها
</Typography>
) : (
<Autocomplete
id="azmayesh_type_id"
size="small"
value={azmayeshes.find((azmayesh) => azmayesh.id === value) || null}
disablePortal
options={azmayeshes}
getOptionLabel={(azmayesh) => azmayesh.name}
isOptionEqualToValue={(option, value) => option.id === value?.id}
onChange={(event, newValue) => {
onChange(newValue ? newValue.id : "");
setValue("azmayesh_type_name", newValue ? newValue.name : "");
}}
renderInput={(params) => (
<TextField
{...params}
autoComplete="off"
error={!!errors.azmayesh_type_id}
fullWidth
label="نوع آزمایش"
/>
)}
renderOption={(props, option) => (
<li {...props} key={option.id}>
{option.name}
</li>
)}
/>
)}
<FormHelperText id="azmayesh_type_id">
{errors.azmayesh_type_id ? errors.azmayesh_type_id.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
<Grid item xs={12} md={6} sx={{ display: "flex", alignItems: "center", justifyContent: "center" }}>
<Controller
name="province_id"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.province_id} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="province_id" />
{errorProvinces ? (
<Typography color={"red"} sx={{ display: "flex", alignItems: "center", gap: 2 }}>
خطایی در دریافت لیست استان ها رخ داده است!
</Typography>
) : loadingProvinces ? (
<Typography sx={{ display: "flex", alignItems: "center", gap: 2 }}>
<CircularProgress size={20} />
درحال دریافت لیست استان ها
</Typography>
) : (
<Autocomplete
id="province_id"
size="small"
value={provinces.find((province) => province.id === value) || null}
disablePortal
options={provinces}
getOptionLabel={(province) => province.name_fa}
isOptionEqualToValue={(option, value) => option.id === value?.id}
onChange={(event, newValue) => {
onChange(newValue ? newValue.id : "");
setValue("province_name", newValue ? newValue.name_fa : "");
}}
renderInput={(params) => (
<TextField
{...params}
autoComplete="off"
error={!!errors.province_id}
fullWidth
label="استان"
/>
)}
/>
)}
<FormHelperText id="province_id">
{errors.province_id ? errors.province_id.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.contract_subitem_id} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="contract_subitem_id">کد یکتا پروژه</InputLabel>
<OutlinedInput
id="contract_subitem_id"
label={"کد یکتا پروژه"}
autoComplete="off"
{...register("contract_subitem_id")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="contract_subitem_id">
{errors.contract_subitem_id ? errors.contract_subitem_id.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.project_name} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="project_name">پروژه</InputLabel>
<OutlinedInput
id="project_name"
label={"پروژه"}
autoComplete="off"
{...register("project_name")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="project_name">
{errors.project_name ? errors.project_name.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.employer} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="employer">کارفرما</InputLabel>
<OutlinedInput
id="employer"
label={"کارفرما"}
autoComplete="off"
{...register("employer")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="employer">{errors.employer ? errors.employer.message : null}</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.consultant} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="consultant">مشاور</InputLabel>
<OutlinedInput
id="consultant"
label={"مشاور"}
autoComplete="off"
{...register("consultant")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="consultant">
{errors.consultant ? errors.consultant.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.contractor} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="contractor">پیمانکار</InputLabel>
<OutlinedInput
id="contractor"
label={"پیمانکار"}
autoComplete="off"
{...register("contractor")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="contractor">
{errors.contractor ? errors.contractor.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.applicant} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="applicant">متقاضی</InputLabel>
<OutlinedInput
id="applicant"
label={"متقاضی"}
autoComplete="off"
{...register("applicant")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="applicant">{errors.applicant ? errors.applicant.message : null}</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.work_number} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="work_number">شماره کار</InputLabel>
<OutlinedInput
id="work_number"
label={"شماره کار"}
autoComplete="off"
{...register("work_number")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="work_number">
{errors.work_number ? errors.work_number.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<FormControl error={!!errors.request_number} size="small" fullWidth variant="outlined">
<InputLabel htmlFor="request_number">شماره درخواست</InputLabel>
<OutlinedInput
id="request_number"
label={"شماره درخواست"}
autoComplete="off"
{...register("request_number")}
size="small"
fullWidth
type="text"
/>
<FormHelperText id="request_number">
{errors.request_number ? errors.request_number.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="request_date"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.request_date} fullWidth size="small" variant="outlined">
<LocalizationProvider
dateAdapter={AdapterDateFnsJalali}
localeText={faIR.components.MuiLocalizationProvider.defaultProps.localeText}
>
<MobileDatePicker
value={value || null}
onChange={(newValue) => {
onChange(newValue);
}}
closeOnSelect
slotProps={{
textField: {
size: "small",
error: !!errors.request_date,
placeholder: "تاریخ درخواست",
InputProps: {
endAdornment: (
<InputAdornment position="end">
<IconButton
size="small"
onClick={(event) => {
event.stopPropagation();
setValue("request_date", "");
}}
sx={{
color: "#bfbfbf",
"&:hover": {
backgroundColor: "rgba(189, 189, 189, 0.1)",
color: "#363434",
},
}}
>
<ClearIcon />
</IconButton>
</InputAdornment>
),
},
},
}}
/>
</LocalizationProvider>
<FormHelperText id="request_date">
{errors.request_date ? errors.request_date.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="report_date"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<FormControl error={!!errors.report_date} fullWidth size="small" variant="outlined">
<LocalizationProvider
dateAdapter={AdapterDateFnsJalali}
localeText={faIR.components.MuiLocalizationProvider.defaultProps.localeText}
>
<MobileDatePicker
value={value || null}
onChange={(newValue) => {
onChange(newValue);
}}
closeOnSelect
slotProps={{
textField: {
size: "small",
error: !!errors.report_date,
placeholder: "تاریخ گزارش",
InputProps: {
endAdornment: (
<InputAdornment position="end">
<IconButton
size="small"
onClick={(event) => {
event.stopPropagation();
setValue("report_date", "");
}}
sx={{
color: "#bfbfbf",
"&:hover": {
backgroundColor: "rgba(189, 189, 189, 0.1)",
color: "#363434",
},
}}
>
<ClearIcon />
</IconButton>
</InputAdornment>
),
},
},
}}
/>
</LocalizationProvider>
<FormHelperText id="report_date">
{errors.report_date ? errors.report_date.message : null}
</FormHelperText>
</FormControl>
)}
/>
</Grid>
</Grid>
);
};
export default CandUGeneralInfo;

82
src/components/dashboard/azmayesh/Forms/CandUAzmayesh/CandUMapBox.jsx
View File

@@ -1,41 +1,41 @@
"use client";
import { Box, Stack } from "@mui/material";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
import CandUChooseLocation from "./CandUChooseLocation";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const CandUMapBox = ({ mapBoxData, setMapBoxData }) => {
return (
<Stack spacing={1} sx={{ height: "500px" }}>
<Box
sx={{
p: 1,
border: "1px dashed",
borderColor: "divider",
borderRadius: 1,
height: "100%",
}}
>
<Box
sx={{
height: "100%",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<MapLayer>
<CandUChooseLocation mapBoxData={mapBoxData} setMapBoxData={setMapBoxData} />
</MapLayer>
</Box>
</Box>
</Stack>
);
};
export default CandUMapBox;
"use client";
import { Box, Stack } from "@mui/material";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
import CandUChooseLocation from "./CandUChooseLocation";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const CandUMapBox = ({ mapBoxData, setMapBoxData }) => {
return (
<Stack spacing={1} sx={{ height: "500px" }}>
<Box
sx={{
p: 1,
border: "1px dashed",
borderColor: "divider",
borderRadius: 1,
height: "100%",
}}
>
<Box
sx={{
height: "100%",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<MapLayer>
<CandUChooseLocation mapBoxData={mapBoxData} setMapBoxData={setMapBoxData} />
</MapLayer>
</Box>
</Box>
</Stack>
);
};
export default CandUMapBox;

130
src/components/dashboard/azmayesh/Forms/CandUAzmayesh/CandUTimeLine.jsx
View File

@@ -1,65 +1,65 @@
"use client";
import { Box, Typography } from "@mui/material";
import TextSnippetIcon from "@mui/icons-material/TextSnippet";
import TravelExploreIcon from "@mui/icons-material/TravelExplore";
import {
Timeline,
TimelineConnector,
TimelineContent,
TimelineDot,
TimelineItem,
timelineItemClasses,
TimelineSeparator,
} from "@mui/lab";
const CandUCreateTimeLine = ({ tabState }) => {
return (
<Box sx={{ display: "flex", alignItems: "center" }}>
<Timeline
position="right"
sx={{
[`& .${timelineItemClasses.root}:before`]: { flex: 0, padding: 0 },
}}
>
<TimelineItem>
<TimelineSeparator>
<TimelineConnector />
<TimelineDot sx={{ backgroundColor: "#fff" }}>
<TravelExploreIcon
color={tabState === 0 ? "primary" : "error"}
sx={{ width: "1.5rem", height: "1.5rem" }}
/>
</TimelineDot>
<TimelineConnector />
</TimelineSeparator>
<TimelineContent sx={{ py: "12px", px: 2 }}>
<Typography variant="h6">نقشه</Typography>
<Typography variant="caption" sx={{ color: "#606060" }}>
ثبت مختصات محل آزمایش
</Typography>
</TimelineContent>
</TimelineItem>
<TimelineItem>
<TimelineSeparator>
<TimelineConnector />
<TimelineDot sx={{ backgroundColor: "#fff" }}>
<TextSnippetIcon
color={tabState === 1 ? "primary" : "error"}
sx={{ width: "1.5rem", height: "1.5rem" }}
/>
</TimelineDot>
<TimelineConnector />
</TimelineSeparator>
<TimelineContent sx={{ py: "12px", px: 2 }}>
<Typography variant="h6">مشخصات آزمایش</Typography>
<Typography variant="caption" sx={{ color: "#606060" }}>
ثبت مشخصات اولیه
</Typography>
</TimelineContent>
</TimelineItem>
</Timeline>
</Box>
);
};
export default CandUCreateTimeLine;
"use client";
import { Box, Typography } from "@mui/material";
import TextSnippetIcon from "@mui/icons-material/TextSnippet";
import TravelExploreIcon from "@mui/icons-material/TravelExplore";
import {
Timeline,
TimelineConnector,
TimelineContent,
TimelineDot,
TimelineItem,
timelineItemClasses,
TimelineSeparator,
} from "@mui/lab";
const CandUCreateTimeLine = ({ tabState }) => {
return (
<Box sx={{ display: "flex", alignItems: "center" }}>
<Timeline
position="right"
sx={{
[`& .${timelineItemClasses.root}:before`]: { flex: 0, padding: 0 },
}}
>
<TimelineItem>
<TimelineSeparator>
<TimelineConnector />
<TimelineDot sx={{ backgroundColor: "#fff" }}>
<TravelExploreIcon
color={tabState === 0 ? "primary" : "error"}
sx={{ width: "1.5rem", height: "1.5rem" }}
/>
</TimelineDot>
<TimelineConnector />
</TimelineSeparator>
<TimelineContent sx={{ py: "12px", px: 2 }}>
<Typography variant="h6">نقشه</Typography>
<Typography variant="caption" sx={{ color: "#606060" }}>
ثبت مختصات محل آزمایش
</Typography>
</TimelineContent>
</TimelineItem>
<TimelineItem>
<TimelineSeparator>
<TimelineConnector />
<TimelineDot sx={{ backgroundColor: "#fff" }}>
<TextSnippetIcon
color={tabState === 1 ? "primary" : "error"}
sx={{ width: "1.5rem", height: "1.5rem" }}
/>
</TimelineDot>
<TimelineConnector />
</TimelineSeparator>
<TimelineContent sx={{ py: "12px", px: 2 }}>
<Typography variant="h6">مشخصات آزمایش</Typography>
<Typography variant="caption" sx={{ color: "#606060" }}>
ثبت مشخصات اولیه
</Typography>
</TimelineContent>
</TimelineItem>
</Timeline>
</Box>
);
};
export default CandUCreateTimeLine;

400
src/components/dashboard/azmayesh/Forms/CandUAzmayesh/FormAndRequest.jsx
View File

@@ -1,200 +1,200 @@
"use client";
import { Box, Button, DialogActions, DialogContent, Tab, Tabs, useMediaQuery } from "@mui/material";
import React, { useState } from "react";
import { useTheme } from "@emotion/react";
import useRequest from "@/lib/hooks/useRequest";
import { object, string } from "yup";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import moment from "jalali-moment";
import { CREATE_AZMAYESH, UPDATE_AZMAYESH } from "@/core/utils/routes";
import StyledForm from "@/core/components/StyledForm";
import TravelExploreIcon from "@mui/icons-material/TravelExplore";
import TextSnippetIcon from "@mui/icons-material/TextSnippet";
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import CandUMapBox from "./CandUMapBox";
import CandUCreateTimeLine from "./CandUTimeLine";
import CandUGeneralInfo from "./CandUGeneralInfo";
function TabPanel(props) {
const { children, value, index } = props;
return (
<div role="tabpanel" hidden={value !== index}>
{value === index && <Box>{children}</Box>}
</div>
);
}
const validationSchema = object({
azmayesh_type_id: string().required("نوع آزمایش را مشخص کنید!"),
province_id: string().required("استان را وارد کنید!"),
contract_subitem_id: string().required("کد یکتا پروژه را وارد کنید!"),
project_name: string().required("عنوان پروژه را وارد کنید!"),
employer: string().required("کارفرما را وارد کنید!"),
consultant: string().required("مشاور را وارد کنید!"),
contractor: string().required("پیمانکار را وارد کنید!"),
applicant: string().required("متقاضی را وارد کنید!"),
work_number: string().required("شماره کار را وارد کنید!"),
request_number: string().required("شماره درخواست را وارد کنید!"),
request_date: string().required("تاریخ درخواست را وارد کنید!"),
report_date: string().required("تاریخ گزارش را وارد کنید!"),
});
const CandUAzmayesh = ({ setOpen, mutate, updateInfo, rowId }) => {
const theme = useTheme();
const requestServer = useRequest({ notificationSuccess: true });
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [tabState, setTabState] = useState(0);
const [mapBoxData, setMapBoxData] = useState(updateInfo ? { lat: updateInfo.lat, lng: updateInfo.lng } : null);
const handleClose = () => {
setOpen(false);
};
const handleChangeTab = (event, newValue) => {
setTabState(newValue);
};
const handlePrev = () => {
if (tabState === 0) {
handleClose();
} else {
setTabState(tabState - 1);
}
};
const defaultValues = {
azmayesh_type_id: updateInfo ? updateInfo.azmayesh_type_id : "",
azmayesh_type_name: updateInfo ? updateInfo.azmayesh_type_name : "",
province_id: updateInfo ? updateInfo.province_id : "",
province_name: updateInfo ? updateInfo.province_name : "",
contract_subitem_id: updateInfo ? updateInfo.contract_subitem_id : "",
project_name: updateInfo ? updateInfo.project_name : "",
employer: updateInfo ? updateInfo.employer : "",
consultant: updateInfo ? updateInfo.consultant : "",
contractor: updateInfo ? updateInfo.contractor : "",
applicant: updateInfo ? updateInfo.applicant : "",
work_number: updateInfo ? updateInfo.work_number : "",
request_number: updateInfo ? updateInfo.request_number : "",
request_date: updateInfo ? moment(updateInfo.request_date, "YYYY-MM-DD").toDate() : "",
report_date: updateInfo ? moment(updateInfo.report_date, "YYYY-MM-DD").toDate() : "",
};
const {
control,
register,
handleSubmit,
setValue,
formState: { isSubmitting, errors },
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("lat", mapBoxData.lat);
formData.append("lng", mapBoxData.lng);
formData.append("azmayesh_type_id", data.azmayesh_type_id);
formData.append("azmayesh_type_name", data.azmayesh_type_name);
formData.append("province_id", data.province_id);
formData.append("province_name", data.province_name);
formData.append("contract_subitem_id", data.contract_subitem_id);
formData.append("project_name", data.project_name);
formData.append("employer", data.employer);
formData.append("consultant", data.consultant);
formData.append("contractor", data.contractor);
formData.append("applicant", data.applicant);
formData.append("work_number", data.work_number);
formData.append("request_number", data.request_number);
formData.append("request_date", moment(new Date(data.request_date)).format("YYYY-MM-DD"));
formData.append("report_date", moment(new Date(data.report_date)).format("YYYY-MM-DD"));
try {
await requestServer(updateInfo ? `${UPDATE_AZMAYESH}/${rowId}` : CREATE_AZMAYESH, "post", {
data: formData,
});
mutate();
handleClose();
} catch (error) {}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmit)}>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant={`${isMobile ? "scrollable" : "fullWidth"}`}
sx={{
display: "flex",
justifyContent: "space-around",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab icon={<TravelExploreIcon />} label="انتخاب محل آزمایش"></Tab>
<Tab disabled={!mapBoxData} icon={<TextSnippetIcon />} label="مشخصات آزمایش"></Tab>
</Tabs>
<DialogContent dividers sx={{ display: "flex" }}>
<Box sx={{ flex: 1 }}>
<TabPanel value={tabState} index={0}>
<CandUMapBox mapBoxData={mapBoxData} setMapBoxData={setMapBoxData} />
</TabPanel>
<TabPanel value={tabState} index={1}>
<CandUGeneralInfo control={control} register={register} setValue={setValue} errors={errors} />
</TabPanel>
</Box>
{!isMobile && (
<Box sx={{ display: "flex", alignItems: "center" }}>
<CandUCreateTimeLine tabState={tabState} />
</Box>
)}
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
variant="outlined"
color="error"
size="large"
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
>
{tabState === 0 ? "بستن" : "مرحله قبل"}
</Button>
{tabState === 0 ? (
<Button
onClick={(event) => {
event.preventDefault();
setTabState(tabState + 1);
}}
variant="contained"
size="large"
disabled={!mapBoxData}
endIcon={<KeyboardDoubleArrowLeftIcon />}
>
مرحله بعد
</Button>
) : (
<Button
variant="contained"
size="large"
disabled={isSubmitting}
type={"submit"}
endIcon={<BeenhereIcon />}
>
{updateInfo
? isSubmitting
? "در حال ویرایش آزمایش"
: "ویرایش آزمایش"
: isSubmitting
? "در حال ثبت آزمایش"
: "ثبت آزمایش"}
</Button>
)}
</DialogActions>
</StyledForm>
);
};
export default CandUAzmayesh;
"use client";
import { Box, Button, DialogActions, DialogContent, Tab, Tabs, useMediaQuery } from "@mui/material";
import React, { useState } from "react";
import { useTheme } from "@emotion/react";
import useRequest from "@/lib/hooks/useRequest";
import { object, string } from "yup";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import moment from "jalali-moment";
import { CREATE_AZMAYESH, UPDATE_AZMAYESH } from "@/core/utils/routes";
import StyledForm from "@/core/components/StyledForm";
import TravelExploreIcon from "@mui/icons-material/TravelExplore";
import TextSnippetIcon from "@mui/icons-material/TextSnippet";
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import CandUMapBox from "./CandUMapBox";
import CandUCreateTimeLine from "./CandUTimeLine";
import CandUGeneralInfo from "./CandUGeneralInfo";
function TabPanel(props) {
const { children, value, index } = props;
return (
<div role="tabpanel" hidden={value !== index}>
{value === index && <Box>{children}</Box>}
</div>
);
}
const validationSchema = object({
azmayesh_type_id: string().required("نوع آزمایش را مشخص کنید!"),
province_id: string().required("استان را وارد کنید!"),
contract_subitem_id: string().required("کد یکتا پروژه را وارد کنید!"),
project_name: string().required("عنوان پروژه را وارد کنید!"),
employer: string().required("کارفرما را وارد کنید!"),
consultant: string().required("مشاور را وارد کنید!"),
contractor: string().required("پیمانکار را وارد کنید!"),
applicant: string().required("متقاضی را وارد کنید!"),
work_number: string().required("شماره کار را وارد کنید!"),
request_number: string().required("شماره درخواست را وارد کنید!"),
request_date: string().required("تاریخ درخواست را وارد کنید!"),
report_date: string().required("تاریخ گزارش را وارد کنید!"),
});
const CandUAzmayesh = ({ setOpen, mutate, updateInfo, rowId }) => {
const theme = useTheme();
const requestServer = useRequest({ notificationSuccess: true });
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [tabState, setTabState] = useState(0);
const [mapBoxData, setMapBoxData] = useState(updateInfo ? { lat: updateInfo.lat, lng: updateInfo.lng } : null);
const handleClose = () => {
setOpen(false);
};
const handleChangeTab = (event, newValue) => {
setTabState(newValue);
};
const handlePrev = () => {
if (tabState === 0) {
handleClose();
} else {
setTabState(tabState - 1);
}
};
const defaultValues = {
azmayesh_type_id: updateInfo ? updateInfo.azmayesh_type_id : "",
azmayesh_type_name: updateInfo ? updateInfo.azmayesh_type_name : "",
province_id: updateInfo ? updateInfo.province_id : "",
province_name: updateInfo ? updateInfo.province_name : "",
contract_subitem_id: updateInfo ? updateInfo.contract_subitem_id : "",
project_name: updateInfo ? updateInfo.project_name : "",
employer: updateInfo ? updateInfo.employer : "",
consultant: updateInfo ? updateInfo.consultant : "",
contractor: updateInfo ? updateInfo.contractor : "",
applicant: updateInfo ? updateInfo.applicant : "",
work_number: updateInfo ? updateInfo.work_number : "",
request_number: updateInfo ? updateInfo.request_number : "",
request_date: updateInfo ? moment(updateInfo.request_date, "YYYY-MM-DD").toDate() : "",
report_date: updateInfo ? moment(updateInfo.report_date, "YYYY-MM-DD").toDate() : "",
};
const {
control,
register,
handleSubmit,
setValue,
formState: { isSubmitting, errors },
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("lat", mapBoxData.lat);
formData.append("lng", mapBoxData.lng);
formData.append("azmayesh_type_id", data.azmayesh_type_id);
formData.append("azmayesh_type_name", data.azmayesh_type_name);
formData.append("province_id", data.province_id);
formData.append("province_name", data.province_name);
formData.append("contract_subitem_id", data.contract_subitem_id);
formData.append("project_name", data.project_name);
formData.append("employer", data.employer);
formData.append("consultant", data.consultant);
formData.append("contractor", data.contractor);
formData.append("applicant", data.applicant);
formData.append("work_number", data.work_number);
formData.append("request_number", data.request_number);
formData.append("request_date", moment(new Date(data.request_date)).format("YYYY-MM-DD"));
formData.append("report_date", moment(new Date(data.report_date)).format("YYYY-MM-DD"));
try {
await requestServer(updateInfo ? `${UPDATE_AZMAYESH}/${rowId}` : CREATE_AZMAYESH, "post", {
data: formData,
});
mutate();
handleClose();
} catch (error) {}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmit)}>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant={`${isMobile ? "scrollable" : "fullWidth"}`}
sx={{
display: "flex",
justifyContent: "space-around",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab icon={<TravelExploreIcon />} label="انتخاب محل آزمایش"></Tab>
<Tab disabled={!mapBoxData} icon={<TextSnippetIcon />} label="مشخصات آزمایش"></Tab>
</Tabs>
<DialogContent dividers sx={{ display: "flex" }}>
<Box sx={{ flex: 1 }}>
<TabPanel value={tabState} index={0}>
<CandUMapBox mapBoxData={mapBoxData} setMapBoxData={setMapBoxData} />
</TabPanel>
<TabPanel value={tabState} index={1}>
<CandUGeneralInfo control={control} register={register} setValue={setValue} errors={errors} />
</TabPanel>
</Box>
{!isMobile && (
<Box sx={{ display: "flex", alignItems: "center" }}>
<CandUCreateTimeLine tabState={tabState} />
</Box>
)}
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
variant="outlined"
color="error"
size="large"
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
>
{tabState === 0 ? "بستن" : "مرحله قبل"}
</Button>
{tabState === 0 ? (
<Button
onClick={(event) => {
event.preventDefault();
setTabState(tabState + 1);
}}
variant="contained"
size="large"
disabled={!mapBoxData}
endIcon={<KeyboardDoubleArrowLeftIcon />}
>
مرحله بعد
</Button>
) : (
<Button
variant="contained"
size="large"
disabled={isSubmitting}
type={"submit"}
endIcon={<BeenhereIcon />}
>
{updateInfo
? isSubmitting
? "در حال ویرایش آزمایش"
: "ویرایش آزمایش"
: isSubmitting
? "در حال ثبت آزمایش"
: "ثبت آزمایش"}
</Button>
)}
</DialogActions>
</StyledForm>
);
};
export default CandUAzmayesh;

76
src/components/dashboard/azmayesh/Forms/CandUAzmayesh/index.jsx
View File

@@ -1,38 +1,38 @@
"use client";
import { Dialog, IconButton } from "@mui/material";
import FormAndRequest from "./FormAndRequest";
import DialogLoading from "@/core/components/DialogLoading";
import CloseIcon from "@mui/icons-material/Close";
const CandUAzmayesh = ({ open, setOpen, mutate, updateInfo, rowId, loadingOpen, fromUpdate = false }) => {
const isUpdateReady = fromUpdate ? updateInfo !== null : true;
return (
<Dialog open={open} fullWidth maxWidth="lg">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{isUpdateReady ? (
<FormAndRequest
setOpen={setOpen}
mutate={mutate}
rowId={rowId}
{...(fromUpdate ? { updateInfo } : {})}
/>
) : (
<DialogLoading loadingOpen={loadingOpen} />
)}
</Dialog>
);
};
export default CandUAzmayesh;
"use client";
import { Dialog, IconButton } from "@mui/material";
import FormAndRequest from "./FormAndRequest";
import DialogLoading from "@/core/components/DialogLoading";
import CloseIcon from "@mui/icons-material/Close";
const CandUAzmayesh = ({ open, setOpen, mutate, updateInfo, rowId, loadingOpen, fromUpdate = false }) => {
const isUpdateReady = fromUpdate ? updateInfo !== null : true;
return (
<Dialog open={open} fullWidth maxWidth="lg">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{isUpdateReady ? (
<FormAndRequest
setOpen={setOpen}
mutate={mutate}
rowId={rowId}
{...(fromUpdate ? { updateInfo } : {})}
/>
) : (
<DialogLoading loadingOpen={loadingOpen} />
)}
</Dialog>
);
};
export default CandUAzmayesh;

104
src/components/dashboard/azmayesh/RowActions/AzmayeshUpdate/index.jsx
View File

@@ -1,52 +1,52 @@
import { IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import EditIcon from "@mui/icons-material/Edit";
import { GET_AZMAYESH_LIST } from "@/core/utils/routes";
import CandUAzmayesh from "@/components/dashboard/azmayesh/Forms/CandUAzmayesh";
const AzmayeshUpdate = ({ rowId, mutate }) => {
const requestServer = useRequest();
const [openUpdateDialog, setOpenUpdateDialog] = useState(false);
const [updateInfo, setUpdateInfo] = useState(null);
const [loadingOpen, setLoadingOpen] = useState(false);
const handleGetInfo = () => {
setLoadingOpen(true);
setOpenUpdateDialog(true);
requestServer(`${GET_AZMAYESH_LIST}/${rowId}`, "get")
.then((response) => {
setUpdateInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setLoadingOpen(false);
});
};
return (
<>
<Tooltip title="ویرایش آزمایش" arrow placement="right">
<IconButton
color="success"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetInfo}
>
<EditIcon />
</IconButton>
</Tooltip>
{openUpdateDialog && (
<CandUAzmayesh
open={openUpdateDialog}
setOpen={setOpenUpdateDialog}
mutate={mutate}
updateInfo={updateInfo}
rowId={rowId}
loadingOpen={loadingOpen}
fromUpdate={true}
/>
)}
</>
);
};
export default AzmayeshUpdate;
import { IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import EditIcon from "@mui/icons-material/Edit";
import { GET_AZMAYESH_LIST } from "@/core/utils/routes";
import CandUAzmayesh from "@/components/dashboard/azmayesh/Forms/CandUAzmayesh";
const AzmayeshUpdate = ({ rowId, mutate }) => {
const requestServer = useRequest();
const [openUpdateDialog, setOpenUpdateDialog] = useState(false);
const [updateInfo, setUpdateInfo] = useState(null);
const [loadingOpen, setLoadingOpen] = useState(false);
const handleGetInfo = () => {
setLoadingOpen(true);
setOpenUpdateDialog(true);
requestServer(`${GET_AZMAYESH_LIST}/${rowId}`, "get")
.then((response) => {
setUpdateInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setLoadingOpen(false);
});
};
return (
<>
<Tooltip title="ویرایش آزمایش" arrow placement="right">
<IconButton
color="success"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetInfo}
>
<EditIcon />
</IconButton>
</Tooltip>
{openUpdateDialog && (
<CandUAzmayesh
open={openUpdateDialog}
setOpen={setOpenUpdateDialog}
mutate={mutate}
updateInfo={updateInfo}
rowId={rowId}
loadingOpen={loadingOpen}
fromUpdate={true}
/>
)}
</>
);
};
export default AzmayeshUpdate;

156
src/components/dashboard/azmayesh/RowActions/DeleteAzmayesh/index.jsx
View File

@@ -1,78 +1,78 @@
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography,
} from "@mui/material";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import DeleteIcon from "@mui/icons-material/Delete";
import { DELETE_AZMAYESH } from "@/core/utils/routes";
const DeleteAzmayesh = ({ rowId, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
setIsSubmitting(true);
requestServer(`${DELETE_AZMAYESH}/${rowId}`, "post")
.then(() => {
setOpenDeleteDialog(false);
mutate();
})
.catch(() => {})
.finally(() => {
setIsSubmitting(false);
});
};
return (
<>
<Tooltip title="حذف آزمایش" arrow placement="right">
<IconButton
color="error"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="sm"
open={openDeleteDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<DialogTitle>حذف آزمایش</DialogTitle>
<DialogContent>
<Typography>آیا از حذف این آزمایش مطمئن هستید؟</Typography>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenDeleteDialog(false)}
variant="outlined"
color="primary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="error" disabled={isSubmitting}>
حذف
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteAzmayesh;
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography,
} from "@mui/material";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import DeleteIcon from "@mui/icons-material/Delete";
import { DELETE_AZMAYESH } from "@/core/utils/routes";
const DeleteAzmayesh = ({ rowId, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
setIsSubmitting(true);
requestServer(`${DELETE_AZMAYESH}/${rowId}`, "post")
.then(() => {
setOpenDeleteDialog(false);
mutate();
})
.catch(() => {})
.finally(() => {
setIsSubmitting(false);
});
};
return (
<>
<Tooltip title="حذف آزمایش" arrow placement="right">
<IconButton
color="error"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="sm"
open={openDeleteDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<DialogTitle>حذف آزمایش</DialogTitle>
<DialogContent>
<Typography>آیا از حذف این آزمایش مطمئن هستید؟</Typography>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenDeleteDialog(false)}
variant="outlined"
color="primary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="error" disabled={isSubmitting}>
حذف
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteAzmayesh;

118
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Actions/Create/index.jsx
View File

@@ -1,59 +1,59 @@
import { Button, IconButton, useMediaQuery } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_AZMAYESH_SAMPLE_FIELDS } from "@/core/utils/routes";
import { AddCircle } from "@mui/icons-material";
import { useTheme } from "@emotion/react";
import CandUSampleOfAzmayesh from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Forms/CandUSampleOfAzmayesh";
const AddSampleToAzmayesh = ({ azmayeshTypeId, mutate, rowId }) => {
const requestServer = useRequest();
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [sampleInfo, setSampleInfo] = useState(null);
const [openAddSampleDialog, setOpenAddSampleDialog] = useState(false);
const [defaultValues, setDefaultValues] = useState({});
const handleGetFields = () => {
requestServer(`${GET_AZMAYESH_SAMPLE_FIELDS}/${azmayeshTypeId}`, "get")
.then((response) => {
setSampleInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setOpenAddSampleDialog(true);
});
};
useEffect(() => {
const initialValues = sampleInfo?.reduce((acc, item) => {
acc[item.id] = "";
return acc;
}, {});
setDefaultValues(initialValues);
}, [sampleInfo]);
return (
<>
{isMobile ? (
<IconButton aria-label="ایجاد نمونه جدید" color="primary" onClick={handleGetFields}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button variant="contained" color="primary" startIcon={<AddCircle />} onClick={handleGetFields}>
ثبت نمونه
</Button>
)}
<CandUSampleOfAzmayesh
openSampleDialog={openAddSampleDialog}
setOpenSampleDialog={setOpenAddSampleDialog}
sampleInfo={sampleInfo}
mutate={mutate}
rowId={rowId}
defaultValues={defaultValues}
setDefaultValues={setDefaultValues}
/>
</>
);
};
export default AddSampleToAzmayesh;
import { Button, IconButton, useMediaQuery } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_AZMAYESH_SAMPLE_FIELDS } from "@/core/utils/routes";
import { AddCircle } from "@mui/icons-material";
import { useTheme } from "@emotion/react";
import CandUSampleOfAzmayesh from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Forms/CandUSampleOfAzmayesh";
const AddSampleToAzmayesh = ({ azmayeshTypeId, mutate, rowId }) => {
const requestServer = useRequest();
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [sampleInfo, setSampleInfo] = useState(null);
const [openAddSampleDialog, setOpenAddSampleDialog] = useState(false);
const [defaultValues, setDefaultValues] = useState({});
const handleGetFields = () => {
requestServer(`${GET_AZMAYESH_SAMPLE_FIELDS}/${azmayeshTypeId}`, "get")
.then((response) => {
setSampleInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setOpenAddSampleDialog(true);
});
};
useEffect(() => {
const initialValues = sampleInfo?.reduce((acc, item) => {
acc[item.id] = "";
return acc;
}, {});
setDefaultValues(initialValues);
}, [sampleInfo]);
return (
<>
{isMobile ? (
<IconButton aria-label="ایجاد نمونه جدید" color="primary" onClick={handleGetFields}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button variant="contained" color="primary" startIcon={<AddCircle />} onClick={handleGetFields}>
ثبت نمونه
</Button>
)}
<CandUSampleOfAzmayesh
openSampleDialog={openAddSampleDialog}
setOpenSampleDialog={setOpenAddSampleDialog}
sampleInfo={sampleInfo}
mutate={mutate}
rowId={rowId}
defaultValues={defaultValues}
setDefaultValues={setDefaultValues}
/>
</>
);
};
export default AddSampleToAzmayesh;

164
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/AzmayeshInfo.jsx
View File

@@ -1,82 +1,82 @@
"use client";
import { Box, Chip, Divider, Grid, Stack, Typography } from "@mui/material";
import ScienceIcon from "@mui/icons-material/Science";
import LocationCityIcon from "@mui/icons-material/LocationCity";
const AzmayeshInfo = ({ rowData }) => {
return (
<Stack sx={{ p: 2, alignItems: "center" }}>
<Typography variant="body1" sx={{ fontWeight: 600, pb: 4 }}>
{rowData.project_name}
</Typography>
<Grid container spacing={2} sx={{ alignItems: "center", justifyContent: "space-around" }}>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<ScienceIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
نوع آزمایش
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.azmayesh_type_name}
</Typography>
</Grid>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<LocationCityIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
نام استان
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.province_name}
</Typography>
</Grid>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<LocationCityIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
شماره کار
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.work_number}
</Typography>
</Grid>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<LocationCityIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
شماره درخواست
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.request_number}
</Typography>
</Grid>
</Grid>
</Stack>
);
};
export default AzmayeshInfo;
"use client";
import { Box, Chip, Divider, Grid, Stack, Typography } from "@mui/material";
import ScienceIcon from "@mui/icons-material/Science";
import LocationCityIcon from "@mui/icons-material/LocationCity";
const AzmayeshInfo = ({ rowData }) => {
return (
<Stack sx={{ p: 2, alignItems: "center" }}>
<Typography variant="body1" sx={{ fontWeight: 600, pb: 4 }}>
{rowData.project_name}
</Typography>
<Grid container spacing={2} sx={{ alignItems: "center", justifyContent: "space-around" }}>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<ScienceIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
نوع آزمایش
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.azmayesh_type_name}
</Typography>
</Grid>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<LocationCityIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
نام استان
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.province_name}
</Typography>
</Grid>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<LocationCityIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
شماره کار
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.work_number}
</Typography>
</Grid>
<Grid item xs={12} sm={6} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<LocationCityIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
شماره درخواست
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{rowData.request_number}
</Typography>
</Grid>
</Grid>
</Stack>
);
};
export default AzmayeshInfo;

152
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Forms/CandUSampleOfAzmayesh/FormAndRequest.jsx
View File

@@ -1,76 +1,76 @@
import { Button, DialogActions, DialogContent, DialogTitle } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import React, { useState } from "react";
import { ADD_SAMPLE_TO_AZMAYESH, UPDATE_SAMPLE_OF_AZMAYESH } from "@/core/utils/routes";
import FormMaker from "@/core/components/FormMaker";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
const CandUSampleOfAzmayesh = ({
sampleInfo,
mutate,
rowId,
setOpenSampleDialog,
defaultValues,
setDefaultValues,
isUpdate,
azmayesh_id,
}) => {
const requestServer = useRequest({ notificationSuccess: true });
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async () => {
const data = {};
setIsSubmitting(true);
const formData = new FormData();
formData.append("azmayesh_id", isUpdate ? azmayesh_id : rowId);
Object.entries(defaultValues).forEach(([key, value]) => {
data[key] = value;
});
formData.append("data", JSON.stringify(data));
try {
await requestServer(
isUpdate ? `${UPDATE_SAMPLE_OF_AZMAYESH}/${rowId}` : `${ADD_SAMPLE_TO_AZMAYESH}`,
"post",
{
data: formData,
}
);
mutate();
setOpenSampleDialog(false);
setIsSubmitting(false);
} catch (error) {
setIsSubmitting(false);
}
};
return (
<>
<DialogHeader>
<DialogTitle>{isUpdate ? "ویرایش نمونه" : "افزودن نمونه"}</DialogTitle>
</DialogHeader>
<DialogContent>
<FormMaker formInfo={sampleInfo} defaultValues={defaultValues} setDefaultValues={setDefaultValues} />
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenSampleDialog(false)}
variant="outlined"
color="error"
disabled={isSubmitting}
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="primary" disabled={isSubmitting}>
{isUpdate
? isSubmitting
? "در حال ویرایش نمونه"
: "ویرایش نمونه"
: isSubmitting
? "در حال ثبت نمونه"
: "ثبت نمونه"}
</Button>
</DialogActions>
</>
);
};
export default CandUSampleOfAzmayesh;
import { Button, DialogActions, DialogContent, DialogTitle } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import React, { useState } from "react";
import { ADD_SAMPLE_TO_AZMAYESH, UPDATE_SAMPLE_OF_AZMAYESH } from "@/core/utils/routes";
import FormMaker from "@/core/components/FormMaker";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
const CandUSampleOfAzmayesh = ({
sampleInfo,
mutate,
rowId,
setOpenSampleDialog,
defaultValues,
setDefaultValues,
isUpdate,
azmayesh_id,
}) => {
const requestServer = useRequest({ notificationSuccess: true });
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async () => {
const data = {};
setIsSubmitting(true);
const formData = new FormData();
formData.append("azmayesh_id", isUpdate ? azmayesh_id : rowId);
Object.entries(defaultValues).forEach(([key, value]) => {
data[key] = value;
});
formData.append("data", JSON.stringify(data));
try {
await requestServer(
isUpdate ? `${UPDATE_SAMPLE_OF_AZMAYESH}/${rowId}` : `${ADD_SAMPLE_TO_AZMAYESH}`,
"post",
{
data: formData,
}
);
mutate();
setOpenSampleDialog(false);
setIsSubmitting(false);
} catch (error) {
setIsSubmitting(false);
}
};
return (
<>
<DialogHeader>
<DialogTitle>{isUpdate ? "ویرایش نمونه" : "افزودن نمونه"}</DialogTitle>
</DialogHeader>
<DialogContent>
<FormMaker formInfo={sampleInfo} defaultValues={defaultValues} setDefaultValues={setDefaultValues} />
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenSampleDialog(false)}
variant="outlined"
color="error"
disabled={isSubmitting}
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="primary" disabled={isSubmitting}>
{isUpdate
? isSubmitting
? "در حال ویرایش نمونه"
: "ویرایش نمونه"
: isSubmitting
? "در حال ثبت نمونه"
: "ثبت نمونه"}
</Button>
</DialogActions>
</>
);
};
export default CandUSampleOfAzmayesh;

148
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Forms/CandUSampleOfAzmayesh/index.jsx
View File

@@ -1,74 +1,74 @@
import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import React, { useState } from "react";
import { ADD_SAMPLE_TO_AZMAYESH, UPDATE_SAMPLE_OF_AZMAYESH } from "@/core/utils/routes";
import FormMaker from "@/core/components/FormMaker";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
const CandUSampleOfAzmayesh = ({
sampleInfo,
mutate,
rowId,
openSampleDialog,
setOpenSampleDialog,
defaultValues,
setDefaultValues,
isUpdate,
azmayesh_id,
}) => {
const requestServer = useRequest({ notificationSuccess: true });
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
const data = {};
setIsSubmitting(true);
const formData = new FormData();
formData.append("azmayesh_id", isUpdate ? azmayesh_id : rowId);
Object.entries(defaultValues).forEach(([key, value]) => {
data[key] = value;
});
formData.append("data", JSON.stringify(data));
requestServer(isUpdate ? `${UPDATE_SAMPLE_OF_AZMAYESH}/${rowId}` : `${ADD_SAMPLE_TO_AZMAYESH}`, "post", {
data: formData,
})
.then(() => {
mutate();
})
.catch(() => {})
.finally(() => {
setOpenSampleDialog(false);
setIsSubmitting(false);
});
};
return (
<Dialog maxWidth="md" fullWidth open={openSampleDialog}>
<DialogHeader>
<DialogTitle>{isUpdate ? "ویرایش نمونه" : "افزودن نمونه"}</DialogTitle>
</DialogHeader>
<DialogContent>
<FormMaker formInfo={sampleInfo} defaultValues={defaultValues} setDefaultValues={setDefaultValues} />
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenSampleDialog(false)}
variant="outlined"
color="error"
disabled={isSubmitting}
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="primary" disabled={isSubmitting}>
{isUpdate
? isSubmitting
? "در حال ویرایش نمونه"
: "ویرایش نمونه"
: isSubmitting
? "در حال ثبت نمونه"
: "ثبت نمونه"}
</Button>
</DialogActions>
</Dialog>
);
};
export default CandUSampleOfAzmayesh;
import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import React, { useState } from "react";
import { ADD_SAMPLE_TO_AZMAYESH, UPDATE_SAMPLE_OF_AZMAYESH } from "@/core/utils/routes";
import FormMaker from "@/core/components/FormMaker";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
const CandUSampleOfAzmayesh = ({
sampleInfo,
mutate,
rowId,
openSampleDialog,
setOpenSampleDialog,
defaultValues,
setDefaultValues,
isUpdate,
azmayesh_id,
}) => {
const requestServer = useRequest({ notificationSuccess: true });
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
const data = {};
setIsSubmitting(true);
const formData = new FormData();
formData.append("azmayesh_id", isUpdate ? azmayesh_id : rowId);
Object.entries(defaultValues).forEach(([key, value]) => {
data[key] = value;
});
formData.append("data", JSON.stringify(data));
requestServer(isUpdate ? `${UPDATE_SAMPLE_OF_AZMAYESH}/${rowId}` : `${ADD_SAMPLE_TO_AZMAYESH}`, "post", {
data: formData,
})
.then(() => {
mutate();
})
.catch(() => {})
.finally(() => {
setOpenSampleDialog(false);
setIsSubmitting(false);
});
};
return (
<Dialog maxWidth="md" fullWidth open={openSampleDialog}>
<DialogHeader>
<DialogTitle>{isUpdate ? "ویرایش نمونه" : "افزودن نمونه"}</DialogTitle>
</DialogHeader>
<DialogContent>
<FormMaker formInfo={sampleInfo} defaultValues={defaultValues} setDefaultValues={setDefaultValues} />
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenSampleDialog(false)}
variant="outlined"
color="error"
disabled={isSubmitting}
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="primary" disabled={isSubmitting}>
{isUpdate
? isSubmitting
? "در حال ویرایش نمونه"
: "ویرایش نمونه"
: isSubmitting
? "در حال ثبت نمونه"
: "ثبت نمونه"}
</Button>
</DialogActions>
</Dialog>
);
};
export default CandUSampleOfAzmayesh;

156
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/RowActions/DeleteSample.jsx
View File

@@ -1,78 +1,78 @@
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography,
} from "@mui/material";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import DeleteIcon from "@mui/icons-material/Delete";
import { DELETE_SAMPLE_LIST } from "@/core/utils/routes";
const DeleteSample = ({ rowId, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
setIsSubmitting(true);
requestServer(`${DELETE_SAMPLE_LIST}/${rowId}`, "post")
.then(() => {
setOpenDeleteDialog(false);
mutate();
})
.catch(() => {})
.finally(() => {
setIsSubmitting(false);
});
};
return (
<>
<Tooltip title="حذف نمونه" arrow placement="right">
<IconButton
color="error"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="sm"
open={openDeleteDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<DialogTitle>حذف نمونه</DialogTitle>
<DialogContent>
<Typography>آیا از حذف این نمونه مطمئن هستید؟</Typography>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenDeleteDialog(false)}
variant="outlined"
color="primary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="error" disabled={isSubmitting}>
حذف
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteSample;
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography,
} from "@mui/material";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import DeleteIcon from "@mui/icons-material/Delete";
import { DELETE_SAMPLE_LIST } from "@/core/utils/routes";
const DeleteSample = ({ rowId, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
setIsSubmitting(true);
requestServer(`${DELETE_SAMPLE_LIST}/${rowId}`, "post")
.then(() => {
setOpenDeleteDialog(false);
mutate();
})
.catch(() => {})
.finally(() => {
setIsSubmitting(false);
});
};
return (
<>
<Tooltip title="حذف نمونه" arrow placement="right">
<IconButton
color="error"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="sm"
open={openDeleteDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<DialogTitle>حذف نمونه</DialogTitle>
<DialogContent>
<Typography>آیا از حذف این نمونه مطمئن هستید؟</Typography>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenDeleteDialog(false)}
variant="outlined"
color="primary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="error" disabled={isSubmitting}>
حذف
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteSample;

120
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/RowActions/UpdateSample.jsx
View File

@@ -1,60 +1,60 @@
import { IconButton, Tooltip } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_AZMAYESH_SAMPLE_FIELDS, GET_SAMPLE_LIST } from "@/core/utils/routes";
import CandUSampleOfAzmayesh from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Forms/CandUSampleOfAzmayesh";
import EditIcon from "@mui/icons-material/Edit";
const UpdateSample = ({ azmayeshTypeId, mutate, rowId, azmayesh_id }) => {
const requestServer = useRequest();
const [sampleInfo, setSampleInfo] = useState(null);
const [openUpdateSampleDialog, setOpenUpdateSampleDialog] = useState(false);
const [defaultValues, setDefaultValues] = useState({});
const [sampleDetail, setSampleDetail] = useState({});
const handleGetFields = () => {
requestServer(`${GET_AZMAYESH_SAMPLE_FIELDS}/${azmayeshTypeId}`, "get")
.then((response) => {
setSampleInfo(response.data.data);
})
.catch(() => {});
requestServer(`${GET_SAMPLE_LIST}/${rowId}`, "get")
.then((response) => {
setSampleDetail(JSON.parse(response.data.data.data));
})
.catch(() => {})
.finally(() => {
setOpenUpdateSampleDialog(true);
});
};
useEffect(() => {
setDefaultValues(sampleDetail);
}, [sampleDetail]);
return (
<>
<Tooltip title="ویرایش نمونه" arrow placement="right">
<IconButton
color="success"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetFields}
>
<EditIcon />
</IconButton>
</Tooltip>
<CandUSampleOfAzmayesh
openSampleDialog={openUpdateSampleDialog}
setOpenSampleDialog={setOpenUpdateSampleDialog}
sampleInfo={sampleInfo}
mutate={mutate}
rowId={rowId}
defaultValues={defaultValues}
setDefaultValues={setDefaultValues}
isUpdate={true}
azmayesh_id={azmayesh_id}
/>
</>
);
};
export default UpdateSample;
import { IconButton, Tooltip } from "@mui/material";
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_AZMAYESH_SAMPLE_FIELDS, GET_SAMPLE_LIST } from "@/core/utils/routes";
import CandUSampleOfAzmayesh from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Forms/CandUSampleOfAzmayesh";
import EditIcon from "@mui/icons-material/Edit";
const UpdateSample = ({ azmayeshTypeId, mutate, rowId, azmayesh_id }) => {
const requestServer = useRequest();
const [sampleInfo, setSampleInfo] = useState(null);
const [openUpdateSampleDialog, setOpenUpdateSampleDialog] = useState(false);
const [defaultValues, setDefaultValues] = useState({});
const [sampleDetail, setSampleDetail] = useState({});
const handleGetFields = () => {
requestServer(`${GET_AZMAYESH_SAMPLE_FIELDS}/${azmayeshTypeId}`, "get")
.then((response) => {
setSampleInfo(response.data.data);
})
.catch(() => {});
requestServer(`${GET_SAMPLE_LIST}/${rowId}`, "get")
.then((response) => {
setSampleDetail(JSON.parse(response.data.data.data));
})
.catch(() => {})
.finally(() => {
setOpenUpdateSampleDialog(true);
});
};
useEffect(() => {
setDefaultValues(sampleDetail);
}, [sampleDetail]);
return (
<>
<Tooltip title="ویرایش نمونه" arrow placement="right">
<IconButton
color="success"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetFields}
>
<EditIcon />
</IconButton>
</Tooltip>
<CandUSampleOfAzmayesh
openSampleDialog={openUpdateSampleDialog}
setOpenSampleDialog={setOpenUpdateSampleDialog}
sampleInfo={sampleInfo}
mutate={mutate}
rowId={rowId}
defaultValues={defaultValues}
setDefaultValues={setDefaultValues}
isUpdate={true}
azmayesh_id={azmayesh_id}
/>
</>
);
};
export default UpdateSample;

36
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/RowActions/index.jsx
View File

@@ -1,18 +1,18 @@
import { Box } from "@mui/material";
import DeleteSample from "./DeleteSample";
import UpdateSample from "./UpdateSample";
const RowActions = ({ rowData, row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<UpdateSample
mutate={mutate}
rowId={row.getValue("id")}
azmayeshTypeId={rowData.azmayesh_type_id}
azmayesh_id={rowData.id}
/>
<DeleteSample mutate={mutate} rowId={row.getValue("id")} />
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import DeleteSample from "./DeleteSample";
import UpdateSample from "./UpdateSample";
const RowActions = ({ rowData, row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<UpdateSample
mutate={mutate}
rowId={row.getValue("id")}
azmayeshTypeId={rowData.azmayesh_type_id}
azmayesh_id={rowData.id}
/>
<DeleteSample mutate={mutate} rowId={row.getValue("id")} />
</Box>
);
};
export default RowActions;

160
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/ShowSampleList.jsx
View File

@@ -1,80 +1,80 @@
import { useMemo } from "react";
import { Box, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_SAMPLE_LIST } from "@/core/utils/routes";
import RowActions from "./RowActions";
import AzmayeshInfo from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/AzmayeshInfo";
import Toolbar from "./Toolbar";
import moment from "jalali-moment";
const ShowSampleList = ({ sampleInfo, rowData }) => {
const parsedData = (data) => {
return data.data.map((item) => ({
...JSON.parse(item.data),
id: item.id,
updated_at: item.updated_at,
}));
};
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: false,
datatype: "text",
grow: false,
size: 100,
},
...sampleInfo.map((item) => ({
accessorKey: item.id.toString(),
header: item.unit ? `${item.name} (${item.unit})` : item.name,
id: item.id.toString(),
enableColumnFilter: false,
datatype: "text",
})),
{
accessorKey: "updated_at",
header: "تاریخ بروزرسانی",
id: "updated_at",
enableColumnFilter: false,
datatype: "date",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("HH:mm | YYYY/MM/DD") : "-"}
</Typography>
),
},
],
[sampleInfo]
);
const ToolbarWithRowData = (props) => <Toolbar rowData={rowData} {...props} />;
const RowActionsWithRowData = (props) => <RowActions rowData={rowData} {...props} />;
return (
<Box>
<AzmayeshInfo rowData={rowData} />
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
table_title={"نمونه های ثبت شده"}
need_filter={false}
columns={columns}
table_url={`${GET_SAMPLE_LIST}/index/${rowData.id}`}
page_name={`azmayesh_${rowData.azmayesh_type_id}`}
table_name={"sample_list"}
TableToolbar={ToolbarWithRowData}
specific_data={parsedData}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActionsWithRowData}
/>
</Box>
</Box>
);
};
export default ShowSampleList;
import { useMemo } from "react";
import { Box, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_SAMPLE_LIST } from "@/core/utils/routes";
import RowActions from "./RowActions";
import AzmayeshInfo from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/AzmayeshInfo";
import Toolbar from "./Toolbar";
import moment from "jalali-moment";
const ShowSampleList = ({ sampleInfo, rowData }) => {
const parsedData = (data) => {
return data.data.map((item) => ({
...JSON.parse(item.data),
id: item.id,
updated_at: item.updated_at,
}));
};
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: false,
datatype: "text",
grow: false,
size: 100,
},
...sampleInfo.map((item) => ({
accessorKey: item.id.toString(),
header: item.unit ? `${item.name} (${item.unit})` : item.name,
id: item.id.toString(),
enableColumnFilter: false,
datatype: "text",
})),
{
accessorKey: "updated_at",
header: "تاریخ بروزرسانی",
id: "updated_at",
enableColumnFilter: false,
datatype: "date",
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("HH:mm | YYYY/MM/DD") : "-"}
</Typography>
),
},
],
[sampleInfo]
);
const ToolbarWithRowData = (props) => <Toolbar rowData={rowData} {...props} />;
const RowActionsWithRowData = (props) => <RowActions rowData={rowData} {...props} />;
return (
<Box>
<AzmayeshInfo rowData={rowData} />
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
table_title={"نمونه های ثبت شده"}
need_filter={false}
columns={columns}
table_url={`${GET_SAMPLE_LIST}/index/${rowData.id}`}
page_name={`azmayesh_${rowData.azmayesh_type_id}`}
table_name={"sample_list"}
TableToolbar={ToolbarWithRowData}
specific_data={parsedData}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActionsWithRowData}
/>
</Box>
</Box>
);
};
export default ShowSampleList;

20
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/Toolbar.jsx
View File

@@ -1,10 +1,10 @@
import AddSampleToAzmayesh from "./Actions/Create";
const Toolbar = ({ mutate, rowData }) => {
return (
<>
<AddSampleToAzmayesh mutate={mutate} azmayeshTypeId={rowData.azmayesh_type_id} rowId={rowData.id} />
</>
);
};
export default Toolbar;
import AddSampleToAzmayesh from "./Actions/Create";
const Toolbar = ({ mutate, rowData }) => {
return (
<>
<AddSampleToAzmayesh mutate={mutate} azmayeshTypeId={rowData.azmayesh_type_id} rowId={rowData.id} />
</>
);
};
export default Toolbar;

92
src/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh/index.jsx
View File

@@ -1,46 +1,46 @@
import { Box, Button, Dialog, DialogActions, DialogContent, IconButton, Tooltip } from "@mui/material";
import AssignmentIcon from "@mui/icons-material/Assignment";
import { useState } from "react";
import ShowSampleList from "./ShowSampleList";
import { GET_AZMAYESH_SAMPLE_FIELDS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
const ShowSampleOfAzmayesh = ({ rowData }) => {
const requestServer = useRequest();
const [openShowSampleDialog, setOpenShowSampleDialog] = useState(false);
const [sampleInfo, setSampleInfo] = useState(null);
const handleGetSampleFields = () => {
requestServer(`${GET_AZMAYESH_SAMPLE_FIELDS}/${rowData.azmayesh_type_id}`, "get")
.then((response) => {
setSampleInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setOpenShowSampleDialog(true);
});
};
return (
<Box sx={{ display: "flex", justifyContent: "center" }}>
<Tooltip title="نمایش نمونه های آزمایش" arrow placement="right">
<IconButton
color="primary"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetSampleFields}
>
<AssignmentIcon />
</IconButton>
</Tooltip>
<Dialog maxWidth="lg" fullWidth open={openShowSampleDialog}>
<DialogContent>
<ShowSampleList rowData={rowData} sampleInfo={sampleInfo} />
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenShowSampleDialog(false)} variant="outlined" color="error">
بستن
</Button>
</DialogActions>
</Dialog>
</Box>
);
};
export default ShowSampleOfAzmayesh;
import { Box, Button, Dialog, DialogActions, DialogContent, IconButton, Tooltip } from "@mui/material";
import AssignmentIcon from "@mui/icons-material/Assignment";
import { useState } from "react";
import ShowSampleList from "./ShowSampleList";
import { GET_AZMAYESH_SAMPLE_FIELDS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
const ShowSampleOfAzmayesh = ({ rowData }) => {
const requestServer = useRequest();
const [openShowSampleDialog, setOpenShowSampleDialog] = useState(false);
const [sampleInfo, setSampleInfo] = useState(null);
const handleGetSampleFields = () => {
requestServer(`${GET_AZMAYESH_SAMPLE_FIELDS}/${rowData.azmayesh_type_id}`, "get")
.then((response) => {
setSampleInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setOpenShowSampleDialog(true);
});
};
return (
<Box sx={{ display: "flex", justifyContent: "center" }}>
<Tooltip title="نمایش نمونه های آزمایش" arrow placement="right">
<IconButton
color="primary"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetSampleFields}
>
<AssignmentIcon />
</IconButton>
</Tooltip>
<Dialog maxWidth="lg" fullWidth open={openShowSampleDialog}>
<DialogContent>
<ShowSampleList rowData={rowData} sampleInfo={sampleInfo} />
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenShowSampleDialog(false)} variant="outlined" color="error">
بستن
</Button>
</DialogActions>
</Dialog>
</Box>
);
};
export default ShowSampleOfAzmayesh;

28
src/components/dashboard/azmayesh/RowActions/index.jsx
View File

@@ -1,14 +1,14 @@
import { Box } from "@mui/material";
import DeleteAzmayesh from "./DeleteAzmayesh";
import ShowSampleOfAzmayesh from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh";
import AzmayeshUpdate from "@/components/dashboard/azmayesh/RowActions/AzmayeshUpdate";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<AzmayeshUpdate mutate={mutate} rowId={row.getValue("id")} />
<DeleteAzmayesh mutate={mutate} rowId={row.getValue("id")} />
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import DeleteAzmayesh from "./DeleteAzmayesh";
import ShowSampleOfAzmayesh from "@/components/dashboard/azmayesh/RowActions/ShowSampleOfAzmayesh";
import AzmayeshUpdate from "@/components/dashboard/azmayesh/RowActions/AzmayeshUpdate";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<AzmayeshUpdate mutate={mutate} rowId={row.getValue("id")} />
<DeleteAzmayesh mutate={mutate} rowId={row.getValue("id")} />
</Box>
);
};
export default RowActions;

104
src/components/dashboard/azmayesh/ShowLocation/index.jsx
View File

@@ -1,52 +1,52 @@
"use client";
import ExploreIcon from "@mui/icons-material/Explore";
import { Box, Button, Dialog, DialogActions, DialogContent, IconButton } from "@mui/material";
import { useState } from "react";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
import ShowLocationMarker from "@/core/components/ShowLocationMarker";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const ShowLocation = ({ lat, lng }) => {
const [openShowLocationModal, setOpenShowLocationModal] = useState(false);
const handleOpenShowLocationModal = () => {
setOpenShowLocationModal(true);
};
const handleCloseShowLocationModal = () => {
setOpenShowLocationModal(false);
};
return (
<Box sx={{ display: "flex", justifyContent: "center" }}>
<IconButton onClick={handleOpenShowLocationModal} size="small" color="primary">
<ExploreIcon />
</IconButton>
<Dialog
open={openShowLocationModal}
onClose={handleCloseShowLocationModal}
aria-labelledby="responsive-dialog-title"
>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={lat} start_lng={lng} />
</MapLayer>
</Box>
</DialogContent>
<DialogActions>
<Button color="error" variant="outlined" onClick={handleCloseShowLocationModal}>
بستن
</Button>
</DialogActions>
</Dialog>
</Box>
);
};
export default ShowLocation;
"use client";
import ExploreIcon from "@mui/icons-material/Explore";
import { Box, Button, Dialog, DialogActions, DialogContent, IconButton } from "@mui/material";
import { useState } from "react";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
import ShowLocationMarker from "@/core/components/ShowLocationMarker";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const ShowLocation = ({ lat, lng }) => {
const [openShowLocationModal, setOpenShowLocationModal] = useState(false);
const handleOpenShowLocationModal = () => {
setOpenShowLocationModal(true);
};
const handleCloseShowLocationModal = () => {
setOpenShowLocationModal(false);
};
return (
<Box sx={{ display: "flex", justifyContent: "center" }}>
<IconButton onClick={handleOpenShowLocationModal} size="small" color="primary">
<ExploreIcon />
</IconButton>
<Dialog
open={openShowLocationModal}
onClose={handleCloseShowLocationModal}
aria-labelledby="responsive-dialog-title"
>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={lat} start_lng={lng} />
</MapLayer>
</Box>
</DialogContent>
<DialogActions>
<Button color="error" variant="outlined" onClick={handleCloseShowLocationModal}>
بستن
</Button>
</DialogActions>
</Dialog>
</Box>
);
};
export default ShowLocation;

20
src/components/dashboard/azmayesh/Toolbar.jsx
View File

@@ -1,10 +1,10 @@
import AzmayeshCreate from "./Actions/Create";
const Toolbar = ({ mutate }) => {
return (
<>
<AzmayeshCreate mutate={mutate} />
</>
);
};
export default Toolbar;
import AzmayeshCreate from "./Actions/Create";
const Toolbar = ({ mutate }) => {
return (
<>
<AzmayeshCreate mutate={mutate} />
</>
);
};
export default Toolbar;

30
src/components/dashboard/azmayesh/index.jsx
View File

@@ -1,15 +1,15 @@
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import AzmayeshList from "./AzmayeshList";
const AzmayeshPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"کارتابل آزمایشات (OPTS)"} />
<AzmayeshList />
</Stack>
);
};
export default AzmayeshPage;
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import AzmayeshList from "./AzmayeshList";
const AzmayeshPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"کارتابل آزمایشات (OPTS)"} />
<AzmayeshList />
</Stack>
);
};
export default AzmayeshPage;

66
src/components/dashboard/azmayeshType/Actions/Create/index.jsx
View File

@@ -1,33 +1,33 @@
"use client";
import { Button, IconButton, useMediaQuery } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import { AddCircle } from "@mui/icons-material";
import CandUAzmayeshType from "@/components/dashboard/azmayeshType/Forms/CandUAzmayeshType";
const AzmayeshTypeCreate = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت نوع آزمایش جدید" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button variant="contained" color="primary" startIcon={<AddCircle />} onClick={handleOpen}>
ثبت نوع آزمایش
</Button>
)}
{open && <CandUAzmayeshType open={open} setOpen={setOpen} mutate={mutate} />}
</>
);
};
export default AzmayeshTypeCreate;
"use client";
import { Button, IconButton, useMediaQuery } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import { AddCircle } from "@mui/icons-material";
import CandUAzmayeshType from "@/components/dashboard/azmayeshType/Forms/CandUAzmayeshType";
const AzmayeshTypeCreate = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت نوع آزمایش جدید" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button variant="contained" color="primary" startIcon={<AddCircle />} onClick={handleOpen}>
ثبت نوع آزمایش
</Button>
)}
{open && <CandUAzmayeshType open={open} setOpen={setOpen} mutate={mutate} />}
</>
);
};
export default AzmayeshTypeCreate;

130
src/components/dashboard/azmayeshType/AzmayeshTypeList.jsx
View File

@@ -1,65 +1,65 @@
"use client";
import { useMemo } from "react";
import { Box, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import { GET_AZMAYESH_TYPE_LIST_TABLE } from "@/core/utils/routes";
import moment from "jalali-moment";
import RowActions from "./RowActions";
const AzmayeshTypeList = () => {
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "name",
header: "عنوان",
id: "name",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "updated_at",
header: "تاریخ بروزرسانی",
id: "updated_at",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("HH:mm | YYYY/MM/DD") : "-"}
</Typography>
),
},
],
[]
);
return (
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
table_title={"لیست انواع آزمایشات"}
need_filter={false}
columns={columns}
sorting={[{ id: "id", desc: true }]}
table_url={GET_AZMAYESH_TYPE_LIST_TABLE}
page_name={"azmayeshType"}
table_name={"azmayeshTypeList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActions}
/>
</Box>
);
};
export default AzmayeshTypeList;
"use client";
import { useMemo } from "react";
import { Box, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import { GET_AZMAYESH_TYPE_LIST_TABLE } from "@/core/utils/routes";
import moment from "jalali-moment";
import RowActions from "./RowActions";
const AzmayeshTypeList = () => {
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "name",
header: "عنوان",
id: "name",
enableColumnFilter: false,
datatype: "text",
filterMode: "notEquals",
},
{
accessorKey: "updated_at",
header: "تاریخ بروزرسانی",
id: "updated_at",
enableColumnFilter: false,
datatype: "date",
filterMode: "equals",
Cell: ({ renderedCellValue }) => (
<Typography variant="body2">
{renderedCellValue ? moment(renderedCellValue).locale("fa").format("HH:mm | YYYY/MM/DD") : "-"}
</Typography>
),
},
],
[]
);
return (
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
table_title={"لیست انواع آزمایشات"}
need_filter={false}
columns={columns}
sorting={[{ id: "id", desc: true }]}
table_url={GET_AZMAYESH_TYPE_LIST_TABLE}
page_name={"azmayeshType"}
table_name={"azmayeshTypeList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActions}
/>
</Box>
);
};
export default AzmayeshTypeList;

362
src/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/AzmayeshFields.jsx
View File

@@ -1,181 +1,181 @@
"use client";
import React, { useEffect, useState } from "react";
import {
Button,
Chip,
FormControl,
FormHelperText,
Grid,
InputAdornment,
InputLabel,
MenuItem,
OutlinedInput,
Select,
Typography,
} from "@mui/material";
import ExtensionIcon from "@mui/icons-material/Extension";
import SelectItemBox from "@/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/SelectItemBox";
import KeyboardIcon from "@mui/icons-material/Keyboard";
import TextFieldsIcon from "@mui/icons-material/TextFields";
import ViewListIcon from "@mui/icons-material/ViewList";
import CalendarMonthIcon from "@mui/icons-material/CalendarMonth";
const fieldTypeList = [
{ value: "input", label: "متن", icon: <TextFieldsIcon /> },
{ value: "select", label: "انتخابی", icon: <ViewListIcon /> },
{ value: "date", label: "تاریخ", icon: <CalendarMonthIcon /> },
];
const AzmayeshFields = ({ errors, selectedListItem, register, setValue, fields, watch }) => {
const watchedFields = watch("fields");
const [isSelectType, setIsSelectType] = useState(false);
const [openSelectItem, setOpenSelectItem] = useState(false);
const [typeIcon, setTypeIcon] = useState(<KeyboardIcon />);
useEffect(() => {
const selectedIcon = fieldTypeList.find((option) => option.value === watchedFields?.[selectedListItem]?.type)
?.icon || <KeyboardIcon />;
setTypeIcon(selectedIcon);
setIsSelectType(watchedFields[selectedListItem]?.type === "select");
}, [watchedFields, selectedListItem]);
return (
<Grid container>
<Grid xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 }, py: 1 }}>
<FormControl
error={!!errors.fields?.[selectedListItem]?.type}
size="small"
fullWidth
variant="outlined"
>
<InputLabel htmlFor={`fields.${selectedListItem}.type`}>نوع</InputLabel>
<Select
id={`fields.${selectedListItem}.type`}
label="نوع"
autoComplete="off"
{...register(`fields.${selectedListItem}.type`)}
size="small"
fullWidth
value={watchedFields?.[selectedListItem]?.type || ""}
onChange={(event) => {
const selectedValue = event.target.value;
const selectedIcon = fieldTypeList.find((option) => option.value === selectedValue)
?.icon || <KeyboardIcon />;
setValue(`fields.${selectedListItem}.type`, selectedValue);
setIsSelectType(selectedValue === "select");
setTypeIcon(selectedIcon);
}}
startAdornment={<InputAdornment position="start">{typeIcon}</InputAdornment>}
>
<MenuItem value="">نوع</MenuItem>
{fieldTypeList.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</Select>
<FormHelperText>{errors.fields?.[selectedListItem]?.type?.message}</FormHelperText>
</FormControl>
</Grid>
{isSelectType && (
<Grid
xs={12}
sm={6}
sx={{
px: { xs: 0, sm: 1 },
py: 1,
mb: 0.5,
display: "flex",
flexDirection: "column",
alignItems: "start",
justifyContent: "space-around",
position: "relative",
}}
>
<Chip
sx={{
position: "absolute",
top: "-6px",
right: "-6px",
zIndex: "1",
}}
color="error"
label={watchedFields?.[selectedListItem].options.length}
/>
<Button
variant="outlined"
color="success"
sx={{ width: "100%", height: "37px" }}
startIcon={<ExtensionIcon />}
onClick={() => setOpenSelectItem(true)}
>
افزودن آیتم نوع انتخابی
</Button>
<Typography variant="caption" color="error">
{errors.fields?.[selectedListItem]?.options?.message}
</Typography>
{openSelectItem && (
<SelectItemBox
open={openSelectItem}
setOpen={setOpenSelectItem}
fields={fields}
setValue={setValue}
index={selectedListItem}
watch={watch}
/>
)}
</Grid>
)}
<Grid xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 }, py: 1 }}>
<FormControl
error={!!errors.fields?.[selectedListItem]?.name}
size="small"
fullWidth
variant="outlined"
>
<InputLabel htmlFor={`fields[${selectedListItem}].name`}>نام فیلد</InputLabel>
<OutlinedInput
id={`fields[${selectedListItem}].name`}
label="نام فیلد"
autoComplete="off"
{...register(`fields[${selectedListItem}].name`)}
value={watchedFields?.[selectedListItem]?.name || ""}
onInput={(event) => setValue(`fields.${selectedListItem}.name`, event.target.value)}
size="small"
fullWidth
type="text"
/>
<FormHelperText>
{errors.fields?.[selectedListItem]?.name ? errors.fields[selectedListItem].name.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 }, py: 1 }}>
<FormControl
error={!!errors.fields?.[selectedListItem]?.unit}
size="small"
fullWidth
variant="outlined"
>
<InputLabel htmlFor={`fields[${selectedListItem}].unit`}>واحد اندازه گیری</InputLabel>
<OutlinedInput
id={`fields[${selectedListItem}].unit`}
label="واحد اندازه گیری"
autoComplete="off"
{...register(`fields[${selectedListItem}].unit`)}
value={watchedFields?.[selectedListItem]?.unit || ""}
onChange={(event) => setValue(`fields.${selectedListItem}.unit`, event.target.value)}
size="small"
fullWidth
type="text"
/>
<FormHelperText>
{errors.fields?.[selectedListItem]?.unit ? errors.fields[selectedListItem].unit.message : null}
</FormHelperText>
</FormControl>
</Grid>
</Grid>
);
};
export default AzmayeshFields;
"use client";
import React, { useEffect, useState } from "react";
import {
Button,
Chip,
FormControl,
FormHelperText,
Grid,
InputAdornment,
InputLabel,
MenuItem,
OutlinedInput,
Select,
Typography,
} from "@mui/material";
import ExtensionIcon from "@mui/icons-material/Extension";
import SelectItemBox from "@/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/SelectItemBox";
import KeyboardIcon from "@mui/icons-material/Keyboard";
import TextFieldsIcon from "@mui/icons-material/TextFields";
import ViewListIcon from "@mui/icons-material/ViewList";
import CalendarMonthIcon from "@mui/icons-material/CalendarMonth";
const fieldTypeList = [
{ value: "input", label: "متن", icon: <TextFieldsIcon /> },
{ value: "select", label: "انتخابی", icon: <ViewListIcon /> },
{ value: "date", label: "تاریخ", icon: <CalendarMonthIcon /> },
];
const AzmayeshFields = ({ errors, selectedListItem, register, setValue, fields, watch }) => {
const watchedFields = watch("fields");
const [isSelectType, setIsSelectType] = useState(false);
const [openSelectItem, setOpenSelectItem] = useState(false);
const [typeIcon, setTypeIcon] = useState(<KeyboardIcon />);
useEffect(() => {
const selectedIcon = fieldTypeList.find((option) => option.value === watchedFields?.[selectedListItem]?.type)
?.icon || <KeyboardIcon />;
setTypeIcon(selectedIcon);
setIsSelectType(watchedFields[selectedListItem]?.type === "select");
}, [watchedFields, selectedListItem]);
return (
<Grid container>
<Grid xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 }, py: 1 }}>
<FormControl
error={!!errors.fields?.[selectedListItem]?.type}
size="small"
fullWidth
variant="outlined"
>
<InputLabel htmlFor={`fields.${selectedListItem}.type`}>نوع</InputLabel>
<Select
id={`fields.${selectedListItem}.type`}
label="نوع"
autoComplete="off"
{...register(`fields.${selectedListItem}.type`)}
size="small"
fullWidth
value={watchedFields?.[selectedListItem]?.type || ""}
onChange={(event) => {
const selectedValue = event.target.value;
const selectedIcon = fieldTypeList.find((option) => option.value === selectedValue)
?.icon || <KeyboardIcon />;
setValue(`fields.${selectedListItem}.type`, selectedValue);
setIsSelectType(selectedValue === "select");
setTypeIcon(selectedIcon);
}}
startAdornment={<InputAdornment position="start">{typeIcon}</InputAdornment>}
>
<MenuItem value="">نوع</MenuItem>
{fieldTypeList.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</Select>
<FormHelperText>{errors.fields?.[selectedListItem]?.type?.message}</FormHelperText>
</FormControl>
</Grid>
{isSelectType && (
<Grid
xs={12}
sm={6}
sx={{
px: { xs: 0, sm: 1 },
py: 1,
mb: 0.5,
display: "flex",
flexDirection: "column",
alignItems: "start",
justifyContent: "space-around",
position: "relative",
}}
>
<Chip
sx={{
position: "absolute",
top: "-6px",
right: "-6px",
zIndex: "1",
}}
color="error"
label={watchedFields?.[selectedListItem].options.length}
/>
<Button
variant="outlined"
color="success"
sx={{ width: "100%", height: "37px" }}
startIcon={<ExtensionIcon />}
onClick={() => setOpenSelectItem(true)}
>
افزودن آیتم نوع انتخابی
</Button>
<Typography variant="caption" color="error">
{errors.fields?.[selectedListItem]?.options?.message}
</Typography>
{openSelectItem && (
<SelectItemBox
open={openSelectItem}
setOpen={setOpenSelectItem}
fields={fields}
setValue={setValue}
index={selectedListItem}
watch={watch}
/>
)}
</Grid>
)}
<Grid xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 }, py: 1 }}>
<FormControl
error={!!errors.fields?.[selectedListItem]?.name}
size="small"
fullWidth
variant="outlined"
>
<InputLabel htmlFor={`fields[${selectedListItem}].name`}>نام فیلد</InputLabel>
<OutlinedInput
id={`fields[${selectedListItem}].name`}
label="نام فیلد"
autoComplete="off"
{...register(`fields[${selectedListItem}].name`)}
value={watchedFields?.[selectedListItem]?.name || ""}
onInput={(event) => setValue(`fields.${selectedListItem}.name`, event.target.value)}
size="small"
fullWidth
type="text"
/>
<FormHelperText>
{errors.fields?.[selectedListItem]?.name ? errors.fields[selectedListItem].name.message : null}
</FormHelperText>
</FormControl>
</Grid>
<Grid xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 }, py: 1 }}>
<FormControl
error={!!errors.fields?.[selectedListItem]?.unit}
size="small"
fullWidth
variant="outlined"
>
<InputLabel htmlFor={`fields[${selectedListItem}].unit`}>واحد اندازه گیری</InputLabel>
<OutlinedInput
id={`fields[${selectedListItem}].unit`}
label="واحد اندازه گیری"
autoComplete="off"
{...register(`fields[${selectedListItem}].unit`)}
value={watchedFields?.[selectedListItem]?.unit || ""}
onChange={(event) => setValue(`fields.${selectedListItem}.unit`, event.target.value)}
size="small"
fullWidth
type="text"
/>
<FormHelperText>
{errors.fields?.[selectedListItem]?.unit ? errors.fields[selectedListItem].unit.message : null}
</FormHelperText>
</FormControl>
</Grid>
</Grid>
);
};
export default AzmayeshFields;

436
src/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/FormAndRequest.jsx
View File

@@ -1,218 +1,218 @@
import {
Box,
Button,
Chip,
DialogActions,
DialogContent,
Divider,
FormControl,
FormHelperText,
Grid,
InputLabel,
List,
OutlinedInput,
Typography,
} from "@mui/material";
import StyledForm from "@/core/components/StyledForm";
import useRequest from "@/lib/hooks/useRequest";
import { useState } from "react";
import { useFieldArray, useForm } from "react-hook-form";
import { array, object, string } from "yup";
import { yupResolver } from "@hookform/resolvers/yup";
import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
import ListItems from "./ListItems";
import AzmayeshFields from "./AzmayeshFields";
import { ADD_AZMAYESH_TYPE, UPDATE_AZMAYESH_TYPE } from "@/core/utils/routes";
const validationSchema = object({
name: string().required("عنوان نوع آزمایش را مشخص کنید!"),
fields: array()
.of(
object({
name: string().required("نام فیلد الزامی است"),
type: string().required("نوع فیلد الزامی است"),
options: array().when("type", {
is: "select",
then: (schema) => schema.min(1, "حداقل باید یک آیتم برای نوع انتخابی ایجاد کنید."),
otherwise: (schema) => schema.notRequired(),
}),
})
)
.min(1, "حداقل باید یک فیلد ایجاد نمایید."),
});
const FormAndRequest = ({ setOpen, mutate, rowId, updateInfo }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [selectedListItem, setSelectedListItem] = useState(null);
const handleClose = () => {
setOpen(false);
};
const defaultValues = {
name: updateInfo?.name || "",
fields: Array.isArray(updateInfo?.azmayesh_fields)
? updateInfo.azmayesh_fields.map((field) => ({
name: field.name || "",
type: field.type || "",
unit: field.unit || "",
options: field.option ? field.option : [],
}))
: [],
};
const {
control,
register,
handleSubmit,
setValue,
watch,
formState: { errors, isSubmitting },
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
const { fields, append, remove } = useFieldArray({
control,
name: "fields",
});
const handleRemove = (index) => {
remove(index);
if (selectedListItem === index) {
setSelectedListItem(null);
} else if (selectedListItem > index) {
setSelectedListItem((prev) => prev - 1);
}
};
const handleAddField = () => {
append({ name: "", type: "", unit: "", options: [] });
};
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("name", data.name);
data.fields.map((field, index) => {
formData.append(`fields[${index}][name]`, field.name);
if (field.unit !== "") formData.append(`fields[${index}][unit]`, field.unit);
formData.append(`fields[${index}][type]`, field.type);
if (field.options.length !== 0) formData.append(`fields[${index}][option]`, JSON.stringify(field.options));
});
try {
await requestServer(updateInfo ? `${UPDATE_AZMAYESH_TYPE}/${rowId}` : ADD_AZMAYESH_TYPE, "post", {
data: formData,
});
mutate();
handleClose();
} catch (error) {}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmit)}>
<DialogContent dividers>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "center", my: 2 }}>
<FormControl error={!!errors.name} size="small" variant="outlined" sx={{ width: "250px" }}>
<InputLabel htmlFor="name">عنوان نوع آزمایش</InputLabel>
<OutlinedInput
id="name"
label={"عنوان نوع آزمایش"}
autoComplete="off"
{...register("name")}
size="small"
type="text"
/>
<FormHelperText id="name">{errors.name ? errors.name.message : null}</FormHelperText>
</FormControl>
</Box>
<Grid container spacing={2} sx={{ justifyContent: "space-between" }}>
<Grid xs={12} md={4} lg={3} sx={{ px: 1 }}>
<Divider sx={{ my: 2 }}>
<Chip label="لیست فیلد ها" />
</Divider>
<Button
variant="contained"
color="success"
fullWidth
startIcon={<DataSaverOnIcon />}
sx={{ mb: 2 }}
onClick={handleAddField}
>
ایجاد فیلد جدید
</Button>
<List
sx={{
border: "1px dashed #e1e1e1",
borderRadius: "5px",
p: 1,
maxHeight: "300px",
overflowY: "auto",
}}
>
{fields.length !== 0 ? (
fields.map((item, index) => (
<ListItems
key={index}
index={index}
selectedListItem={selectedListItem}
fields={fields}
handleRemove={handleRemove}
setSelectedListItem={setSelectedListItem}
watch={watch}
/>
))
) : (
<Typography
variant="h6"
sx={{ color: "#a2a2a2", textAlign: "center", letterSpacing: "1px" }}
>
فیلدی وجود ندارد
</Typography>
)}
</List>
<Typography variant="caption" color="error">
{errors.fields ? errors.fields.message : null}
</Typography>
</Grid>
<Divider orientation="vertical" variant="middle" flexItem />
<Grid xs={12} md={7} lg={8} sx={{ pl: 2 }}>
<Divider sx={{ my: 2 }}>
<Chip label="اطلاعات فیلد" />
</Divider>
{selectedListItem !== null ? (
<AzmayeshFields
errors={errors}
selectedListItem={selectedListItem}
register={register}
setValue={setValue}
fields={fields}
watch={watch}
/>
) : (
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "center", py: 2 }}>
<Typography variant="h6" sx={{ letterSpacing: "2px", color: "#a2a2a2" }}>
از بخش لیست فیلد ها یک آیتم را انتخاب نمایید
</Typography>
</Box>
)}
</Grid>
</Grid>
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center", py: 2 }}>
<Button variant="outlined" color="error" onClick={handleClose}>
بستن
</Button>
<Button
type={"submit"}
variant="contained"
color="primary"
disabled={isSubmitting}
sx={{ width: "200px" }}
>
{isSubmitting ? "در حال ثبت..." : "ثبت نوع آزمایش"}
</Button>
</DialogActions>
</StyledForm>
);
};
export default FormAndRequest;
import {
Box,
Button,
Chip,
DialogActions,
DialogContent,
Divider,
FormControl,
FormHelperText,
Grid,
InputLabel,
List,
OutlinedInput,
Typography,
} from "@mui/material";
import StyledForm from "@/core/components/StyledForm";
import useRequest from "@/lib/hooks/useRequest";
import { useState } from "react";
import { useFieldArray, useForm } from "react-hook-form";
import { array, object, string } from "yup";
import { yupResolver } from "@hookform/resolvers/yup";
import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
import ListItems from "./ListItems";
import AzmayeshFields from "./AzmayeshFields";
import { ADD_AZMAYESH_TYPE, UPDATE_AZMAYESH_TYPE } from "@/core/utils/routes";
const validationSchema = object({
name: string().required("عنوان نوع آزمایش را مشخص کنید!"),
fields: array()
.of(
object({
name: string().required("نام فیلد الزامی است"),
type: string().required("نوع فیلد الزامی است"),
options: array().when("type", {
is: "select",
then: (schema) => schema.min(1, "حداقل باید یک آیتم برای نوع انتخابی ایجاد کنید."),
otherwise: (schema) => schema.notRequired(),
}),
})
)
.min(1, "حداقل باید یک فیلد ایجاد نمایید."),
});
const FormAndRequest = ({ setOpen, mutate, rowId, updateInfo }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [selectedListItem, setSelectedListItem] = useState(null);
const handleClose = () => {
setOpen(false);
};
const defaultValues = {
name: updateInfo?.name || "",
fields: Array.isArray(updateInfo?.azmayesh_fields)
? updateInfo.azmayesh_fields.map((field) => ({
name: field.name || "",
type: field.type || "",
unit: field.unit || "",
options: field.option ? field.option : [],
}))
: [],
};
const {
control,
register,
handleSubmit,
setValue,
watch,
formState: { errors, isSubmitting },
} = useForm({ defaultValues, resolver: yupResolver(validationSchema), mode: "all" });
const { fields, append, remove } = useFieldArray({
control,
name: "fields",
});
const handleRemove = (index) => {
remove(index);
if (selectedListItem === index) {
setSelectedListItem(null);
} else if (selectedListItem > index) {
setSelectedListItem((prev) => prev - 1);
}
};
const handleAddField = () => {
append({ name: "", type: "", unit: "", options: [] });
};
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("name", data.name);
data.fields.map((field, index) => {
formData.append(`fields[${index}][name]`, field.name);
if (field.unit !== "") formData.append(`fields[${index}][unit]`, field.unit);
formData.append(`fields[${index}][type]`, field.type);
if (field.options.length !== 0) formData.append(`fields[${index}][option]`, JSON.stringify(field.options));
});
try {
await requestServer(updateInfo ? `${UPDATE_AZMAYESH_TYPE}/${rowId}` : ADD_AZMAYESH_TYPE, "post", {
data: formData,
});
mutate();
handleClose();
} catch (error) {}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmit)}>
<DialogContent dividers>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "center", my: 2 }}>
<FormControl error={!!errors.name} size="small" variant="outlined" sx={{ width: "250px" }}>
<InputLabel htmlFor="name">عنوان نوع آزمایش</InputLabel>
<OutlinedInput
id="name"
label={"عنوان نوع آزمایش"}
autoComplete="off"
{...register("name")}
size="small"
type="text"
/>
<FormHelperText id="name">{errors.name ? errors.name.message : null}</FormHelperText>
</FormControl>
</Box>
<Grid container spacing={2} sx={{ justifyContent: "space-between" }}>
<Grid xs={12} md={4} lg={3} sx={{ px: 1 }}>
<Divider sx={{ my: 2 }}>
<Chip label="لیست فیلد ها" />
</Divider>
<Button
variant="contained"
color="success"
fullWidth
startIcon={<DataSaverOnIcon />}
sx={{ mb: 2 }}
onClick={handleAddField}
>
ایجاد فیلد جدید
</Button>
<List
sx={{
border: "1px dashed #e1e1e1",
borderRadius: "5px",
p: 1,
maxHeight: "300px",
overflowY: "auto",
}}
>
{fields.length !== 0 ? (
fields.map((item, index) => (
<ListItems
key={index}
index={index}
selectedListItem={selectedListItem}
fields={fields}
handleRemove={handleRemove}
setSelectedListItem={setSelectedListItem}
watch={watch}
/>
))
) : (
<Typography
variant="h6"
sx={{ color: "#a2a2a2", textAlign: "center", letterSpacing: "1px" }}
>
فیلدی وجود ندارد
</Typography>
)}
</List>
<Typography variant="caption" color="error">
{errors.fields ? errors.fields.message : null}
</Typography>
</Grid>
<Divider orientation="vertical" variant="middle" flexItem />
<Grid xs={12} md={7} lg={8} sx={{ pl: 2 }}>
<Divider sx={{ my: 2 }}>
<Chip label="اطلاعات فیلد" />
</Divider>
{selectedListItem !== null ? (
<AzmayeshFields
errors={errors}
selectedListItem={selectedListItem}
register={register}
setValue={setValue}
fields={fields}
watch={watch}
/>
) : (
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "center", py: 2 }}>
<Typography variant="h6" sx={{ letterSpacing: "2px", color: "#a2a2a2" }}>
از بخش لیست فیلد ها یک آیتم را انتخاب نمایید
</Typography>
</Box>
)}
</Grid>
</Grid>
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center", py: 2 }}>
<Button variant="outlined" color="error" onClick={handleClose}>
بستن
</Button>
<Button
type={"submit"}
variant="contained"
color="primary"
disabled={isSubmitting}
sx={{ width: "200px" }}
>
{isSubmitting ? "در حال ثبت..." : "ثبت نوع آزمایش"}
</Button>
</DialogActions>
</StyledForm>
);
};
export default FormAndRequest;

154
src/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/ListItems.jsx
View File

@@ -1,77 +1,77 @@
"use client";
import { Box, IconButton, ListItem, Stack, Typography } from "@mui/material";
import React from "react";
import DeleteIcon from "@mui/icons-material/Delete";
import SettingsIcon from "@mui/icons-material/Settings";
import TextFieldsIcon from "@mui/icons-material/TextFields";
import ViewListIcon from "@mui/icons-material/ViewList";
import CalendarMonthIcon from "@mui/icons-material/CalendarMonth";
const fieldsType = {
input: "متن",
date: "تاریخ",
select: "انتخابی",
};
const fieldsTypeIcon = {
input: <TextFieldsIcon sx={{ fontSize: "18px" }} />,
date: <CalendarMonthIcon sx={{ fontSize: "18px" }} />,
select: <ViewListIcon sx={{ fontSize: "18px" }} />,
};
const ListItems = ({ index, handleRemove, selectedListItem, setSelectedListItem, watch }) => {
const watchedFields = watch("fields");
return (
<ListItem
sx={{
transition: "all 0.3s",
boxShadow:
selectedListItem === index
? "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px"
: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
borderRadius: 2,
mb: 1.5,
px: 1,
py: 0.7,
backgroundColor: selectedListItem === index ? "#6ea1714d" : "#ebebeb7a",
"&:last-child": {
mb: 0,
},
}}
disablePadding
secondaryAction={
<Box sx={{ display: "flex", alignItems: "center" }}>
<IconButton
edge="start"
aria-label="edit"
color="primary"
onClick={() => setSelectedListItem(index)}
>
<SettingsIcon />
</IconButton>
<IconButton edge="end" aria-label="delete" color="error" onClick={() => handleRemove(index)}>
<DeleteIcon />
</IconButton>
</Box>
}
>
<Stack sx={{ width: "100%" }}>
<Typography
sx={{ color: watchedFields[index].name !== "" ? "" : "error.main" }}
variant="body1"
fontWeight={500}
noWrap
>
{watchedFields[index].name !== "" ? watchedFields[index].name : "نام تعیین نشده"}
</Typography>
<Box sx={{ display: "flex", alignItems: "center", gap: 0.5 }}>
{fieldsTypeIcon[watchedFields[index].type] || null}
<Typography sx={{ color: watchedFields[index].type !== "" ? "" : "error.main" }} variant="caption">
{watchedFields[index].type !== "" ? fieldsType[watchedFields[index].type] : "واحد تعیین نشده"}
</Typography>
</Box>
</Stack>
</ListItem>
);
};
export default ListItems;
"use client";
import { Box, IconButton, ListItem, Stack, Typography } from "@mui/material";
import React from "react";
import DeleteIcon from "@mui/icons-material/Delete";
import SettingsIcon from "@mui/icons-material/Settings";
import TextFieldsIcon from "@mui/icons-material/TextFields";
import ViewListIcon from "@mui/icons-material/ViewList";
import CalendarMonthIcon from "@mui/icons-material/CalendarMonth";
const fieldsType = {
input: "متن",
date: "تاریخ",
select: "انتخابی",
};
const fieldsTypeIcon = {
input: <TextFieldsIcon sx={{ fontSize: "18px" }} />,
date: <CalendarMonthIcon sx={{ fontSize: "18px" }} />,
select: <ViewListIcon sx={{ fontSize: "18px" }} />,
};
const ListItems = ({ index, handleRemove, selectedListItem, setSelectedListItem, watch }) => {
const watchedFields = watch("fields");
return (
<ListItem
sx={{
transition: "all 0.3s",
boxShadow:
selectedListItem === index
? "rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px"
: "rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px",
borderRadius: 2,
mb: 1.5,
px: 1,
py: 0.7,
backgroundColor: selectedListItem === index ? "#6ea1714d" : "#ebebeb7a",
"&:last-child": {
mb: 0,
},
}}
disablePadding
secondaryAction={
<Box sx={{ display: "flex", alignItems: "center" }}>
<IconButton
edge="start"
aria-label="edit"
color="primary"
onClick={() => setSelectedListItem(index)}
>
<SettingsIcon />
</IconButton>
<IconButton edge="end" aria-label="delete" color="error" onClick={() => handleRemove(index)}>
<DeleteIcon />
</IconButton>
</Box>
}
>
<Stack sx={{ width: "100%" }}>
<Typography
sx={{ color: watchedFields[index].name !== "" ? "" : "error.main" }}
variant="body1"
fontWeight={500}
noWrap
>
{watchedFields[index].name !== "" ? watchedFields[index].name : "نام تعیین نشده"}
</Typography>
<Box sx={{ display: "flex", alignItems: "center", gap: 0.5 }}>
{fieldsTypeIcon[watchedFields[index].type] || null}
<Typography sx={{ color: watchedFields[index].type !== "" ? "" : "error.main" }} variant="caption">
{watchedFields[index].type !== "" ? fieldsType[watchedFields[index].type] : "واحد تعیین نشده"}
</Typography>
</Box>
</Stack>
</ListItem>
);
};
export default ListItems;

216
src/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/SelectItemBox.jsx
View File

@@ -1,108 +1,108 @@
import {
Box,
Button,
Chip,
Dialog,
DialogActions,
DialogContent,
Divider,
IconButton,
List,
ListItem,
ListItemText,
TextField,
Typography,
} from "@mui/material";
import DeleteIcon from "@mui/icons-material/Delete";
import React, { useState } from "react";
const SelectItemBox = ({ open, setOpen, setValue, index, watch }) => {
const watchedFields = watch("fields");
const [itemValue, setItemValue] = useState("");
const [listArr, setListArr] = useState(watchedFields?.[index]?.options);
const addToList = () => {
if (itemValue) {
setListArr([...listArr, itemValue]);
setItemValue("");
}
};
const removeFromList = (index) => {
setListArr(listArr.filter((_, i) => i !== index));
};
const saveAndCloseList = () => {
setValue(`fields.${index}.options`, listArr);
closeModal();
};
const closeModal = () => {
setOpen(false);
};
return (
<Dialog open={open} fullWidth={true} maxWidth={"xs"} onClose={closeModal}>
<DialogContent>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "center", gap: 2 }}>
<TextField
fullWidth
size="small"
id="outlined-controlled"
label="نام آیتم را وارد کنید"
value={itemValue}
onChange={(event) => {
setItemValue(event.target.value);
}}
/>
<Button variant="contained" color="primary" disabled={!itemValue} onClick={addToList}>
افزودن
</Button>
</Box>
<Box sx={{ borderRadius: "5px", mt: 2 }}>
<Divider>
<Chip label="لیست آیتم ها" />
</Divider>
<List>
{listArr.length !== 0 ? (
listArr.map((item, index) => (
<ListItem
key={index}
sx={{
boxShadow:
"rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
my: 1,
borderRadius: "5px",
}}
secondaryAction={
<IconButton
edge="end"
aria-label="delete"
color="error"
onClick={() => removeFromList(index)}
>
<DeleteIcon />
</IconButton>
}
>
<ListItemText primary={item} />
</ListItem>
))
) : (
<Typography variant="h6" sx={{ textAlign: "center", letterSpacing: "1px" }}>
هنوز آیتمی ثبت نشده است
</Typography>
)}
</List>
</Box>
</DialogContent>
<DialogActions>
<Button variant="outlined" color="primary" onClick={saveAndCloseList}>
ذخیره لیست
</Button>
</DialogActions>
</Dialog>
);
};
export default SelectItemBox;
import {
Box,
Button,
Chip,
Dialog,
DialogActions,
DialogContent,
Divider,
IconButton,
List,
ListItem,
ListItemText,
TextField,
Typography,
} from "@mui/material";
import DeleteIcon from "@mui/icons-material/Delete";
import React, { useState } from "react";
const SelectItemBox = ({ open, setOpen, setValue, index, watch }) => {
const watchedFields = watch("fields");
const [itemValue, setItemValue] = useState("");
const [listArr, setListArr] = useState(watchedFields?.[index]?.options);
const addToList = () => {
if (itemValue) {
setListArr([...listArr, itemValue]);
setItemValue("");
}
};
const removeFromList = (index) => {
setListArr(listArr.filter((_, i) => i !== index));
};
const saveAndCloseList = () => {
setValue(`fields.${index}.options`, listArr);
closeModal();
};
const closeModal = () => {
setOpen(false);
};
return (
<Dialog open={open} fullWidth={true} maxWidth={"xs"} onClose={closeModal}>
<DialogContent>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "center", gap: 2 }}>
<TextField
fullWidth
size="small"
id="outlined-controlled"
label="نام آیتم را وارد کنید"
value={itemValue}
onChange={(event) => {
setItemValue(event.target.value);
}}
/>
<Button variant="contained" color="primary" disabled={!itemValue} onClick={addToList}>
افزودن
</Button>
</Box>
<Box sx={{ borderRadius: "5px", mt: 2 }}>
<Divider>
<Chip label="لیست آیتم ها" />
</Divider>
<List>
{listArr.length !== 0 ? (
listArr.map((item, index) => (
<ListItem
key={index}
sx={{
boxShadow:
"rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px",
my: 1,
borderRadius: "5px",
}}
secondaryAction={
<IconButton
edge="end"
aria-label="delete"
color="error"
onClick={() => removeFromList(index)}
>
<DeleteIcon />
</IconButton>
}
>
<ListItemText primary={item} />
</ListItem>
))
) : (
<Typography variant="h6" sx={{ textAlign: "center", letterSpacing: "1px" }}>
هنوز آیتمی ثبت نشده است
</Typography>
)}
</List>
</Box>
</DialogContent>
<DialogActions>
<Button variant="outlined" color="primary" onClick={saveAndCloseList}>
ذخیره لیست
</Button>
</DialogActions>
</Dialog>
);
};
export default SelectItemBox;

74
src/components/dashboard/azmayeshType/Forms/CandUAzmayeshType/index.jsx
View File

@@ -1,37 +1,37 @@
import { Dialog, IconButton } from "@mui/material";
import FormAndRequest from "./FormAndRequest";
import DialogLoading from "@/core/components/DialogLoading";
import CloseIcon from "@mui/icons-material/Close";
const CandUAzmayeshType = ({ open, setOpen, mutate, rowId, updateInfo, loadingOpen, fromUpdate = false }) => {
const isUpdateReady = fromUpdate ? updateInfo !== null : true;
return (
<Dialog open={open} fullWidth maxWidth="lg">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{isUpdateReady ? (
<FormAndRequest
setOpen={setOpen}
mutate={mutate}
rowId={rowId}
{...(fromUpdate ? { updateInfo } : {})}
/>
) : (
<DialogLoading loadingOpen={loadingOpen} />
)}
</Dialog>
);
};
export default CandUAzmayeshType;
import { Dialog, IconButton } from "@mui/material";
import FormAndRequest from "./FormAndRequest";
import DialogLoading from "@/core/components/DialogLoading";
import CloseIcon from "@mui/icons-material/Close";
const CandUAzmayeshType = ({ open, setOpen, mutate, rowId, updateInfo, loadingOpen, fromUpdate = false }) => {
const isUpdateReady = fromUpdate ? updateInfo !== null : true;
return (
<Dialog open={open} fullWidth maxWidth="lg">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{isUpdateReady ? (
<FormAndRequest
setOpen={setOpen}
mutate={mutate}
rowId={rowId}
{...(fromUpdate ? { updateInfo } : {})}
/>
) : (
<DialogLoading loadingOpen={loadingOpen} />
)}
</Dialog>
);
};
export default CandUAzmayeshType;

156
src/components/dashboard/azmayeshType/RowActions/DeleteAzmayeshType/index.jsx
View File

@@ -1,78 +1,78 @@
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography,
} from "@mui/material";
import DeleteIcon from "@mui/icons-material/Delete";
import useRequest from "@/lib/hooks/useRequest";
import { useState } from "react";
import { DELETE_AZMAYESH_TYPE_LIST } from "@/core/utils/routes";
const DeleteAzmayeshType = ({ rowId, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
setIsSubmitting(true);
requestServer(`${DELETE_AZMAYESH_TYPE_LIST}/${rowId}`, "post")
.then(() => {
setOpenDeleteDialog(false);
mutate();
})
.catch(() => {})
.finally(() => {
setIsSubmitting(false);
});
};
return (
<>
<Tooltip title="حذف نوع آزمایش" arrow placement="right">
<IconButton
color="error"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="sm"
open={openDeleteDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<DialogTitle>حذف نوع آزمایش</DialogTitle>
<DialogContent>
<Typography>آیا از حذف این نوع آزمایش مطمئن هستید؟</Typography>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenDeleteDialog(false)}
variant="outlined"
color="primary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="error" disabled={isSubmitting}>
حذف
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteAzmayeshType;
import {
Button,
Dialog,
DialogActions,
DialogContent,
DialogTitle,
IconButton,
Tooltip,
Typography,
} from "@mui/material";
import DeleteIcon from "@mui/icons-material/Delete";
import useRequest from "@/lib/hooks/useRequest";
import { useState } from "react";
import { DELETE_AZMAYESH_TYPE_LIST } from "@/core/utils/routes";
const DeleteAzmayeshType = ({ rowId, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = () => {
setIsSubmitting(true);
requestServer(`${DELETE_AZMAYESH_TYPE_LIST}/${rowId}`, "post")
.then(() => {
setOpenDeleteDialog(false);
mutate();
})
.catch(() => {})
.finally(() => {
setIsSubmitting(false);
});
};
return (
<>
<Tooltip title="حذف نوع آزمایش" arrow placement="right">
<IconButton
color="error"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenDeleteDialog(true);
}}
>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="sm"
open={openDeleteDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<DialogTitle>حذف نوع آزمایش</DialogTitle>
<DialogContent>
<Typography>آیا از حذف این نوع آزمایش مطمئن هستید؟</Typography>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenDeleteDialog(false)}
variant="outlined"
color="primary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit} variant="contained" color="error" disabled={isSubmitting}>
حذف
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DeleteAzmayeshType;

106
src/components/dashboard/azmayeshType/RowActions/UpdateAzmayeshType/index.jsx
View File

@@ -1,53 +1,53 @@
import { IconButton, Tooltip } from "@mui/material";
import EditIcon from "@mui/icons-material/Edit";
import { GET_AZMAYESH_TYPE_LIST_TABLE } from "@/core/utils/routes";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import CandUAzmayeshType from "@/components/dashboard/azmayeshType/Forms/CandUAzmayeshType";
const UpdateAzmayeshType = ({ rowId, mutate }) => {
const requestServer = useRequest();
const [openUpdateDialog, setOpenUpdateDialog] = useState(false);
const [updateInfo, setUpdateInfo] = useState(null);
const [loadingOpen, setLoadingOpen] = useState(false);
const handleGetInfo = () => {
setLoadingOpen(true);
setOpenUpdateDialog(true);
requestServer(`${GET_AZMAYESH_TYPE_LIST_TABLE}/${rowId}`, "get")
.then((response) => {
setUpdateInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setLoadingOpen(false);
});
};
return (
<>
<Tooltip title="ویرایش آزمایش" arrow placement="right">
<IconButton
color="success"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetInfo}
>
<EditIcon />
</IconButton>
</Tooltip>
{openUpdateDialog && (
<CandUAzmayeshType
open={openUpdateDialog}
setOpen={setOpenUpdateDialog}
mutate={mutate}
updateInfo={updateInfo}
rowId={rowId}
loadingOpen={loadingOpen}
fromUpdate={true}
/>
)}
</>
);
};
export default UpdateAzmayeshType;
import { IconButton, Tooltip } from "@mui/material";
import EditIcon from "@mui/icons-material/Edit";
import { GET_AZMAYESH_TYPE_LIST_TABLE } from "@/core/utils/routes";
import { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import CandUAzmayeshType from "@/components/dashboard/azmayeshType/Forms/CandUAzmayeshType";
const UpdateAzmayeshType = ({ rowId, mutate }) => {
const requestServer = useRequest();
const [openUpdateDialog, setOpenUpdateDialog] = useState(false);
const [updateInfo, setUpdateInfo] = useState(null);
const [loadingOpen, setLoadingOpen] = useState(false);
const handleGetInfo = () => {
setLoadingOpen(true);
setOpenUpdateDialog(true);
requestServer(`${GET_AZMAYESH_TYPE_LIST_TABLE}/${rowId}`, "get")
.then((response) => {
setUpdateInfo(response.data.data);
})
.catch(() => {})
.finally(() => {
setLoadingOpen(false);
});
};
return (
<>
<Tooltip title="ویرایش آزمایش" arrow placement="right">
<IconButton
color="success"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={handleGetInfo}
>
<EditIcon />
</IconButton>
</Tooltip>
{openUpdateDialog && (
<CandUAzmayeshType
open={openUpdateDialog}
setOpen={setOpenUpdateDialog}
mutate={mutate}
updateInfo={updateInfo}
rowId={rowId}
loadingOpen={loadingOpen}
fromUpdate={true}
/>
)}
</>
);
};
export default UpdateAzmayeshType;

26
src/components/dashboard/azmayeshType/RowActions/index.jsx
View File

@@ -1,13 +1,13 @@
import { Box } from "@mui/material";
import UpdateAzmayeshType from "./UpdateAzmayeshType";
import DeleteAzmayeshType from "./DeleteAzmayeshType";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<UpdateAzmayeshType rowId={row.getValue("id")} mutate={mutate} />
<DeleteAzmayeshType rowId={row.getValue("id")} mutate={mutate} />
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import UpdateAzmayeshType from "./UpdateAzmayeshType";
import DeleteAzmayeshType from "./DeleteAzmayeshType";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<UpdateAzmayeshType rowId={row.getValue("id")} mutate={mutate} />
<DeleteAzmayeshType rowId={row.getValue("id")} mutate={mutate} />
</Box>
);
};
export default RowActions;

20
src/components/dashboard/azmayeshType/Toolbar.jsx
View File

@@ -1,10 +1,10 @@
import AzmayeshTypeCreate from "./Actions/Create";
const Toolbar = ({ mutate }) => {
return (
<>
<AzmayeshTypeCreate mutate={mutate} />
</>
);
};
export default Toolbar;
import AzmayeshTypeCreate from "./Actions/Create";
const Toolbar = ({ mutate }) => {
return (
<>
<AzmayeshTypeCreate mutate={mutate} />
</>
);
};
export default Toolbar;

30
src/components/dashboard/azmayeshType/index.jsx
View File

@@ -1,15 +1,15 @@
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import AzmayeshTypeList from "./AzmayeshTypeList";
const AzmayeshTypePage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"کارتابل نوع آزمایشات"} />
<AzmayeshTypeList />
</Stack>
);
};
export default AzmayeshTypePage;
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import AzmayeshTypeList from "./AzmayeshTypeList";
const AzmayeshTypePage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"کارتابل نوع آزمایشات"} />
<AzmayeshTypeList />
</Stack>
);
};
export default AzmayeshTypePage;

290
src/components/dashboard/damageItems/Actions/Create/Form/CreateFormContent.jsx
View File

@@ -1,145 +1,145 @@
import NumberField from "@/core/components/NumberField";
import StyledForm from "@/core/components/StyledForm";
import { CREATE_RECEIPT_DAMAGE_ITEMS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
import { Beenhere, ExitToApp } from "@mui/icons-material";
import { Button, DialogActions, DialogContent, DialogTitle, Stack, TextField } from "@mui/material";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
import { Controller, useForm } from "react-hook-form";
import { object, string } from "yup";
const validationSchema = object({
title: string().required("وارد کردن عنوان الزامیست!"),
unit: string().required("وارد کردن واحد الزامیست!"),
base_price: string().required("وارد کردن فی الزامیست!"),
});
const CreateFormContent = ({ setOpen, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const defaultValues = {
title: "",
unit: "",
base_price: null,
};
const {
control,
handleSubmit,
formState: { isSubmitting },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("title", data.title);
formData.append("unit", data.unit);
formData.append("base_price", data.base_price);
try {
await requestServer(CREATE_RECEIPT_DAMAGE_ITEMS, "post", {
data: formData,
});
mutate();
setOpen(false);
} catch (error) {}
};
return (
<>
<DialogHeader>
<DialogTitle>ثبت آیتم جدید</DialogTitle>
</DialogHeader>
<DialogContent dividers>
<StyledForm onSubmit={handleSubmit(onSubmit)} id="createDamageForm">
<Stack spacing={3}>
<Controller
name="title"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="عنوان"
value={value}
onChange={onChange}
placeholder="عنوان را وارد کنید"
error={!!error}
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="unit"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="واحد"
value={value}
onChange={onChange}
error={!!error}
placeholder="واحد را وارد کنید"
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="base_price"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<NumberField
label={`فی`}
error={!!error}
value={value || ""}
type="text"
size={"small"}
unit={"ریال"}
inputProps={{
placeholder: "فی را وارد کنید",
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
if (!isNaN(event.target.value)) {
onChange(event.target.value);
} else {
onChange(value);
}
}}
helperText={error ? error.message : null}
variant="outlined"
fullWidth
/>
)}
/>
</Stack>
</StyledForm>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpen(false)} variant="outlined" color="secondary" startIcon={<ExitToApp />}>
بستن
</Button>
<Button
variant="contained"
disabled={isSubmitting}
type={"submit"}
form="createDamageForm"
endIcon={<Beenhere />}
>
{isSubmitting ? "در حال ثبت آیتم" : "ثبت آیتم"}
</Button>
</DialogActions>
</>
);
};
export default CreateFormContent;
import NumberField from "@/core/components/NumberField";
import StyledForm from "@/core/components/StyledForm";
import { CREATE_RECEIPT_DAMAGE_ITEMS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
import { Beenhere, ExitToApp } from "@mui/icons-material";
import { Button, DialogActions, DialogContent, DialogTitle, Stack, TextField } from "@mui/material";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
import { Controller, useForm } from "react-hook-form";
import { object, string } from "yup";
const validationSchema = object({
title: string().required("وارد کردن عنوان الزامیست!"),
unit: string().required("وارد کردن واحد الزامیست!"),
base_price: string().required("وارد کردن فی الزامیست!"),
});
const CreateFormContent = ({ setOpen, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const defaultValues = {
title: "",
unit: "",
base_price: null,
};
const {
control,
handleSubmit,
formState: { isSubmitting },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("title", data.title);
formData.append("unit", data.unit);
formData.append("base_price", data.base_price);
try {
await requestServer(CREATE_RECEIPT_DAMAGE_ITEMS, "post", {
data: formData,
});
mutate();
setOpen(false);
} catch (error) {}
};
return (
<>
<DialogHeader>
<DialogTitle>ثبت آیتم جدید</DialogTitle>
</DialogHeader>
<DialogContent dividers>
<StyledForm onSubmit={handleSubmit(onSubmit)} id="createDamageForm">
<Stack spacing={3}>
<Controller
name="title"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="عنوان"
value={value}
onChange={onChange}
placeholder="عنوان را وارد کنید"
error={!!error}
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="unit"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="واحد"
value={value}
onChange={onChange}
error={!!error}
placeholder="واحد را وارد کنید"
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="base_price"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<NumberField
label={`فی`}
error={!!error}
value={value || ""}
type="text"
size={"small"}
unit={"ریال"}
inputProps={{
placeholder: "فی را وارد کنید",
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
if (!isNaN(event.target.value)) {
onChange(event.target.value);
} else {
onChange(value);
}
}}
helperText={error ? error.message : null}
variant="outlined"
fullWidth
/>
)}
/>
</Stack>
</StyledForm>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpen(false)} variant="outlined" color="secondary" startIcon={<ExitToApp />}>
بستن
</Button>
<Button
variant="contained"
disabled={isSubmitting}
type={"submit"}
form="createDamageForm"
endIcon={<Beenhere />}
>
{isSubmitting ? "در حال ثبت آیتم" : "ثبت آیتم"}
</Button>
</DialogActions>
</>
);
};
export default CreateFormContent;

50
src/components/dashboard/damageItems/Actions/Create/Form/index.jsx
View File

@@ -1,25 +1,25 @@
import { Dialog, IconButton } from "@mui/material";
import CreateFormContent from "./CreateFormContent";
import CloseIcon from "@mui/icons-material/Close";
const CreateForm = ({ open, setOpen, mutate }) => {
return (
<Dialog open={open} fullWidth maxWidth="xs">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{open && <CreateFormContent setOpen={setOpen} mutate={mutate} />}
</Dialog>
);
};
export default CreateForm;
import { Dialog, IconButton } from "@mui/material";
import CreateFormContent from "./CreateFormContent";
import CloseIcon from "@mui/icons-material/Close";
const CreateForm = ({ open, setOpen, mutate }) => {
return (
<Dialog open={open} fullWidth maxWidth="xs">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{open && <CreateFormContent setOpen={setOpen} mutate={mutate} />}
</Dialog>
);
};
export default CreateForm;

72
src/components/dashboard/damageItems/Actions/Create/index.jsx
View File

@@ -1,36 +1,36 @@
import { AddCircle } from "@mui/icons-material";
import { Button, IconButton, useMediaQuery, useTheme } from "@mui/material";
import CreateForm from "./Form";
import { useState } from "react";
const CreateDamage = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت آیتم" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
size={"small"}
variant="contained"
color="primary"
startIcon={<AddCircle />}
onClick={handleOpen}
>
ثبت آیتم
</Button>
)}
<CreateForm open={open} setOpen={setOpen} mutate={mutate} />
</>
);
};
export default CreateDamage;
import { AddCircle } from "@mui/icons-material";
import { Button, IconButton, useMediaQuery, useTheme } from "@mui/material";
import CreateForm from "./Form";
import { useState } from "react";
const CreateDamage = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت آیتم" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
size={"small"}
variant="contained"
color="primary"
startIcon={<AddCircle />}
onClick={handleOpen}
>
ثبت آیتم
</Button>
)}
<CreateForm open={open} setOpen={setOpen} mutate={mutate} />
</>
);
};
export default CreateDamage;

168
src/components/dashboard/damageItems/DamagesList.jsx
View File

@@ -1,84 +1,84 @@
"use client";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_RECEIPT_DAMAGE_ITEMS_LIST } from "@/core/utils/routes";
import { Box } from "@mui/material";
import { useMemo } from "react";
import Toolbar from "./Toolbar";
import RowActions from "./RowActions";
const DamagesList = () => {
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "title",
header: "عنوان",
id: "title",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "unit",
header: "واحد",
id: "unit",
enableColumnFilter: false,
grow: false,
size: 100,
},
{
accessorKey: "base_price",
header: "فی (ریال)",
id: "base_price",
enableColumnFilter: false,
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (renderedCellValue / 1).toLocaleString(),
},
{
accessorKey: "status",
header: "وضعیت",
id: "status",
enableColumnFilter: false,
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (renderedCellValue == 1 ? "فعال" : "غیرفعال"),
},
],
[]
);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
columns={columns}
sorting={[{ id: "id", desc: true }]}
table_url={GET_RECEIPT_DAMAGE_ITEMS_LIST}
page_name={"receiptDamagePage"}
table_name={"receiptDamageList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default DamagesList;
"use client";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_RECEIPT_DAMAGE_ITEMS_LIST } from "@/core/utils/routes";
import { Box } from "@mui/material";
import { useMemo } from "react";
import Toolbar from "./Toolbar";
import RowActions from "./RowActions";
const DamagesList = () => {
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "title",
header: "عنوان",
id: "title",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "unit",
header: "واحد",
id: "unit",
enableColumnFilter: false,
grow: false,
size: 100,
},
{
accessorKey: "base_price",
header: "فی (ریال)",
id: "base_price",
enableColumnFilter: false,
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (renderedCellValue / 1).toLocaleString(),
},
{
accessorKey: "status",
header: "وضعیت",
id: "status",
enableColumnFilter: false,
grow: false,
size: 100,
Cell: ({ renderedCellValue }) => (renderedCellValue == 1 ? "فعال" : "غیرفعال"),
},
],
[]
);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
columns={columns}
sorting={[{ id: "id", desc: true }]}
table_url={GET_RECEIPT_DAMAGE_ITEMS_LIST}
page_name={"receiptDamagePage"}
table_name={"receiptDamageList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"last"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default DamagesList;

62
src/components/dashboard/damageItems/RowActions/Activity/index.jsx
View File

@@ -1,31 +1,31 @@
import { ATIVITY_RECEIPT_DAMAGE_ITEMS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { Switch } from "@mui/material";
import { useState } from "react";
const Activity = ({ rowId, mutate, status }) => {
const [disabled, setDisabled] = useState(false);
const [checked, setChecked] = useState(status == 1);
const requestServer = useRequest();
const handleSwitch = (event) => {
const newChecked = event.target.checked;
setChecked(newChecked);
setDisabled(true);
requestServer(`${ATIVITY_RECEIPT_DAMAGE_ITEMS}/${rowId}`, "post")
.then(() => {
mutate();
})
.catch(() => {
setChecked(!newChecked);
})
.finally(() => {
setDisabled(false);
});
};
return <Switch size="small" disabled={disabled} checked={checked} onChange={handleSwitch} />;
};
export default Activity;
import { ATIVITY_RECEIPT_DAMAGE_ITEMS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { Switch } from "@mui/material";
import { useState } from "react";
const Activity = ({ rowId, mutate, status }) => {
const [disabled, setDisabled] = useState(false);
const [checked, setChecked] = useState(status == 1);
const requestServer = useRequest();
const handleSwitch = (event) => {
const newChecked = event.target.checked;
setChecked(newChecked);
setDisabled(true);
requestServer(`${ATIVITY_RECEIPT_DAMAGE_ITEMS}/${rowId}`, "post")
.then(() => {
mutate();
})
.catch(() => {
setChecked(!newChecked);
})
.finally(() => {
setDisabled(false);
});
};
return <Switch size="small" disabled={disabled} checked={checked} onChange={handleSwitch} />;
};
export default Activity;

290
src/components/dashboard/damageItems/RowActions/Edit/Form/index.jsx
View File

@@ -1,145 +1,145 @@
import NumberField from "@/core/components/NumberField";
import StyledForm from "@/core/components/StyledForm";
import { UPDATE_RECEIPT_DAMAGE_ITEMS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
import { Beenhere, ExitToApp } from "@mui/icons-material";
import { Button, DialogActions, DialogContent, DialogTitle, Stack, TextField } from "@mui/material";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
import { Controller, useForm } from "react-hook-form";
import { object, string } from "yup";
const validationSchema = object({
title: string().required("وارد کردن عنوان الزامیست!"),
unit: string().required("وارد کردن واحد الزامیست!"),
base_price: string().required("وارد کردن فی الزامیست!"),
});
const EditFormContent = ({ row, rowId, mutate, setOpen }) => {
const requestServer = useRequest({ notificationSuccess: true });
const defaultValues = {
title: row.original.title,
unit: row.original.unit,
base_price: row.original.base_price,
};
const {
control,
handleSubmit,
formState: { isSubmitting },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("title", data.title);
formData.append("unit", data.unit);
formData.append("base_price", data.base_price);
try {
await requestServer(`${UPDATE_RECEIPT_DAMAGE_ITEMS}/${rowId}`, "post", {
data: formData,
});
mutate();
setOpen(false);
} catch (error) {}
};
return (
<>
<DialogHeader>
<DialogTitle>ویرایش آیتم</DialogTitle>
</DialogHeader>
<DialogContent dividers>
<StyledForm onSubmit={handleSubmit(onSubmit)} id="updateDamageForm">
<Stack spacing={3}>
<Controller
name="title"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="عنوان"
value={value}
onChange={onChange}
placeholder="عنوان را وارد کنید"
error={!!error}
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="unit"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="واحد"
value={value}
onChange={onChange}
error={!!error}
placeholder="واحد را وارد کنید"
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="base_price"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<NumberField
label={`فی`}
error={!!error}
value={value || ""}
type="text"
size={"small"}
unit={"ریال"}
inputProps={{
placeholder: "فی را وارد کنید",
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
if (!isNaN(event.target.value)) {
onChange(event.target.value);
} else {
onChange(value);
}
}}
helperText={error ? error.message : null}
variant="outlined"
fullWidth
/>
)}
/>
</Stack>
</StyledForm>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpen(false)} variant="outlined" color="secondary" startIcon={<ExitToApp />}>
بستن
</Button>
<Button
variant="contained"
disabled={isSubmitting}
type={"submit"}
form="updateDamageForm"
endIcon={<Beenhere />}
>
{isSubmitting ? "در حال ویرایش آیتم" : "ویرایش آیتم"}
</Button>
</DialogActions>
</>
);
};
export default EditFormContent;
import NumberField from "@/core/components/NumberField";
import StyledForm from "@/core/components/StyledForm";
import { UPDATE_RECEIPT_DAMAGE_ITEMS } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
import { Beenhere, ExitToApp } from "@mui/icons-material";
import { Button, DialogActions, DialogContent, DialogTitle, Stack, TextField } from "@mui/material";
import { DialogHeader } from "next/dist/client/components/react-dev-overlay/internal/components/Dialog";
import { Controller, useForm } from "react-hook-form";
import { object, string } from "yup";
const validationSchema = object({
title: string().required("وارد کردن عنوان الزامیست!"),
unit: string().required("وارد کردن واحد الزامیست!"),
base_price: string().required("وارد کردن فی الزامیست!"),
});
const EditFormContent = ({ row, rowId, mutate, setOpen }) => {
const requestServer = useRequest({ notificationSuccess: true });
const defaultValues = {
title: row.original.title,
unit: row.original.unit,
base_price: row.original.base_price,
};
const {
control,
handleSubmit,
formState: { isSubmitting },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("title", data.title);
formData.append("unit", data.unit);
formData.append("base_price", data.base_price);
try {
await requestServer(`${UPDATE_RECEIPT_DAMAGE_ITEMS}/${rowId}`, "post", {
data: formData,
});
mutate();
setOpen(false);
} catch (error) {}
};
return (
<>
<DialogHeader>
<DialogTitle>ویرایش آیتم</DialogTitle>
</DialogHeader>
<DialogContent dividers>
<StyledForm onSubmit={handleSubmit(onSubmit)} id="updateDamageForm">
<Stack spacing={3}>
<Controller
name="title"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="عنوان"
value={value}
onChange={onChange}
placeholder="عنوان را وارد کنید"
error={!!error}
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="unit"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<TextField
fullWidth
size="small"
label="واحد"
value={value}
onChange={onChange}
error={!!error}
placeholder="واحد را وارد کنید"
helperText={error ? error.message : null}
variant="outlined"
InputLabelProps={{ shrink: true }}
/>
)}
/>
<Controller
name="base_price"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<NumberField
label={`فی`}
error={!!error}
value={value || ""}
type="text"
size={"small"}
unit={"ریال"}
inputProps={{
placeholder: "فی را وارد کنید",
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
if (!isNaN(event.target.value)) {
onChange(event.target.value);
} else {
onChange(value);
}
}}
helperText={error ? error.message : null}
variant="outlined"
fullWidth
/>
)}
/>
</Stack>
</StyledForm>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpen(false)} variant="outlined" color="secondary" startIcon={<ExitToApp />}>
بستن
</Button>
<Button
variant="contained"
disabled={isSubmitting}
type={"submit"}
form="updateDamageForm"
endIcon={<Beenhere />}
>
{isSubmitting ? "در حال ویرایش آیتم" : "ویرایش آیتم"}
</Button>
</DialogActions>
</>
);
};
export default EditFormContent;

88
src/components/dashboard/damageItems/RowActions/Edit/index.jsx
View File

@@ -1,44 +1,44 @@
import BorderColorIcon from "@mui/icons-material/BorderColor";
import { Dialog, IconButton, Tooltip } from "@mui/material";
import EditFormContent from "./Form";
import { useState } from "react";
import CloseIcon from "@mui/icons-material/Close";
const Edit = ({ row, mutate, rowId }) => {
const [openEditDialog, setOpenEditDialog] = useState(false);
return (
<>
<Tooltip title="ویرایش" arrow placement="right">
<IconButton
color="primary"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenEditDialog(true);
}}
>
<BorderColorIcon />
</IconButton>
</Tooltip>
<Dialog open={openEditDialog} fullWidth maxWidth="xs">
<IconButton
aria-label="close"
onClick={() => setOpenEditDialog(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{openEditDialog && (
<EditFormContent rowId={rowId} row={row} setOpen={setOpenEditDialog} mutate={mutate} />
)}
</Dialog>
</>
);
};
export default Edit;
import BorderColorIcon from "@mui/icons-material/BorderColor";
import { Dialog, IconButton, Tooltip } from "@mui/material";
import EditFormContent from "./Form";
import { useState } from "react";
import CloseIcon from "@mui/icons-material/Close";
const Edit = ({ row, mutate, rowId }) => {
const [openEditDialog, setOpenEditDialog] = useState(false);
return (
<>
<Tooltip title="ویرایش" arrow placement="right">
<IconButton
color="primary"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenEditDialog(true);
}}
>
<BorderColorIcon />
</IconButton>
</Tooltip>
<Dialog open={openEditDialog} fullWidth maxWidth="xs">
<IconButton
aria-label="close"
onClick={() => setOpenEditDialog(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{openEditDialog && (
<EditFormContent rowId={rowId} row={row} setOpen={setOpenEditDialog} mutate={mutate} />
)}
</Dialog>
</>
);
};
export default Edit;

26
src/components/dashboard/damageItems/RowActions/index.jsx
View File

@@ -1,13 +1,13 @@
import { Box } from "@mui/material";
import Activity from "./Activity";
import Edit from "./Edit";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1, alignItems: "center" }}>
<Edit row={row} mutate={mutate} rowId={row.getValue("id")} />
<Activity mutate={mutate} rowId={row.getValue("id")} status={row.original.status} />
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import Activity from "./Activity";
import Edit from "./Edit";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1, alignItems: "center" }}>
<Edit row={row} mutate={mutate} rowId={row.getValue("id")} />
<Activity mutate={mutate} rowId={row.getValue("id")} status={row.original.status} />
</Box>
);
};
export default RowActions;

20
src/components/dashboard/damageItems/Toolbar.jsx
View File

@@ -1,10 +1,10 @@
import CreateDamage from "./Actions/Create";
const Toolbar = ({ mutate }) => {
return (
<>
<CreateDamage mutate={mutate} />
</>
);
};
export default Toolbar;
import CreateDamage from "./Actions/Create";
const Toolbar = ({ mutate }) => {
return (
<>
<CreateDamage mutate={mutate} />
</>
);
};
export default Toolbar;

26
src/components/dashboard/damageItems/index.jsx
View File

@@ -1,13 +1,13 @@
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import DamagesList from "./DamagesList";
const DamagesPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"آیتم خسارات"} />
<DamagesList />
</Stack>
);
};
export default DamagesPage;
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import DamagesList from "./DamagesList";
const DamagesPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"آیتم خسارات"} />
<DamagesList />
</Stack>
);
};
export default DamagesPage;

66
src/components/dashboard/damages/operator/Actions/create/Forms/CityContent.jsx
View File

@@ -1,33 +1,33 @@
import SelectBox from "@/core/components/SelectBox";
import useCities from "@/lib/hooks/useCities";
import { useEffect, useState } from "react";
const CityContent = ({ provinceID, field, fieldState: { error } }) => {
const { cityList, loadingCityList, errorCityList } = useCities(provinceID);
const [prevDependency, setPrevDependency] = useState(provinceID);
useEffect(() => {
if (prevDependency === provinceID) return;
field.onChange(null);
setPrevDependency(provinceID);
}, [provinceID]);
return (
<SelectBox
value={
!provinceID ? "dependency" : errorCityList ? "error" : loadingCityList ? "loading" : field.value || ""
}
label={"شهرستان"}
selectors={cityList}
schema={{ name: "name_fa", value: "id" }}
error={error}
onChange={field.onChange}
helperText={error?.message}
isLoading={loadingCityList}
errorEcured={errorCityList}
isDependency={!provinceID}
dependencyLabel={"ابتدا استان را انتخاب کنید"}
/>
);
};
export default CityContent;
import SelectBox from "@/core/components/SelectBox";
import useCities from "@/lib/hooks/useCities";
import { useEffect, useState } from "react";
const CityContent = ({ provinceID, field, fieldState: { error } }) => {
const { cityList, loadingCityList, errorCityList } = useCities(provinceID);
const [prevDependency, setPrevDependency] = useState(provinceID);
useEffect(() => {
if (prevDependency === provinceID) return;
field.onChange(null);
setPrevDependency(provinceID);
}, [provinceID]);
return (
<SelectBox
value={
!provinceID ? "dependency" : errorCityList ? "error" : loadingCityList ? "loading" : field.value || ""
}
label={"شهرستان"}
selectors={cityList}
schema={{ name: "name_fa", value: "id" }}
error={error}
onChange={field.onChange}
helperText={error?.message}
isLoading={loadingCityList}
errorEcured={errorCityList}
isDependency={!provinceID}
dependencyLabel={"ابتدا استان را انتخاب کنید"}
/>
);
};
export default CityContent;

32
src/components/dashboard/damages/operator/Actions/create/Forms/CityController.jsx
View File

@@ -1,16 +1,16 @@
import SelectBox from "@/core/components/SelectBox";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import { Controller, useWatch } from "react-hook-form";
import CityContent from "./CityContent";
const CityController = ({ control }) => {
const provinceID = useWatch({ control, name: "province_id" });
return (
<Controller
name="city_id"
control={control}
render={(props) => <CityContent provinceID={provinceID} {...props} />}
/>
);
};
export default CityController;
import SelectBox from "@/core/components/SelectBox";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import { Controller, useWatch } from "react-hook-form";
import CityContent from "./CityContent";
const CityController = ({ control }) => {
const provinceID = useWatch({ control, name: "province_id" });
return (
<Controller
name="city_id"
control={control}
render={(props) => <CityContent provinceID={provinceID} {...props} />}
/>
);
};
export default CityController;

524
src/components/dashboard/damages/operator/Actions/create/Forms/CreateFormContent.jsx
View File

@@ -1,262 +1,262 @@
import React, { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import { array, mixed, number, object, string } from "yup";
import { Box, Button, DialogActions, DialogContent, Tab, Tabs } from "@mui/material";
import StyledForm from "@/core/components/StyledForm";
import InfoIcon from "@mui/icons-material/Info";
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import MinorCrashIcon from "@mui/icons-material/MinorCrash";
import DamageInfo from "./DamageInfo";
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
import DamageReport from "./DamageReport";
import DamageItem from "./DamageItem";
import validateNationalCode from "@/core/utils/nationalCodeValidation";
import AssessmentIcon from "@mui/icons-material/Assessment";
function TabPanel(props) {
const { children, value, index } = props;
return (
<div role="tabpanel" hidden={value !== index}>
{value === index && <Box>{children}</Box>}
</div>
);
}
const validationSchema = object({
accident_date: string().required("لطفا تاریخ تصادف را وارد کنید!!!"),
accident_time: string().required("لطفا زمان تصادف را وارد کنید!!!"),
accident_type: string().required("لطفا نوع تصادف را وارد کنید!!!"),
province_id: number().required("لطفا استان را وارد کنید!!!"),
city_id: number().required("لطفا شهرستان را وارد کنید!!!"),
axis_name: string().required("لطفا نام محور را وارد کنید!!!"),
driver_name: string().when("isForeign", {
is: "0",
then: (schema) => schema.required("لطفا نام و نام خانوادگی را وارد کنید!!!"),
}),
phone_number: string().when("isForeign", {
is: "0",
then: (schema) =>
schema
.matches(/^09\d{9}$/, "شماره موبایل باید با 09 شروع شده و 11 رقم باشد")
.required("لطفا تلفن همراه را وارد کنید!!!"),
}),
national_code: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema
.test("max", "کد ملی باید شامل 10 رقم باشد", (value) => value.toString().length === 10)
.test("validation", "کد ملی صحیح نمی باشد", (value) => validateNationalCode(value))
.required("لطفا کد ملی را وارد کنید!!!"),
}),
start_point: mixed()
.test("start-point-required", "لطفاً نقطه تصادف را مشخص کنید!", function (value) {
return !!value;
})
.required("لطفاً نقطه تصادف را مشخص کنید!"),
plate_part1: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema.test("max", "2رقم", (value) => value.toString().length === 2).required("plate_part1 الزامیست"),
}),
plate_part2: mixed().when("isForeign", {
is: "0",
then: (schema) => schema.required("plate_part2 الزامیست"),
}),
plate_part3: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema.test("max", "3رقم", (value) => value.toString().length === 3).required("plate_part3الزامیست"),
}),
plate_part4: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema.test("max", "2رقم", (value) => value.toString().length === 2).required("plate_part4الزامیست"),
}),
damage_picture1: mixed().nullable().required("لطفا عکس تصادف را بارگذاری کنید!"),
damage_picture2: mixed().nullable().required("لطفا عکس تصادف را بارگذاری کنید!"),
police_serial: string().when("radio_button", {
is: "police_file_checkbox", // زمانی که گزینه "police_file_checkbox" انتخاب شده باشد
then: (schema) => schema.required("شماره کروکی یا نامه پلیس راه الزامی است"),
}),
police_file_date: string().when("radio_button", {
is: "police_file_checkbox", // زمانی که گزینه "police_file_checkbox" انتخاب شده باشد
then: (schema) => schema.required("تاریخ کروکی یا نامه پلیس راه الزامی است"),
}),
police_file: mixed().when("radio_button", {
is: "police_file_checkbox", // زمانی که گزینه "police_file_checkbox" انتخاب شده باشد
then: (schema) => schema.nullable().required("تصویر کروکی یا نامه پلیس راه الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
items_damage: array().min(1, "حداقل یک آیتم خسارت ضروریست!!!"),
});
const CreateFormContent = ({ setOpen, SubmitDamage, defaultData }) => {
const defaultValues = {
isForeign: defaultData.isForeign,
accident_date: defaultData.accident_date,
accident_time: defaultData.accident_time,
accident_type: defaultData.accident_type,
province_id: defaultData.province_id,
city_id: defaultData.city_id,
is_province: defaultData.is_province,
axis_name: defaultData.axis_name,
driver_name: defaultData.driver_name,
phone_number: defaultData.phone_number,
national_code: defaultData.national_code,
plate_part1: defaultData.plate_part1,
plate_part2: defaultData.plate_part2,
plate_part3: defaultData.plate_part3,
plate_part4: defaultData.plate_part4,
radio_button: defaultData.radio_button,
damage_picture1: defaultData.damage_picture1,
damage_picture2: defaultData.damage_picture2,
report_base: defaultData.report_base,
police_file_checkbox: defaultData.police_file_checkbox,
police_file: defaultData.police_file,
police_file_date: defaultData.police_file_date,
police_serial: defaultData.police_serial,
start_point: defaultData.start_point,
items_damage: defaultData.items_damage,
};
const [tabState, setTabState] = useState(0);
const handleClose = () => setOpen(false);
const handleChangeTab = (event, newValue) => setTabState(newValue);
const handlePrev = () => {
if (tabState === 0) {
handleClose();
} else {
setTabState(tabState - 1);
}
};
const {
control,
handleSubmit,
setValue,
trigger,
formState: { errors, isSubmitting, isValid },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmitBase = async (data) => {
await SubmitDamage(data);
};
const handleNext = async () => {
let fieldsToValidate = [];
if (tabState === 0) {
fieldsToValidate = [
"phone_number",
"start_point",
"plate_part1",
"plate_part2",
"plate_part3",
"plate_part4",
"accident_date",
"accident_type",
"national_code",
"accident_time",
"province_id",
"city_id",
"axis_name",
"driver_name",
"damage_picture1",
"damage_picture2",
];
} else if (tabState === 1) {
fieldsToValidate = ["report_base", "police_file", "police_file_date", "police_serial"];
} else if (tabState === 2) {
fieldsToValidate = ["items_damage"];
}
const isValid = await trigger(fieldsToValidate);
if (isValid) {
setTabState(tabState + 1);
}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmitBase)}>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant="fullWidth"
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab icon={<InfoIcon />} label="اطلاعات تصادف" />
<Tab disabled={tabState === 0} icon={<AssessmentIcon />} label="گزارش خسارت" />
<Tab disabled={tabState === 0 || tabState === 1} icon={<MinorCrashIcon />} label="آیتم خسارت" />
</Tabs>
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
<Box sx={{ flex: 1 }}>
<TabPanel value={tabState} index={0}>
<DamageInfo setValue={setValue} errors={errors} control={control} />
</TabPanel>
<TabPanel value={tabState} index={1}>
<DamageReport setValue={setValue} control={control} />
</TabPanel>
<TabPanel value={tabState} index={2}>
<Controller
name={"items_damage"}
control={control}
render={({ field, fieldState: { error } }) => {
return (
<DamageItem
baseDamageItems={defaultData.items_damage}
baseControl={control}
baseOnChange={field.onChange}
/>
);
}}
/>
</TabPanel>
</Box>
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
key={"handlePrev"}
variant="outlined"
color="secondary"
size="large"
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
>
{tabState === 0 ? "بستن" : "مرحله قبل"}
</Button>
{tabState !== 2 ? (
<Button
onClick={handleNext}
key={"handleNext"}
variant="contained"
size="large"
endIcon={<KeyboardDoubleArrowLeftIcon />}
>
مرحله بعد
</Button>
) : (
<Button
variant="contained"
size="large"
key={"Submit"}
disabled={!isValid || isSubmitting}
type={"submit"}
endIcon={!isValid ? null : <BeenhereIcon />}
>
{!isValid ? "حداقل یک آیتم خسارت ضروریست" : isSubmitting ? "در حال ثبت خسارت" : "ثبت خسارت"}
</Button>
)}
</DialogActions>
</StyledForm>
);
};
export default CreateFormContent;
import React, { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import { array, mixed, number, object, string } from "yup";
import { Box, Button, DialogActions, DialogContent, Tab, Tabs } from "@mui/material";
import StyledForm from "@/core/components/StyledForm";
import InfoIcon from "@mui/icons-material/Info";
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import MinorCrashIcon from "@mui/icons-material/MinorCrash";
import DamageInfo from "./DamageInfo";
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
import DamageReport from "./DamageReport";
import DamageItem from "./DamageItem";
import validateNationalCode from "@/core/utils/nationalCodeValidation";
import AssessmentIcon from "@mui/icons-material/Assessment";
function TabPanel(props) {
const { children, value, index } = props;
return (
<div role="tabpanel" hidden={value !== index}>
{value === index && <Box>{children}</Box>}
</div>
);
}
const validationSchema = object({
accident_date: string().required("لطفا تاریخ تصادف را وارد کنید!!!"),
accident_time: string().required("لطفا زمان تصادف را وارد کنید!!!"),
accident_type: string().required("لطفا نوع تصادف را وارد کنید!!!"),
province_id: number().required("لطفا استان را وارد کنید!!!"),
city_id: number().required("لطفا شهرستان را وارد کنید!!!"),
axis_name: string().required("لطفا نام محور را وارد کنید!!!"),
driver_name: string().when("isForeign", {
is: "0",
then: (schema) => schema.required("لطفا نام و نام خانوادگی را وارد کنید!!!"),
}),
phone_number: string().when("isForeign", {
is: "0",
then: (schema) =>
schema
.matches(/^09\d{9}$/, "شماره موبایل باید با 09 شروع شده و 11 رقم باشد")
.required("لطفا تلفن همراه را وارد کنید!!!"),
}),
national_code: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema
.test("max", "کد ملی باید شامل 10 رقم باشد", (value) => value.toString().length === 10)
.test("validation", "کد ملی صحیح نمی باشد", (value) => validateNationalCode(value))
.required("لطفا کد ملی را وارد کنید!!!"),
}),
start_point: mixed()
.test("start-point-required", "لطفاً نقطه تصادف را مشخص کنید!", function (value) {
return !!value;
})
.required("لطفاً نقطه تصادف را مشخص کنید!"),
plate_part1: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema.test("max", "2رقم", (value) => value.toString().length === 2).required("plate_part1 الزامیست"),
}),
plate_part2: mixed().when("isForeign", {
is: "0",
then: (schema) => schema.required("plate_part2 الزامیست"),
}),
plate_part3: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema.test("max", "3رقم", (value) => value.toString().length === 3).required("plate_part3الزامیست"),
}),
plate_part4: mixed().when("isForeign", {
is: "0",
then: (schema) =>
schema.test("max", "2رقم", (value) => value.toString().length === 2).required("plate_part4الزامیست"),
}),
damage_picture1: mixed().nullable().required("لطفا عکس تصادف را بارگذاری کنید!"),
damage_picture2: mixed().nullable().required("لطفا عکس تصادف را بارگذاری کنید!"),
police_serial: string().when("radio_button", {
is: "police_file_checkbox", // زمانی که گزینه "police_file_checkbox" انتخاب شده باشد
then: (schema) => schema.required("شماره کروکی یا نامه پلیس راه الزامی است"),
}),
police_file_date: string().when("radio_button", {
is: "police_file_checkbox", // زمانی که گزینه "police_file_checkbox" انتخاب شده باشد
then: (schema) => schema.required("تاریخ کروکی یا نامه پلیس راه الزامی است"),
}),
police_file: mixed().when("radio_button", {
is: "police_file_checkbox", // زمانی که گزینه "police_file_checkbox" انتخاب شده باشد
then: (schema) => schema.nullable().required("تصویر کروکی یا نامه پلیس راه الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
items_damage: array().min(1, "حداقل یک آیتم خسارت ضروریست!!!"),
});
const CreateFormContent = ({ setOpen, SubmitDamage, defaultData }) => {
const defaultValues = {
isForeign: defaultData.isForeign,
accident_date: defaultData.accident_date,
accident_time: defaultData.accident_time,
accident_type: defaultData.accident_type,
province_id: defaultData.province_id,
city_id: defaultData.city_id,
is_province: defaultData.is_province,
axis_name: defaultData.axis_name,
driver_name: defaultData.driver_name,
phone_number: defaultData.phone_number,
national_code: defaultData.national_code,
plate_part1: defaultData.plate_part1,
plate_part2: defaultData.plate_part2,
plate_part3: defaultData.plate_part3,
plate_part4: defaultData.plate_part4,
radio_button: defaultData.radio_button,
damage_picture1: defaultData.damage_picture1,
damage_picture2: defaultData.damage_picture2,
report_base: defaultData.report_base,
police_file_checkbox: defaultData.police_file_checkbox,
police_file: defaultData.police_file,
police_file_date: defaultData.police_file_date,
police_serial: defaultData.police_serial,
start_point: defaultData.start_point,
items_damage: defaultData.items_damage,
};
const [tabState, setTabState] = useState(0);
const handleClose = () => setOpen(false);
const handleChangeTab = (event, newValue) => setTabState(newValue);
const handlePrev = () => {
if (tabState === 0) {
handleClose();
} else {
setTabState(tabState - 1);
}
};
const {
control,
handleSubmit,
setValue,
trigger,
formState: { errors, isSubmitting, isValid },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmitBase = async (data) => {
await SubmitDamage(data);
};
const handleNext = async () => {
let fieldsToValidate = [];
if (tabState === 0) {
fieldsToValidate = [
"phone_number",
"start_point",
"plate_part1",
"plate_part2",
"plate_part3",
"plate_part4",
"accident_date",
"accident_type",
"national_code",
"accident_time",
"province_id",
"city_id",
"axis_name",
"driver_name",
"damage_picture1",
"damage_picture2",
];
} else if (tabState === 1) {
fieldsToValidate = ["report_base", "police_file", "police_file_date", "police_serial"];
} else if (tabState === 2) {
fieldsToValidate = ["items_damage"];
}
const isValid = await trigger(fieldsToValidate);
if (isValid) {
setTabState(tabState + 1);
}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmitBase)}>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant="fullWidth"
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab icon={<InfoIcon />} label="اطلاعات تصادف" />
<Tab disabled={tabState === 0} icon={<AssessmentIcon />} label="گزارش خسارت" />
<Tab disabled={tabState === 0 || tabState === 1} icon={<MinorCrashIcon />} label="آیتم خسارت" />
</Tabs>
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
<Box sx={{ flex: 1 }}>
<TabPanel value={tabState} index={0}>
<DamageInfo setValue={setValue} errors={errors} control={control} />
</TabPanel>
<TabPanel value={tabState} index={1}>
<DamageReport setValue={setValue} control={control} />
</TabPanel>
<TabPanel value={tabState} index={2}>
<Controller
name={"items_damage"}
control={control}
render={({ field, fieldState: { error } }) => {
return (
<DamageItem
baseDamageItems={defaultData.items_damage}
baseControl={control}
baseOnChange={field.onChange}
/>
);
}}
/>
</TabPanel>
</Box>
</DialogContent>
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
key={"handlePrev"}
variant="outlined"
color="secondary"
size="large"
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
>
{tabState === 0 ? "بستن" : "مرحله قبل"}
</Button>
{tabState !== 2 ? (
<Button
onClick={handleNext}
key={"handleNext"}
variant="contained"
size="large"
endIcon={<KeyboardDoubleArrowLeftIcon />}
>
مرحله بعد
</Button>
) : (
<Button
variant="contained"
size="large"
key={"Submit"}
disabled={!isValid || isSubmitting}
type={"submit"}
endIcon={!isValid ? null : <BeenhereIcon />}
>
{!isValid ? "حداقل یک آیتم خسارت ضروریست" : isSubmitting ? "در حال ثبت خسارت" : "ثبت خسارت"}
</Button>
)}
</DialogActions>
</StyledForm>
);
};
export default CreateFormContent;

112
src/components/dashboard/damages/operator/Actions/create/Forms/DamageAmount.jsx
View File

@@ -1,56 +1,56 @@
import { Controller, useWatch } from "react-hook-form";
import { Grid } from "@mui/material";
import NumberField from "@/core/components/NumberField";
import { useEffect } from "react";
const DamageAmount = ({ control, damageItemList, setValue }) => {
const itemDamage = useWatch({ control, name: "id" });
const itemValue = useWatch({ control, name: "value" });
const itemDamageId = damageItemList.find((damageItem) => damageItem.id === itemDamage);
const isDisabled = itemDamageId?.base_price ? itemDamageId?.base_price !== 0 : false;
const calculatedValue = itemValue * (itemDamageId?.base_price ? itemDamageId?.base_price : 0);
useEffect(() => {
if (isDisabled) {
setValue("amount", calculatedValue);
}
}, [itemValue, itemDamageId, isDisabled, setValue]);
return (
<Grid item xs={12} sm={6}>
<Controller
name="amount"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<NumberField
value={isDisabled ? calculatedValue : field.value || ""}
variant="outlined"
name="amount"
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
if (!isDisabled) {
field.onChange(inputValue);
}
}}
label={`هزینه خسارت (ریال)`}
placeholder="هزینه خسارت را وارد کنید"
fullWidth
size="small"
disabled={isDisabled || itemDamage === null}
error={error}
helperText={error?.message}
/>
);
}}
/>
</Grid>
);
};
export default DamageAmount;
import { Controller, useWatch } from "react-hook-form";
import { Grid } from "@mui/material";
import NumberField from "@/core/components/NumberField";
import { useEffect } from "react";
const DamageAmount = ({ control, damageItemList, setValue }) => {
const itemDamage = useWatch({ control, name: "id" });
const itemValue = useWatch({ control, name: "value" });
const itemDamageId = damageItemList.find((damageItem) => damageItem.id === itemDamage);
const isDisabled = itemDamageId?.base_price ? itemDamageId?.base_price !== 0 : false;
const calculatedValue = itemValue * (itemDamageId?.base_price ? itemDamageId?.base_price : 0);
useEffect(() => {
if (isDisabled) {
setValue("amount", calculatedValue);
}
}, [itemValue, itemDamageId, isDisabled, setValue]);
return (
<Grid item xs={12} sm={6}>
<Controller
name="amount"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<NumberField
value={isDisabled ? calculatedValue : field.value || ""}
variant="outlined"
name="amount"
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
if (!isDisabled) {
field.onChange(inputValue);
}
}}
label={`هزینه خسارت (ریال)`}
placeholder="هزینه خسارت را وارد کنید"
fullWidth
size="small"
disabled={isDisabled || itemDamage === null}
error={error}
helperText={error?.message}
/>
);
}}
/>
</Grid>
);
};
export default DamageAmount;

506
src/components/dashboard/damages/operator/Actions/create/Forms/DamageInfo.jsx
View File

@@ -1,253 +1,253 @@
import { Controller, useWatch } from "react-hook-form";
import { Grid, Stack, TextField, ToggleButton, ToggleButtonGroup } from "@mui/material";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import MuiTimePicker from "@/core/components/MuiTimePicker";
import SelectBox from "@/core/components/SelectBox";
import PlateNumber from "@/core/components/PlateNumber";
import ImageUpload from "./ImageUpload";
import MapInfoOneMarker from "@/core/components/MapInfoOneMarker";
import PersianTextField from "@/core/components/PersianTextField";
import LogesticController from "./LogesticController";
const DamageInfo = ({ control, setValue, errors }) => {
const StartPoint = useWatch({ control, name: "start_point" });
const IsForeign = useWatch({ control, name: "isForeign" });
return (
<Stack>
<LogesticController control={control} />
<Stack sx={{ mt: 2 }} alignItems={"center"} justifyContent={"center"}>
<Controller
name="isForeign"
control={control}
render={({ field, fieldState: { error } }) => (
<ToggleButtonGroup
value={field.value}
exclusive
onChange={(event, newAlignment) => field.onChange(newAlignment)}
>
<ToggleButton value="0">ناوگان داخلی</ToggleButton>
<ToggleButton value="1">ناوگان خارجی</ToggleButton>
</ToggleButtonGroup>
)}
/>
</Stack>
{IsForeign == "0" && (
<>
<Grid sx={{ mt: 2 }} container spacing={2}>
<Grid item xs={12} md={6}>
<Controller
name="driver_name"
control={control}
render={({ field, fieldState: { error } }) => (
<PersianTextField
value={field.value}
variant="outlined"
name="driver_name"
onChange={field.onChange}
label="نام و نام خانوادگی راننده"
placeholder={"نام و نام خانوادگی فارسی را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="national_code"
control={control}
render={({ field, fieldState: { error } }) => (
<TextField
value={field.value}
variant="outlined"
name="national_code"
type={"tel"}
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
field.onChange(inputValue);
}}
label="کد ملی راننده"
placeholder={"کد ملی راننده را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
</Grid>
<Grid sx={{ mt: 2 }} container spacing={2}>
<Grid item xs={12} md={6}>
<Controller
name="phone_number"
control={control}
render={({ field, fieldState: { error } }) => (
<TextField
value={field.value}
variant="outlined"
name="phone_number"
type={"tel"}
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
field.onChange(inputValue);
}}
label="شماره موبایل راننده"
placeholder={"شماره موبایل راننده را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<PlateNumber control={control} />
</Grid>
</Grid>
</>
)}
<Grid sx={{ mt: 1 }} container spacing={2}>
<Grid item xs={12} md={4}>
<Controller
control={control}
render={({ field, fieldState: { error } }) => {
return (
<MuiDatePicker
name="accident_date"
error={error}
value={field.value}
placeholder={"تاریخ تصادف را وارد کنید"}
label={"تاریخ تصادف"}
setFieldValue={(name, value) => field.onChange(value || [])}
helperText={error ? error.message : null}
/>
);
}}
name={"accident_date"}
/>
</Grid>
<Grid item xs={12} md={4}>
<Controller
control={control}
render={({ field, fieldState: { error } }) => {
return (
<MuiTimePicker
name="accident_time"
error={error}
value={field.value}
placeholder={"زمان تصادف را وارد کنید"}
label={"زمان تصادف"}
setFieldValue={(name, value) => field.onChange(value || null)}
helperText={error ? error.message : null}
/>
);
}}
name={"accident_time"}
/>
</Grid>
<Grid item xs={12} md={4}>
<Controller
name="accident_type"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<SelectBox
value={field.value}
label="نوع خسارت"
selectors={[
{
id: 1,
value: "1",
name: "خسارتی",
},
{
id: 2,
value: "2",
name: "جرحی",
},
{
id: 3,
value: "3",
name: "فوتی",
},
]}
schema={{ name: "name", value: "value" }}
error={error}
onChange={field.onChange}
helperText={error?.message}
isLoading={false}
errorEcured={false}
/>
);
}}
/>
</Grid>
</Grid>
<Grid sx={{ mt: 2 }} container spacing={2}>
<Grid item xs={12} md={6}>
<Controller
name="damage_picture1"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر تصادف"}
/>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="damage_picture2"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر تصادف"}
/>
)}
/>
</Grid>
</Grid>
<Stack sx={{ mt: 2 }}>
<MapInfoOneMarker
setValue={setValue}
StartPoint={StartPoint}
errors={errors}
title={"برای ثبت محل تصادف، لطفاً نقشه را بیشتر زوم کنید."}
/>
</Stack>
</Stack>
);
};
export default DamageInfo;
import { Controller, useWatch } from "react-hook-form";
import { Grid, Stack, TextField, ToggleButton, ToggleButtonGroup } from "@mui/material";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import MuiTimePicker from "@/core/components/MuiTimePicker";
import SelectBox from "@/core/components/SelectBox";
import PlateNumber from "@/core/components/PlateNumber";
import ImageUpload from "./ImageUpload";
import MapInfoOneMarker from "@/core/components/MapInfoOneMarker";
import PersianTextField from "@/core/components/PersianTextField";
import LogesticController from "./LogesticController";
const DamageInfo = ({ control, setValue, errors }) => {
const StartPoint = useWatch({ control, name: "start_point" });
const IsForeign = useWatch({ control, name: "isForeign" });
return (
<Stack>
<LogesticController control={control} />
<Stack sx={{ mt: 2 }} alignItems={"center"} justifyContent={"center"}>
<Controller
name="isForeign"
control={control}
render={({ field, fieldState: { error } }) => (
<ToggleButtonGroup
value={field.value}
exclusive
onChange={(event, newAlignment) => field.onChange(newAlignment)}
>
<ToggleButton value="0">ناوگان داخلی</ToggleButton>
<ToggleButton value="1">ناوگان خارجی</ToggleButton>
</ToggleButtonGroup>
)}
/>
</Stack>
{IsForeign == "0" && (
<>
<Grid sx={{ mt: 2 }} container spacing={2}>
<Grid item xs={12} md={6}>
<Controller
name="driver_name"
control={control}
render={({ field, fieldState: { error } }) => (
<PersianTextField
value={field.value}
variant="outlined"
name="driver_name"
onChange={field.onChange}
label="نام و نام خانوادگی راننده"
placeholder={"نام و نام خانوادگی فارسی را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="national_code"
control={control}
render={({ field, fieldState: { error } }) => (
<TextField
value={field.value}
variant="outlined"
name="national_code"
type={"tel"}
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
field.onChange(inputValue);
}}
label="کد ملی راننده"
placeholder={"کد ملی راننده را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
</Grid>
<Grid sx={{ mt: 2 }} container spacing={2}>
<Grid item xs={12} md={6}>
<Controller
name="phone_number"
control={control}
render={({ field, fieldState: { error } }) => (
<TextField
value={field.value}
variant="outlined"
name="phone_number"
type={"tel"}
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
field.onChange(inputValue);
}}
label="شماره موبایل راننده"
placeholder={"شماره موبایل راننده را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<PlateNumber control={control} />
</Grid>
</Grid>
</>
)}
<Grid sx={{ mt: 1 }} container spacing={2}>
<Grid item xs={12} md={4}>
<Controller
control={control}
render={({ field, fieldState: { error } }) => {
return (
<MuiDatePicker
name="accident_date"
error={error}
value={field.value}
placeholder={"تاریخ تصادف را وارد کنید"}
label={"تاریخ تصادف"}
setFieldValue={(name, value) => field.onChange(value || [])}
helperText={error ? error.message : null}
/>
);
}}
name={"accident_date"}
/>
</Grid>
<Grid item xs={12} md={4}>
<Controller
control={control}
render={({ field, fieldState: { error } }) => {
return (
<MuiTimePicker
name="accident_time"
error={error}
value={field.value}
placeholder={"زمان تصادف را وارد کنید"}
label={"زمان تصادف"}
setFieldValue={(name, value) => field.onChange(value || null)}
helperText={error ? error.message : null}
/>
);
}}
name={"accident_time"}
/>
</Grid>
<Grid item xs={12} md={4}>
<Controller
name="accident_type"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<SelectBox
value={field.value}
label="نوع خسارت"
selectors={[
{
id: 1,
value: "1",
name: "خسارتی",
},
{
id: 2,
value: "2",
name: "جرحی",
},
{
id: 3,
value: "3",
name: "فوتی",
},
]}
schema={{ name: "name", value: "value" }}
error={error}
onChange={field.onChange}
helperText={error?.message}
isLoading={false}
errorEcured={false}
/>
);
}}
/>
</Grid>
</Grid>
<Grid sx={{ mt: 2 }} container spacing={2}>
<Grid item xs={12} md={6}>
<Controller
name="damage_picture1"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر تصادف"}
/>
)}
/>
</Grid>
<Grid item xs={12} md={6}>
<Controller
name="damage_picture2"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر تصادف"}
/>
)}
/>
</Grid>
</Grid>
<Stack sx={{ mt: 2 }}>
<MapInfoOneMarker
setValue={setValue}
StartPoint={StartPoint}
errors={errors}
title={"برای ثبت محل تصادف، لطفاً نقشه را بیشتر زوم کنید."}
/>
</Stack>
</Stack>
);
};
export default DamageInfo;

334
src/components/dashboard/damages/operator/Actions/create/Forms/DamageItem.jsx
View File

@@ -1,167 +1,167 @@
import {
Autocomplete,
Box,
Button,
Chip,
Divider,
Fade,
Grid,
Skeleton,
Stack,
TextField,
Typography,
} from "@mui/material";
import { Controller, useForm, useWatch } from "react-hook-form";
import LinearProgress from "@mui/material/LinearProgress";
import { useEffect, useState } from "react";
import DamageItemInfo from "./DamageItemInfo";
import { number, object } from "yup";
import useDamageItemList from "@/lib/hooks/useDamageItemList";
import DamagePrice from "./DamagePrice";
import { yupResolver } from "@hookform/resolvers/yup";
const schema = object({
id: number().required("لطفا نوع خسارت را وارد کنید!!!"),
value: number().required("لطفا میزان خسارت را وارد کنید!!!"),
amount: number().required("لطفا هزینه خسارت را وارد کنید!!!"),
});
const defaultValues = {
id: null,
value: null,
amount: null,
};
const DamageItem = ({ baseOnChange, baseDamageItems }) => {
const flattenBaseDamageItems = (items) => {
return items.map((item) => ({
id: item.id,
title: item.title,
unit: item.unit,
base_price: item.base_price,
status: item.status,
until_27_shahrivar: item.until_27_shahrivar,
...item.pivot, // اضافه کردن مقادیر موجود در pivot به سطح بالا
}));
};
const [selectedDamageItemList, setSelectedDamageItemList] = useState(
baseDamageItems.length !== 0 ? flattenBaseDamageItems(baseDamageItems) : []
);
const { damageItemList, loadingDamageItemList, errorDamageItemList } = useDamageItemList();
const { control, handleSubmit, reset, setValue } = useForm({
defaultValues,
resolver: yupResolver(schema),
mode: "all",
});
const deleteDamageItem = (id) => {
setSelectedDamageItemList((prev) => prev.filter((DamageItem) => DamageItem.id !== id));
};
useEffect(() => {
baseOnChange(selectedDamageItemList);
}, [selectedDamageItemList]);
const handleCreateDamage = (data) => {
setSelectedDamageItemList((prev) => {
const isDuplicate = prev.some((item) => item.id === data.id);
if (!isDuplicate) {
return [...prev, data];
} else {
return prev;
}
});
reset();
};
return (
<>
<Stack spacing={2}>
{loadingDamageItemList ? (
<Box sx={{ width: "100%" }}>
<LinearProgress />
</Box>
) : (
<>
<Stack sx={{ minWidth: "200px" }}>
<Controller
name="id"
control={control}
render={({ field, fieldState: { error } }) => (
<Autocomplete
options={damageItemList || []}
size={"small"}
getOptionLabel={(option) => option.title}
isOptionEqualToValue={(option, value) => option.id === value.id}
loading={loadingDamageItemList}
renderInput={(params) => (
<TextField
{...params}
label="نوع خسارت"
error={!!error}
helperText={error?.message}
/>
)}
onChange={(_, value) => field.onChange(value?.id)}
value={damageItemList.find((item) => item.id === field.value) || null}
/>
)}
/>
</Stack>
<Stack>
<Grid container columnSpacing={1}>
<DamagePrice setValue={setValue} control={control} damageItemList={damageItemList} />
</Grid>
</Stack>
<Stack>
<Button
variant="contained"
fullWidth
onClick={handleSubmit(handleCreateDamage)}
sx={{ textWrap: "nowrap" }}
>
افزودن آیتم خسارت
</Button>
</Stack>
</>
)}
</Stack>
<Divider sx={{ my: 2, width: "100%" }}>
<Chip variant="outlined" label="لیست آیتم های خسارت" />
</Divider>
{selectedDamageItemList.length === 0 && (
<Box sx={{ my: 4, width: "100%", textAlign: "center" }}>
<Typography variant="h6" sx={{ letterSpacing: "2px", color: "#606060" }}>
ابتدا اطلاعات بالا را تکمیل نمایید
</Typography>
</Box>
)}
<Fade in={selectedDamageItemList.length !== 0} sx={{ width: "100%" }}>
<Grid
container
spacing={2}
sx={{
p: 1,
mt: 2,
minHeight: 150,
maxHeight: 300,
overflowY: "auto",
}}
>
{loadingDamageItemList ? (
<Stack sx={{ width: "100%", pl: 2, pt: 2 }}>
<Skeleton animation="wave" variant="rounded" height={100} />
</Stack>
) : (
selectedDamageItemList.length !== 0 &&
selectedDamageItemList.map((selectedDamageItem, index) => (
<Grid key={index} item xs={12}>
<DamageItemInfo
damageItemList={damageItemList}
selectedDamageItem={selectedDamageItem}
deleteDamageItem={deleteDamageItem}
/>
</Grid>
))
)}
</Grid>
</Fade>
</>
);
};
export default DamageItem;
import {
Autocomplete,
Box,
Button,
Chip,
Divider,
Fade,
Grid,
Skeleton,
Stack,
TextField,
Typography,
} from "@mui/material";
import { Controller, useForm, useWatch } from "react-hook-form";
import LinearProgress from "@mui/material/LinearProgress";
import { useEffect, useState } from "react";
import DamageItemInfo from "./DamageItemInfo";
import { number, object } from "yup";
import useDamageItemList from "@/lib/hooks/useDamageItemList";
import DamagePrice from "./DamagePrice";
import { yupResolver } from "@hookform/resolvers/yup";
const schema = object({
id: number().required("لطفا نوع خسارت را وارد کنید!!!"),
value: number().required("لطفا میزان خسارت را وارد کنید!!!"),
amount: number().required("لطفا هزینه خسارت را وارد کنید!!!"),
});
const defaultValues = {
id: null,
value: null,
amount: null,
};
const DamageItem = ({ baseOnChange, baseDamageItems }) => {
const flattenBaseDamageItems = (items) => {
return items.map((item) => ({
id: item.id,
title: item.title,
unit: item.unit,
base_price: item.base_price,
status: item.status,
until_27_shahrivar: item.until_27_shahrivar,
...item.pivot, // اضافه کردن مقادیر موجود در pivot به سطح بالا
}));
};
const [selectedDamageItemList, setSelectedDamageItemList] = useState(
baseDamageItems.length !== 0 ? flattenBaseDamageItems(baseDamageItems) : []
);
const { damageItemList, loadingDamageItemList, errorDamageItemList } = useDamageItemList();
const { control, handleSubmit, reset, setValue } = useForm({
defaultValues,
resolver: yupResolver(schema),
mode: "all",
});
const deleteDamageItem = (id) => {
setSelectedDamageItemList((prev) => prev.filter((DamageItem) => DamageItem.id !== id));
};
useEffect(() => {
baseOnChange(selectedDamageItemList);
}, [selectedDamageItemList]);
const handleCreateDamage = (data) => {
setSelectedDamageItemList((prev) => {
const isDuplicate = prev.some((item) => item.id === data.id);
if (!isDuplicate) {
return [...prev, data];
} else {
return prev;
}
});
reset();
};
return (
<>
<Stack spacing={2}>
{loadingDamageItemList ? (
<Box sx={{ width: "100%" }}>
<LinearProgress />
</Box>
) : (
<>
<Stack sx={{ minWidth: "200px" }}>
<Controller
name="id"
control={control}
render={({ field, fieldState: { error } }) => (
<Autocomplete
options={damageItemList || []}
size={"small"}
getOptionLabel={(option) => option.title}
isOptionEqualToValue={(option, value) => option.id === value.id}
loading={loadingDamageItemList}
renderInput={(params) => (
<TextField
{...params}
label="نوع خسارت"
error={!!error}
helperText={error?.message}
/>
)}
onChange={(_, value) => field.onChange(value?.id)}
value={damageItemList.find((item) => item.id === field.value) || null}
/>
)}
/>
</Stack>
<Stack>
<Grid container columnSpacing={1}>
<DamagePrice setValue={setValue} control={control} damageItemList={damageItemList} />
</Grid>
</Stack>
<Stack>
<Button
variant="contained"
fullWidth
onClick={handleSubmit(handleCreateDamage)}
sx={{ textWrap: "nowrap" }}
>
افزودن آیتم خسارت
</Button>
</Stack>
</>
)}
</Stack>
<Divider sx={{ my: 2, width: "100%" }}>
<Chip variant="outlined" label="لیست آیتم های خسارت" />
</Divider>
{selectedDamageItemList.length === 0 && (
<Box sx={{ my: 4, width: "100%", textAlign: "center" }}>
<Typography variant="h6" sx={{ letterSpacing: "2px", color: "#606060" }}>
ابتدا اطلاعات بالا را تکمیل نمایید
</Typography>
</Box>
)}
<Fade in={selectedDamageItemList.length !== 0} sx={{ width: "100%" }}>
<Grid
container
spacing={2}
sx={{
p: 1,
mt: 2,
minHeight: 150,
maxHeight: 300,
overflowY: "auto",
}}
>
{loadingDamageItemList ? (
<Stack sx={{ width: "100%", pl: 2, pt: 2 }}>
<Skeleton animation="wave" variant="rounded" height={100} />
</Stack>
) : (
selectedDamageItemList.length !== 0 &&
selectedDamageItemList.map((selectedDamageItem, index) => (
<Grid key={index} item xs={12}>
<DamageItemInfo
damageItemList={damageItemList}
selectedDamageItem={selectedDamageItem}
deleteDamageItem={deleteDamageItem}
/>
</Grid>
))
)}
</Grid>
</Fade>
</>
);
};
export default DamageItem;

120
src/components/dashboard/damages/operator/Actions/create/Forms/DamageItemInfo.jsx
View File

@@ -1,60 +1,60 @@
import { Box, Card, IconButton, Stack, Typography } from "@mui/material";
import DeleteIcon from "@mui/icons-material/Delete";
import React from "react";
import MinorCrashIcon from "@mui/icons-material/MinorCrash";
const DamageItemInfo = ({ deleteDamageItem, selectedDamageItem, damageItemList }) => {
const itemDamageId = damageItemList.find((item) => item.id == selectedDamageItem.id);
return (
<Card
elevation={0}
sx={{
display: "flex",
alignItems: "center",
justifyContent: "space-between",
border: 1,
borderColor: "divider",
px: 1,
py: 1,
}}
>
<Box sx={{ display: "flex" }}>
<MinorCrashIcon color="primary" sx={{ width: "50px", height: "50px" }} />
<Stack sx={{ ml: 1, justifyContent: "center" }} spacing={0.5}>
<Typography variant="body1" sx={{ letterSpacing: "1px", fontWeight: 500 }}>
{itemDamageId.title}
</Typography>
<Stack>
<Typography variant="caption">
میزان خسارت ({itemDamageId.unit}) :{" "}
<Typography
component="span"
variant="body1"
sx={{ fontWeight: "bold", fontSize: "0.9rem" }}
>
{(selectedDamageItem.value / 1).toLocaleString()}
</Typography>
</Typography>
<Typography variant="caption">
هزینه خسارت (ریال) :{" "}
<Typography
component="span"
variant="body1"
sx={{ fontWeight: "bold", fontSize: "0.9rem" }}
>
{(selectedDamageItem.amount / 1).toLocaleString()}
</Typography>
</Typography>
</Stack>
</Stack>
</Box>
<Box>
<IconButton color="error" onClick={() => deleteDamageItem(selectedDamageItem.id)}>
<DeleteIcon />
</IconButton>
</Box>
</Card>
);
};
export default DamageItemInfo;
import { Box, Card, IconButton, Stack, Typography } from "@mui/material";
import DeleteIcon from "@mui/icons-material/Delete";
import React from "react";
import MinorCrashIcon from "@mui/icons-material/MinorCrash";
const DamageItemInfo = ({ deleteDamageItem, selectedDamageItem, damageItemList }) => {
const itemDamageId = damageItemList.find((item) => item.id == selectedDamageItem.id);
return (
<Card
elevation={0}
sx={{
display: "flex",
alignItems: "center",
justifyContent: "space-between",
border: 1,
borderColor: "divider",
px: 1,
py: 1,
}}
>
<Box sx={{ display: "flex" }}>
<MinorCrashIcon color="primary" sx={{ width: "50px", height: "50px" }} />
<Stack sx={{ ml: 1, justifyContent: "center" }} spacing={0.5}>
<Typography variant="body1" sx={{ letterSpacing: "1px", fontWeight: 500 }}>
{itemDamageId.title}
</Typography>
<Stack>
<Typography variant="caption">
میزان خسارت ({itemDamageId.unit}) :{" "}
<Typography
component="span"
variant="body1"
sx={{ fontWeight: "bold", fontSize: "0.9rem" }}
>
{(selectedDamageItem.value / 1).toLocaleString()}
</Typography>
</Typography>
<Typography variant="caption">
هزینه خسارت (ریال) :{" "}
<Typography
component="span"
variant="body1"
sx={{ fontWeight: "bold", fontSize: "0.9rem" }}
>
{(selectedDamageItem.amount / 1).toLocaleString()}
</Typography>
</Typography>
</Stack>
</Stack>
</Box>
<Box>
<IconButton color="error" onClick={() => deleteDamageItem(selectedDamageItem.id)}>
<DeleteIcon />
</IconButton>
</Box>
</Card>
);
};
export default DamageItemInfo;

96
src/components/dashboard/damages/operator/Actions/create/Forms/DamagePrice.jsx
View File

@@ -1,48 +1,48 @@
import { Controller, useWatch } from "react-hook-form";
import { Grid, TextField } from "@mui/material";
import DamageAmount from "./DamageAmount";
const DamagePrice = ({ damageItemList, control, setValue }) => {
const itemDamage = useWatch({ control, name: "id" });
const itemDamageId = damageItemList.find((damageItem) => damageItem.id === itemDamage);
return (
<>
<Grid item xs={12} sm={6}>
<Controller
name="value"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<TextField
value={field.value || ""}
variant="outlined"
disabled={itemDamage === null}
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
name="value"
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
field.onChange(inputValue);
}}
label={`میزان خسارت ${itemDamageId?.unit ? `(${itemDamageId?.unit})` : ""}`}
fullWidth
size="small"
error={error}
helperText={error?.message}
/>
);
}}
/>
</Grid>
<DamageAmount setValue={setValue} damageItemList={damageItemList} control={control} />
</>
);
};
export default DamagePrice;
import { Controller, useWatch } from "react-hook-form";
import { Grid, TextField } from "@mui/material";
import DamageAmount from "./DamageAmount";
const DamagePrice = ({ damageItemList, control, setValue }) => {
const itemDamage = useWatch({ control, name: "id" });
const itemDamageId = damageItemList.find((damageItem) => damageItem.id === itemDamage);
return (
<>
<Grid item xs={12} sm={6}>
<Controller
name="value"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<TextField
value={field.value || ""}
variant="outlined"
disabled={itemDamage === null}
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
name="value"
onChange={(event) => {
const inputValue = event.target.value;
if (isNaN(Number(inputValue))) {
return;
}
field.onChange(inputValue);
}}
label={`میزان خسارت ${itemDamageId?.unit ? `(${itemDamageId?.unit})` : ""}`}
fullWidth
size="small"
error={error}
helperText={error?.message}
/>
);
}}
/>
</Grid>
<DamageAmount setValue={setValue} damageItemList={damageItemList} control={control} />
</>
);
};
export default DamagePrice;

102
src/components/dashboard/damages/operator/Actions/create/Forms/DamageReport.jsx
View File

@@ -1,51 +1,51 @@
import { FormControlLabel, RadioGroup, Stack } from "@mui/material";
import { Controller, useWatch } from "react-hook-form";
import { useState } from "react";
import PoliceFileReport from "./PoliceFileReport";
import Radio from "@mui/material/Radio";
const DamageReport = ({ control }) => {
const watchedStatus = useWatch({ control, name: "radio_button" });
const [selectedOption, setSelectedOption] = useState(watchedStatus || null);
// const [selectedOption, setSelectedOption] = useState("report_base");
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
return (
<>
<RadioGroup
aria-label="file-options"
name="file-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
control={
<Controller
name="radio_button"
control={control}
render={({ field }) => <Radio {...field} value="report_base" />}
/>
}
label="بازدید عوامل و کارشناسان راهداری"
/>
<FormControlLabel
control={
<Controller
name="radio_button"
control={control}
render={({ field }) => <Radio {...field} value="police_file_checkbox" />}
/>
}
label="کروکی یا نامه پلیس راه (معرفی فرد به اداره)"
/>
</Stack>
</RadioGroup>
{selectedOption === "police_file_checkbox" && <PoliceFileReport control={control} />}
</>
);
};
export default DamageReport;
import { FormControlLabel, RadioGroup, Stack } from "@mui/material";
import { Controller, useWatch } from "react-hook-form";
import { useState } from "react";
import PoliceFileReport from "./PoliceFileReport";
import Radio from "@mui/material/Radio";
const DamageReport = ({ control }) => {
const watchedStatus = useWatch({ control, name: "radio_button" });
const [selectedOption, setSelectedOption] = useState(watchedStatus || null);
// const [selectedOption, setSelectedOption] = useState("report_base");
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
return (
<>
<RadioGroup
aria-label="file-options"
name="file-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
control={
<Controller
name="radio_button"
control={control}
render={({ field }) => <Radio {...field} value="report_base" />}
/>
}
label="بازدید عوامل و کارشناسان راهداری"
/>
<FormControlLabel
control={
<Controller
name="radio_button"
control={control}
render={({ field }) => <Radio {...field} value="police_file_checkbox" />}
/>
}
label="کروکی یا نامه پلیس راه (معرفی فرد به اداره)"
/>
</Stack>
</RadioGroup>
{selectedOption === "police_file_checkbox" && <PoliceFileReport control={control} />}
</>
);
};
export default DamageReport;

154
src/components/dashboard/damages/operator/Actions/create/Forms/ImageUpload.jsx
View File

@@ -1,77 +1,77 @@
import { FormControl, FormHelperText } from "@mui/material";
import UploadSystem from "@/core/components/UploadSystem";
import React, { useEffect, useState } from "react";
const ImageUpload = ({ name, value, onChange, error, title }) => {
const [beforeImg, setBeforeImg] = useState(value ? value : null);
const [beforeFileType, setBeforeFileType] = useState(value ? "image/" : null);
const [beforeFileName, setBeforeFileName] = useState(null);
const [showBeforeImage, setShowBeforeImage] = useState(!value);
useEffect(() => {
if (value) {
setShowBeforeImage(false);
if (typeof value === "string") {
setBeforeImg(value);
setBeforeFileType("image/");
} else if (value instanceof File) {
setBeforeImg(URL.createObjectURL(value));
setBeforeFileType(value.type);
}
}
}, [value]);
const handleFileChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setBeforeImg(URL.createObjectURL(uploadedFile));
setBeforeFileType(fileType);
setBeforeFileName(fileName);
onChange(uploadedFile);
setShowBeforeImage(false);
}
};
return (
<FormControl
error={error}
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
}}
>
<FormHelperText
sx={{
fontSize: 14,
border: 1,
borderBottom: 0,
borderColor: "divider",
px: 2,
py: 1,
borderRadius: 2,
borderBottomRightRadius: 0,
borderBottomLeftRadius: 0,
}}
id={name}
>
{title}
</FormHelperText>
<UploadSystem
selectedImage={beforeImg}
handleUploadChange={handleFileChange}
fileType={beforeFileType}
fileName={beforeFileName}
setSelectedImage={setBeforeImg}
imageSize={[250, 150]}
setShowAddIcon={setShowBeforeImage}
showAddIcon={showBeforeImage}
/>
<FormHelperText id={name}>{error ? error.message : null}</FormHelperText>
</FormControl>
);
};
export default ImageUpload;
import { FormControl, FormHelperText } from "@mui/material";
import UploadSystem from "@/core/components/UploadSystem";
import React, { useEffect, useState } from "react";
const ImageUpload = ({ name, value, onChange, error, title }) => {
const [beforeImg, setBeforeImg] = useState(value ? value : null);
const [beforeFileType, setBeforeFileType] = useState(value ? "image/" : null);
const [beforeFileName, setBeforeFileName] = useState(null);
const [showBeforeImage, setShowBeforeImage] = useState(!value);
useEffect(() => {
if (value) {
setShowBeforeImage(false);
if (typeof value === "string") {
setBeforeImg(value);
setBeforeFileType("image/");
} else if (value instanceof File) {
setBeforeImg(URL.createObjectURL(value));
setBeforeFileType(value.type);
}
}
}, [value]);
const handleFileChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setBeforeImg(URL.createObjectURL(uploadedFile));
setBeforeFileType(fileType);
setBeforeFileName(fileName);
onChange(uploadedFile);
setShowBeforeImage(false);
}
};
return (
<FormControl
error={error}
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
}}
>
<FormHelperText
sx={{
fontSize: 14,
border: 1,
borderBottom: 0,
borderColor: "divider",
px: 2,
py: 1,
borderRadius: 2,
borderBottomRightRadius: 0,
borderBottomLeftRadius: 0,
}}
id={name}
>
{title}
</FormHelperText>
<UploadSystem
selectedImage={beforeImg}
handleUploadChange={handleFileChange}
fileType={beforeFileType}
fileName={beforeFileName}
setSelectedImage={setBeforeImg}
imageSize={[250, 150]}
setShowAddIcon={setShowBeforeImage}
showAddIcon={showBeforeImage}
/>
<FormHelperText id={name}>{error ? error.message : null}</FormHelperText>
</FormControl>
);
};
export default ImageUpload;

128
src/components/dashboard/damages/operator/Actions/create/Forms/LogesticController.jsx
View File

@@ -1,64 +1,64 @@
import { Controller, useWatch } from "react-hook-form";
import SelectBox from "@/core/components/SelectBox";
import useProvinces from "@/lib/hooks/useProvince";
import { Grid } from "@mui/material";
import CityController from "./CityController";
import PersianTextField from "@/core/components/PersianTextField";
const LogesticController = ({ control }) => {
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
const isProvince = useWatch({ control, name: "is_province" });
return (
<Grid sx={{ mt: 1 }} container spacing={2}>
{!isProvince ? (
<Grid item xs={12} md={4}>
<Controller
name="province_id"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<SelectBox
value={errorProvinces ? "error" : loadingProvinces ? "loading" : field.value || ""}
label="استان"
selectors={provinces}
schema={{ name: "name_fa", value: "id" }}
error={error}
disabled={isProvince}
onChange={field.onChange}
helperText={error?.message}
isLoading={loadingProvinces}
errorEcured={errorProvinces}
/>
);
}}
/>
</Grid>
) : null}
<Grid item xs={12} md={isProvince ? 6 : 4}>
<CityController control={control} />
</Grid>
<Grid item xs={12} md={isProvince ? 6 : 4}>
<Controller
name="axis_name"
control={control}
render={({ field, fieldState: { error } }) => (
<PersianTextField
value={field.value}
variant="outlined"
name="axis_name"
onChange={field.onChange}
label="نام محور"
placeholder={"نام محور فارسی را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
</Grid>
);
};
export default LogesticController;
import { Controller, useWatch } from "react-hook-form";
import SelectBox from "@/core/components/SelectBox";
import useProvinces from "@/lib/hooks/useProvince";
import { Grid } from "@mui/material";
import CityController from "./CityController";
import PersianTextField from "@/core/components/PersianTextField";
const LogesticController = ({ control }) => {
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
const isProvince = useWatch({ control, name: "is_province" });
return (
<Grid sx={{ mt: 1 }} container spacing={2}>
{!isProvince ? (
<Grid item xs={12} md={4}>
<Controller
name="province_id"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<SelectBox
value={errorProvinces ? "error" : loadingProvinces ? "loading" : field.value || ""}
label="استان"
selectors={provinces}
schema={{ name: "name_fa", value: "id" }}
error={error}
disabled={isProvince}
onChange={field.onChange}
helperText={error?.message}
isLoading={loadingProvinces}
errorEcured={errorProvinces}
/>
);
}}
/>
</Grid>
) : null}
<Grid item xs={12} md={isProvince ? 6 : 4}>
<CityController control={control} />
</Grid>
<Grid item xs={12} md={isProvince ? 6 : 4}>
<Controller
name="axis_name"
control={control}
render={({ field, fieldState: { error } }) => (
<PersianTextField
value={field.value}
variant="outlined"
name="axis_name"
onChange={field.onChange}
label="نام محور"
placeholder={"نام محور فارسی را وارد کنید"}
fullWidth
size="small"
error={error}
helperText={error?.message}
InputLabelProps={{ shrink: true }}
/>
)}
/>
</Grid>
</Grid>
);
};
export default LogesticController;

134
src/components/dashboard/damages/operator/Actions/create/Forms/PoliceFileReport.jsx
View File

@@ -1,67 +1,67 @@
import { Controller } from "react-hook-form";
import { Grid, Stack, TextField } from "@mui/material";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import ImageUpload from "./ImageUpload";
const PoliceFileReport = ({ control }) => {
return (
<Stack spacing={3} mt={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={6}>
<Controller
name="police_serial"
control={control}
render={({ field, fieldState: { error } }) => (
<TextField
{...field}
label="شماره کروکی یا نامه پلیس راه"
variant="outlined"
fullWidth
size="small"
error={error}
helperText={error && error.message}
/>
)}
/>
</Grid>
<Grid item xs={12} sm={6}>
<Controller
control={control}
render={({ field, fieldState: { error } }) => {
return (
<MuiDatePicker
name="police_file_date"
error={error}
value={field.value}
placeholder={"تاریخ کروکی یا نامه پلیس راه"}
label={"تاریخ کروکی یا نامه پلیس راه"}
setFieldValue={(name, value) => field.onChange(value || [])}
helperText={error ? error.message : null}
/>
);
}}
name={"police_file_date"}
/>
</Grid>
</Grid>
</Stack>
<Controller
name="police_file"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<ImageUpload
name={field.name}
value={field.value}
error={error}
title={"تصویر کروکی یا نامه پلیس راه"}
onChange={field.onChange}
/>
);
}}
/>
</Stack>
);
};
export default PoliceFileReport;
import { Controller } from "react-hook-form";
import { Grid, Stack, TextField } from "@mui/material";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import ImageUpload from "./ImageUpload";
const PoliceFileReport = ({ control }) => {
return (
<Stack spacing={3} mt={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={6}>
<Controller
name="police_serial"
control={control}
render={({ field, fieldState: { error } }) => (
<TextField
{...field}
label="شماره کروکی یا نامه پلیس راه"
variant="outlined"
fullWidth
size="small"
error={error}
helperText={error && error.message}
/>
)}
/>
</Grid>
<Grid item xs={12} sm={6}>
<Controller
control={control}
render={({ field, fieldState: { error } }) => {
return (
<MuiDatePicker
name="police_file_date"
error={error}
value={field.value}
placeholder={"تاریخ کروکی یا نامه پلیس راه"}
label={"تاریخ کروکی یا نامه پلیس راه"}
setFieldValue={(name, value) => field.onChange(value || [])}
helperText={error ? error.message : null}
/>
);
}}
name={"police_file_date"}
/>
</Grid>
</Grid>
</Stack>
<Controller
name="police_file"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<ImageUpload
name={field.name}
value={field.value}
error={error}
title={"تصویر کروکی یا نامه پلیس راه"}
onChange={field.onChange}
/>
);
}}
/>
</Stack>
);
};
export default PoliceFileReport;

224
src/components/dashboard/damages/operator/Actions/create/Forms/index.jsx
View File

@@ -1,112 +1,112 @@
"use client";
import { Dialog, IconButton } from "@mui/material";
import CreateFormContent from "./CreateFormContent";
import { format } from "date-fns";
import { CREATE_DAMAGE } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import CloseIcon from "@mui/icons-material/Close";
import { usePermissions } from "@/lib/hooks/usePermissions";
import { useAuth } from "@/lib/contexts/auth";
const OperatorCreateForm = ({ open, setOpen, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const { user } = useAuth();
const { data: userPermissions } = usePermissions();
const hasCreateProvincePermission = userPermissions.some((item) => ["add-receipt"].includes(item));
const SubmitCreateDamage = async (result) => {
const PlateNumber = `${result.plate_part1}-${result.plate_part2}-${result.plate_part3}-${result.plate_part4}`;
const formData = new FormData();
formData.append("accident_date", result.accident_date);
formData.append("accident_time", format(new Date(result.accident_time), "HH:mm"));
formData.append("accident_type", result.accident_type);
formData.append("province_id", result.province_id);
formData.append("city_id", result.city_id);
formData.append("axis_name", result.axis_name);
formData.append("is_foreign", result.isForeign);
if (result.isForeign == "0") {
formData.append("driver_name", result.driver_name);
formData.append("driver_phone_number", result.phone_number);
formData.append("driver_national_code", result.national_code);
formData.append("plaque", PlateNumber);
}
formData.append("damage_picture1", result.damage_picture1);
formData.append("damage_picture2", result.damage_picture2);
formData.append("lat", result.start_point.lat);
formData.append("lng", result.start_point.lng);
result.items_damage.map((item, index) => {
formData.append(`damage_items[${index}][id]`, item.id);
formData.append(`damage_items[${index}][value]`, item.value);
formData.append(`damage_items[${index}][amount]`, item.amount);
});
if (result.radio_button === "report_base") {
formData.append("report_base", 1);
}
if (result.radio_button === "police_file_checkbox") {
formData.append("report_base", 0);
formData.append("police_file", result.police_file);
formData.append("police_file_date", result.police_file_date);
formData.append("police_serial", result.police_serial);
}
await requestServer(`${CREATE_DAMAGE}`, "post", {
data: formData,
})
.then(() => {
mutate();
setOpen(false);
})
.catch(() => {});
};
const defaultData = {
isForeign: "0",
accident_date: "",
accident_time: "",
accident_type: "",
province_id: !hasCreateProvincePermission ? user.province_id : null,
is_province: !hasCreateProvincePermission,
city_id: null,
axis_name: "",
driver_name: "",
phone_number: "",
national_code: "",
plate_part1: "",
plate_part2: "الف",
plate_part3: "",
plate_part4: "",
radio_button: "report_base",
damage_picture1: null,
damage_picture2: null,
report_base: "",
police_file_checkbox: "",
police_file: null,
police_file_date: "",
police_serial: "",
start_point: "",
items_damage: [],
};
return (
<Dialog open={open} fullWidth maxWidth="md">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{open && (
<CreateFormContent
defaultData={defaultData}
SubmitDamage={SubmitCreateDamage}
setOpen={setOpen}
mutate={mutate}
/>
)}
</Dialog>
);
};
export default OperatorCreateForm;
"use client";
import { Dialog, IconButton } from "@mui/material";
import CreateFormContent from "./CreateFormContent";
import { format } from "date-fns";
import { CREATE_DAMAGE } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import CloseIcon from "@mui/icons-material/Close";
import { usePermissions } from "@/lib/hooks/usePermissions";
import { useAuth } from "@/lib/contexts/auth";
const OperatorCreateForm = ({ open, setOpen, mutate }) => {
const requestServer = useRequest({ notificationSuccess: true });
const { user } = useAuth();
const { data: userPermissions } = usePermissions();
const hasCreateProvincePermission = userPermissions.some((item) => ["add-receipt"].includes(item));
const SubmitCreateDamage = async (result) => {
const PlateNumber = `${result.plate_part1}-${result.plate_part2}-${result.plate_part3}-${result.plate_part4}`;
const formData = new FormData();
formData.append("accident_date", result.accident_date);
formData.append("accident_time", format(new Date(result.accident_time), "HH:mm"));
formData.append("accident_type", result.accident_type);
formData.append("province_id", result.province_id);
formData.append("city_id", result.city_id);
formData.append("axis_name", result.axis_name);
formData.append("is_foreign", result.isForeign);
if (result.isForeign == "0") {
formData.append("driver_name", result.driver_name);
formData.append("driver_phone_number", result.phone_number);
formData.append("driver_national_code", result.national_code);
formData.append("plaque", PlateNumber);
}
formData.append("damage_picture1", result.damage_picture1);
formData.append("damage_picture2", result.damage_picture2);
formData.append("lat", result.start_point.lat);
formData.append("lng", result.start_point.lng);
result.items_damage.map((item, index) => {
formData.append(`damage_items[${index}][id]`, item.id);
formData.append(`damage_items[${index}][value]`, item.value);
formData.append(`damage_items[${index}][amount]`, item.amount);
});
if (result.radio_button === "report_base") {
formData.append("report_base", 1);
}
if (result.radio_button === "police_file_checkbox") {
formData.append("report_base", 0);
formData.append("police_file", result.police_file);
formData.append("police_file_date", result.police_file_date);
formData.append("police_serial", result.police_serial);
}
await requestServer(`${CREATE_DAMAGE}`, "post", {
data: formData,
})
.then(() => {
mutate();
setOpen(false);
})
.catch(() => {});
};
const defaultData = {
isForeign: "0",
accident_date: "",
accident_time: "",
accident_type: "",
province_id: !hasCreateProvincePermission ? user.province_id : null,
is_province: !hasCreateProvincePermission,
city_id: null,
axis_name: "",
driver_name: "",
phone_number: "",
national_code: "",
plate_part1: "",
plate_part2: "الف",
plate_part3: "",
plate_part4: "",
radio_button: "report_base",
damage_picture1: null,
damage_picture2: null,
report_base: "",
police_file_checkbox: "",
police_file: null,
police_file_date: "",
police_serial: "",
start_point: "",
items_damage: [],
};
return (
<Dialog open={open} fullWidth maxWidth="md">
<IconButton
aria-label="close"
onClick={() => setOpen(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{open && (
<CreateFormContent
defaultData={defaultData}
SubmitDamage={SubmitCreateDamage}
setOpen={setOpen}
mutate={mutate}
/>
)}
</Dialog>
);
};
export default OperatorCreateForm;

76
src/components/dashboard/damages/operator/Actions/create/index.jsx
View File

@@ -1,38 +1,38 @@
"use client";
import { Button, IconButton, useMediaQuery } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import { AddCircle } from "@mui/icons-material";
import OperatorCreateForm from "./Forms";
const OperatorCreate = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت خسارت" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
size={"small"}
variant="contained"
color="primary"
startIcon={<AddCircle />}
onClick={handleOpen}
>
ثبت خسارت
</Button>
)}
<OperatorCreateForm open={open} setOpen={setOpen} mutate={mutate} />
</>
);
};
export default OperatorCreate;
"use client";
import { Button, IconButton, useMediaQuery } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import { AddCircle } from "@mui/icons-material";
import OperatorCreateForm from "./Forms";
const OperatorCreate = ({ mutate }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [open, setOpen] = useState(false);
const handleOpen = () => {
setOpen(true);
};
return (
<>
{isMobile ? (
<IconButton aria-label="ثبت خسارت" color="primary" onClick={handleOpen}>
<AddCircle sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
size={"small"}
variant="contained"
color="primary"
startIcon={<AddCircle />}
onClick={handleOpen}
>
ثبت خسارت
</Button>
)}
<OperatorCreateForm open={open} setOpen={setOpen} mutate={mutate} />
</>
);
};
export default OperatorCreate;

150
src/components/dashboard/damages/operator/ExcelPrint/index.jsx
View File

@@ -1,75 +1,75 @@
"use client";
import { Button, CircularProgress, IconButton, useMediaQuery } from "@mui/material";
import { useMemo, useState } from "react";
import moment from "jalali-moment";
import FileSaver from "file-saver";
import DescriptionIcon from "@mui/icons-material/Description";
import useRequest from "@/lib/hooks/useRequest";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
import { EXPORT_DAMAGES_OPERATOR_LIST } from "@/core/utils/routes";
const PrintExcel = ({ table, filterData }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [loading, setLoading] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
if (filter.value && (!Array.isArray(filter.value) || filter.value.some((item) => item.trim() !== ""))) {
acc.push({ id: key, value: filter.value });
}
return acc;
}, []);
const filterParams = useMemo(() => {
const params = new URLSearchParams();
if (activeFilters.length > 0) {
activeFilters.map((filter, index) => {
const filteredFilterData = DataTableFilterDataStructure(filterData, isArrayEmpty);
params.set("filters", JSON.stringify(filteredFilterData.length === 0 ? [] : filteredFilterData));
});
} else {
params.set("filters", JSON.stringify([]));
}
return params;
}, [activeFilters]);
const clickHandler = () => {
setLoading(true);
requestServer(`${EXPORT_DAMAGES_OPERATOR_LIST}?${filterParams}`, "get", {
requestOptions: { responseType: "blob" },
})
.then((response) => {
const filename = `خروجی کارتابل عملیات فعالیت روزانه تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
FileSaver.saveAs(response.data, filename);
})
.catch(() => {})
.finally(() => {
setLoading(false);
});
};
return (
<>
{isMobile ? (
<IconButton aria-label="خروجی اکسل" color="primary" onClick={clickHandler}>
<DescriptionIcon sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
color="primary"
variant="contained"
size="small"
disabled={loading}
sx={{ textTransform: "unset", alignSelf: "center" }}
startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
onClick={clickHandler}
>
خروجی اکسل
</Button>
)}
</>
);
};
export default PrintExcel;
"use client";
import { Button, CircularProgress, IconButton, useMediaQuery } from "@mui/material";
import { useMemo, useState } from "react";
import moment from "jalali-moment";
import FileSaver from "file-saver";
import DescriptionIcon from "@mui/icons-material/Description";
import useRequest from "@/lib/hooks/useRequest";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
import { EXPORT_DAMAGES_OPERATOR_LIST } from "@/core/utils/routes";
const PrintExcel = ({ table, filterData }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [loading, setLoading] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
if (filter.value && (!Array.isArray(filter.value) || filter.value.some((item) => item.trim() !== ""))) {
acc.push({ id: key, value: filter.value });
}
return acc;
}, []);
const filterParams = useMemo(() => {
const params = new URLSearchParams();
if (activeFilters.length > 0) {
activeFilters.map((filter, index) => {
const filteredFilterData = DataTableFilterDataStructure(filterData, isArrayEmpty);
params.set("filters", JSON.stringify(filteredFilterData.length === 0 ? [] : filteredFilterData));
});
} else {
params.set("filters", JSON.stringify([]));
}
return params;
}, [activeFilters]);
const clickHandler = () => {
setLoading(true);
requestServer(`${EXPORT_DAMAGES_OPERATOR_LIST}?${filterParams}`, "get", {
requestOptions: { responseType: "blob" },
})
.then((response) => {
const filename = `خروجی کارتابل عملیات فعالیت روزانه تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
FileSaver.saveAs(response.data, filename);
})
.catch(() => {})
.finally(() => {
setLoading(false);
});
};
return (
<>
{isMobile ? (
<IconButton aria-label="خروجی اکسل" color="primary" onClick={clickHandler}>
<DescriptionIcon sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
color="primary"
variant="contained"
size="small"
disabled={loading}
sx={{ textTransform: "unset", alignSelf: "center" }}
startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
onClick={clickHandler}
>
خروجی اکسل
</Button>
)}
</>
);
};
export default PrintExcel;

438
src/components/dashboard/damages/operator/Form/CreateFactor/CreateFactorContent.jsx
View File

@@ -1,219 +1,219 @@
import { CHECK_PAYMENT_STATUS, CREATE_FACTOR_DAMAGE, SEND_SMS_AGAIN } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import PaymentIcon from "@mui/icons-material/Payment";
import ReceiptLongIcon from "@mui/icons-material/ReceiptLong";
import RequestQuoteIcon from "@mui/icons-material/RequestQuote";
import WebAssetIcon from "@mui/icons-material/WebAsset";
import {
Alert,
Box,
Button,
Chip,
DialogActions,
DialogContent,
Divider,
Grid,
Stack,
Typography,
} from "@mui/material";
import { useReducer, useState } from "react";
const initialState = {
submittingCreateFactor: false,
submittingCheckFactor: false,
submittingSms: false,
};
const reducer = (state, action) => {
switch (action.type) {
case "SET_SUBMITTING_CREATE_FACTOR":
return { ...state, submittingCreateFactor: action.payload };
case "SET_SUBMITTING_CHECK_FACTOR":
return { ...state, submittingCheckFactor: action.payload };
case "SET_SUBMITTING_SMS":
return { ...state, submittingSms: action.payload };
default:
return state;
}
};
const CreateFactorContent = ({ row, mutate, rowId, setOpenCreateFactorDialog }) => {
const [state, dispatch] = useReducer(reducer, initialState);
const requestServer = useRequest({ notificationSuccess: true });
const [factorCreated, setFactorCreated] = useState(row.original?.status === 3);
const handleCreateFactor = () => {
dispatch({ type: "SET_SUBMITTING_CREATE_FACTOR", payload: true });
requestServer(`${CREATE_FACTOR_DAMAGE}/${rowId}`, "get")
.then(() => {
mutate();
dispatch({ type: "SET_SUBMITTING_CREATE_FACTOR", payload: false });
setFactorCreated(true);
})
.catch(() => {
dispatch({ type: "SET_SUBMITTING_CREATE_FACTOR", payload: false });
});
};
const handleCheckPaymentStatus = () => {
dispatch({ type: "SET_SUBMITTING_CHECK_FACTOR", payload: true });
requestServer(`${CHECK_PAYMENT_STATUS}/${rowId}`, "get")
.then(() => {
setOpenCreateFactorDialog(false);
mutate();
dispatch({ type: "SET_SUBMITTING_CHECK_FACTOR", payload: false });
})
.catch(() => {
dispatch({ type: "SET_SUBMITTING_CHECK_FACTOR", payload: false });
});
};
const handleSendSMS = () => {
dispatch({ type: "SET_SUBMITTING_SMS", payload: true });
requestServer(`${SEND_SMS_AGAIN}/${rowId}`, "get")
.then(() => {
dispatch({ type: "SET_SUBMITTING_SMS", payload: false });
})
.catch(() => {
dispatch({ type: "SET_SUBMITTING_SMS", payload: false });
});
};
return (
<>
<DialogContent dividers>
<Grid container spacing={3} sx={{ alignItems: "center", justifyContent: "space-around" }}>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<RequestQuoteIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مبلغ کل خسارت برآورد شده
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(row.original?.sum / 1).toLocaleString() || "0"} ریال
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<PaymentIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مبلغ کسری بیمه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(row.original?.deposit_insurance_amount / 1).toLocaleString() || "0"} ریال
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<WebAssetIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مبلغ کسری داغی
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(row.original?.deposit_daghi_amount / 1).toLocaleString() || "0"} ریال
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<ReceiptLongIcon />}
label={
<Typography variant="h6" sx={{ fontWeight: 600, color: "primary.main" }}>
مبلغ قابل پرداخت
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="h5" sx={{ fontWeight: 600, color: "primary.main" }}>
{(
row.original?.sum -
(row.original?.deposit_insurance_amount + row.original?.deposit_daghi_amount)
).toLocaleString() || "0"}{" "}
ریال
</Typography>
</Grid>
{!factorCreated && (
<Grid item xs={12}>
<Stack spacing={1}>
<Alert severity="warning">
پس از صدور فاکتور، امکان ویرایش مبالغ بیمه و داغی وجود نخواهد داشت
</Alert>
<Alert severity="info">
لینک پرداخت فاکتور به شماره {row.original?.driver_phone_number} ارسال می شود.
</Alert>
</Stack>
</Grid>
)}
</Grid>
</DialogContent>
<DialogActions>
{factorCreated ? (
<>
<Button
key={"close"}
onClick={() => setOpenCreateFactorDialog(false)}
variant="outlined"
color="secondary"
>
بستن
</Button>
<Button
key={"submittingSms"}
onClick={handleSendSMS}
variant="outlined"
color="warning"
disabled={state.submittingSms}
>
{state.submittingSms ? "درحال ارسال مجدد پیام پرداخت..." : "ارسال مجدد پیام پرداخت"}
</Button>
<Button
key={"submittingCheckFactor"}
onClick={handleCheckPaymentStatus}
variant="contained"
color="primary"
disabled={state.submittingCheckFactor}
>
{state.submittingCheckFactor ? "درحال دریافت اطلاعات..." : "استعلام پرداخت"}
</Button>
</>
) : (
<>
<Button
key={"close"}
onClick={() => setOpenCreateFactorDialog(false)}
variant="outlined"
color="secondary"
>
بستن
</Button>
<Button
key={"submittingCreateFactor"}
onClick={handleCreateFactor}
variant="contained"
color="primary"
disabled={state.submittingCreateFactor}
>
{state.submittingCreateFactor ? "درحال صدور فاکتور..." : "صدور فاکتور"}
</Button>
</>
)}
</DialogActions>
</>
);
};
export default CreateFactorContent;
import { CHECK_PAYMENT_STATUS, CREATE_FACTOR_DAMAGE, SEND_SMS_AGAIN } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import PaymentIcon from "@mui/icons-material/Payment";
import ReceiptLongIcon from "@mui/icons-material/ReceiptLong";
import RequestQuoteIcon from "@mui/icons-material/RequestQuote";
import WebAssetIcon from "@mui/icons-material/WebAsset";
import {
Alert,
Box,
Button,
Chip,
DialogActions,
DialogContent,
Divider,
Grid,
Stack,
Typography,
} from "@mui/material";
import { useReducer, useState } from "react";
const initialState = {
submittingCreateFactor: false,
submittingCheckFactor: false,
submittingSms: false,
};
const reducer = (state, action) => {
switch (action.type) {
case "SET_SUBMITTING_CREATE_FACTOR":
return { ...state, submittingCreateFactor: action.payload };
case "SET_SUBMITTING_CHECK_FACTOR":
return { ...state, submittingCheckFactor: action.payload };
case "SET_SUBMITTING_SMS":
return { ...state, submittingSms: action.payload };
default:
return state;
}
};
const CreateFactorContent = ({ row, mutate, rowId, setOpenCreateFactorDialog }) => {
const [state, dispatch] = useReducer(reducer, initialState);
const requestServer = useRequest({ notificationSuccess: true });
const [factorCreated, setFactorCreated] = useState(row.original?.status === 3);
const handleCreateFactor = () => {
dispatch({ type: "SET_SUBMITTING_CREATE_FACTOR", payload: true });
requestServer(`${CREATE_FACTOR_DAMAGE}/${rowId}`, "get")
.then(() => {
mutate();
dispatch({ type: "SET_SUBMITTING_CREATE_FACTOR", payload: false });
setFactorCreated(true);
})
.catch(() => {
dispatch({ type: "SET_SUBMITTING_CREATE_FACTOR", payload: false });
});
};
const handleCheckPaymentStatus = () => {
dispatch({ type: "SET_SUBMITTING_CHECK_FACTOR", payload: true });
requestServer(`${CHECK_PAYMENT_STATUS}/${rowId}`, "get")
.then(() => {
setOpenCreateFactorDialog(false);
mutate();
dispatch({ type: "SET_SUBMITTING_CHECK_FACTOR", payload: false });
})
.catch(() => {
dispatch({ type: "SET_SUBMITTING_CHECK_FACTOR", payload: false });
});
};
const handleSendSMS = () => {
dispatch({ type: "SET_SUBMITTING_SMS", payload: true });
requestServer(`${SEND_SMS_AGAIN}/${rowId}`, "get")
.then(() => {
dispatch({ type: "SET_SUBMITTING_SMS", payload: false });
})
.catch(() => {
dispatch({ type: "SET_SUBMITTING_SMS", payload: false });
});
};
return (
<>
<DialogContent dividers>
<Grid container spacing={3} sx={{ alignItems: "center", justifyContent: "space-around" }}>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<RequestQuoteIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مبلغ کل خسارت برآورد شده
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(row.original?.sum / 1).toLocaleString() || "0"} ریال
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<PaymentIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مبلغ کسری بیمه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(row.original?.deposit_insurance_amount / 1).toLocaleString() || "0"} ریال
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<WebAssetIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
مبلغ کسری داغی
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{(row.original?.deposit_daghi_amount / 1).toLocaleString() || "0"} ریال
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<ReceiptLongIcon />}
label={
<Typography variant="h6" sx={{ fontWeight: 600, color: "primary.main" }}>
مبلغ قابل پرداخت
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="h5" sx={{ fontWeight: 600, color: "primary.main" }}>
{(
row.original?.sum -
(row.original?.deposit_insurance_amount + row.original?.deposit_daghi_amount)
).toLocaleString() || "0"}{" "}
ریال
</Typography>
</Grid>
{!factorCreated && (
<Grid item xs={12}>
<Stack spacing={1}>
<Alert severity="warning">
پس از صدور فاکتور، امکان ویرایش مبالغ بیمه و داغی وجود نخواهد داشت
</Alert>
<Alert severity="info">
لینک پرداخت فاکتور به شماره {row.original?.driver_phone_number} ارسال می شود.
</Alert>
</Stack>
</Grid>
)}
</Grid>
</DialogContent>
<DialogActions>
{factorCreated ? (
<>
<Button
key={"close"}
onClick={() => setOpenCreateFactorDialog(false)}
variant="outlined"
color="secondary"
>
بستن
</Button>
<Button
key={"submittingSms"}
onClick={handleSendSMS}
variant="outlined"
color="warning"
disabled={state.submittingSms}
>
{state.submittingSms ? "درحال ارسال مجدد پیام پرداخت..." : "ارسال مجدد پیام پرداخت"}
</Button>
<Button
key={"submittingCheckFactor"}
onClick={handleCheckPaymentStatus}
variant="contained"
color="primary"
disabled={state.submittingCheckFactor}
>
{state.submittingCheckFactor ? "درحال دریافت اطلاعات..." : "استعلام پرداخت"}
</Button>
</>
) : (
<>
<Button
key={"close"}
onClick={() => setOpenCreateFactorDialog(false)}
variant="outlined"
color="secondary"
>
بستن
</Button>
<Button
key={"submittingCreateFactor"}
onClick={handleCreateFactor}
variant="contained"
color="primary"
disabled={state.submittingCreateFactor}
>
{state.submittingCreateFactor ? "درحال صدور فاکتور..." : "صدور فاکتور"}
</Button>
</>
)}
</DialogActions>
</>
);
};
export default CreateFactorContent;

86
src/components/dashboard/damages/operator/Form/CreateFactor/index.jsx
View File

@@ -1,43 +1,43 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ReceiptLongIcon from "@mui/icons-material/ReceiptLong";
import CreateFactorContent from "./CreateFactorContent";
const CreateFactor = ({ row, rowId, mutate }) => {
const [openCreateFactorDialog, setOpenCreateFactorDialog] = useState(false);
return (
<>
<Tooltip title={row.original?.status == 2 ? "صدور فاکتور" : "استعلام پرداخت"}>
<IconButton color="primary" onClick={() => setOpenCreateFactorDialog(true)}>
<ReceiptLongIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openCreateFactorDialog}
onClose={() => setOpenCreateFactorDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"sm"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>
{row.original?.status == 2 ? "صدور فاکتور" : "استعلام پرداخت"}
</DialogTitle>
{openCreateFactorDialog && (
<CreateFactorContent
setOpenCreateFactorDialog={setOpenCreateFactorDialog}
rowId={rowId}
mutate={mutate}
row={row}
/>
)}
</Dialog>
</>
);
};
export default CreateFactor;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ReceiptLongIcon from "@mui/icons-material/ReceiptLong";
import CreateFactorContent from "./CreateFactorContent";
const CreateFactor = ({ row, rowId, mutate }) => {
const [openCreateFactorDialog, setOpenCreateFactorDialog] = useState(false);
return (
<>
<Tooltip title={row.original?.status == 2 ? "صدور فاکتور" : "استعلام پرداخت"}>
<IconButton color="primary" onClick={() => setOpenCreateFactorDialog(true)}>
<ReceiptLongIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openCreateFactorDialog}
onClose={() => setOpenCreateFactorDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"sm"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>
{row.original?.status == 2 ? "صدور فاکتور" : "استعلام پرداخت"}
</DialogTitle>
{openCreateFactorDialog && (
<CreateFactorContent
setOpenCreateFactorDialog={setOpenCreateFactorDialog}
rowId={rowId}
mutate={mutate}
row={row}
/>
)}
</Dialog>
</>
);
};
export default CreateFactor;

246
src/components/dashboard/damages/operator/Form/EditForm/EditController.jsx
View File

@@ -1,123 +1,123 @@
import useRequest from "@/lib/hooks/useRequest";
import CreateFormContent from "@/components/dashboard/damages/operator/Actions/create/Forms/CreateFormContent";
import { useEffect, useState } from "react";
import { GET_DAMAGE_ITEM_DETAILS, UPDATE_DAMAGE_ITEM } from "@/core/utils/routes";
import DialogLoading from "@/core/components/DialogLoading";
import { format } from "date-fns";
import moment from "jalali-moment";
import { useAuth } from "@/lib/contexts/auth";
import { usePermissions } from "@/lib/hooks/usePermissions";
const EditController = ({ rowId, mutate, setOpenEditDialog }) => {
const requestServer = useRequest();
const [damageItemDetails, setDamageItemDetails] = useState(null);
const [damageItemDetailsLoading, setDamageItemDetailsLoading] = useState(false);
const { user } = useAuth();
const { data: userPermissions } = usePermissions();
const hasCreateProvincePermission = userPermissions.some((item) => ["add-receipt"].includes(item));
useEffect(() => {
setDamageItemDetailsLoading(true);
requestServer(`${GET_DAMAGE_ITEM_DETAILS}/${rowId}`, "get")
.then((response) => {
setDamageItemDetails(response.data.data);
setDamageItemDetailsLoading(false);
})
.catch((e) => {
setDamageItemDetailsLoading(false);
});
}, [rowId]);
const today = new Date().toISOString().split("T")[0];
const plaqueNumber = damageItemDetails?.is_foreign == 0 ? damageItemDetails?.plaque.split("-") || [] : [];
const defaultData = {
isForeign: String(damageItemDetails?.is_foreign),
damage_picture1: damageItemDetails?.damage_picture1 || null,
damage_picture2: damageItemDetails?.damage_picture2 || null,
accident_date: new Date(damageItemDetails?.accident_date) || "",
accident_time: new Date(`${today} ${damageItemDetails?.accident_time || ""}`),
accident_type: damageItemDetails?.accident_type || "",
axis_name: damageItemDetails?.axis_name || "",
driver_name: damageItemDetails?.driver_name || "",
police_file: damageItemDetails?.police_file || null,
police_file_date: damageItemDetails?.police_file_date || "",
police_serial: damageItemDetails?.police_serial || "",
items_damage: damageItemDetails?.damages || [],
phone_number: damageItemDetails?.driver_phone_number || "",
national_code: damageItemDetails?.driver_national_code || "",
plate_part1: plaqueNumber[0] || "",
plate_part2: plaqueNumber[1] || "",
plate_part3: plaqueNumber[2] || "",
plate_part4: plaqueNumber[3] || "",
radio_button: damageItemDetails?.report_base === 1 ? "report_base" : "police_file_checkbox",
report_base: damageItemDetails?.report_base,
province_id: damageItemDetails?.province_id || null,
is_province: !hasCreateProvincePermission,
city_id: damageItemDetails?.city_id || null,
start_point: { lat: damageItemDetails?.lat || "", lng: damageItemDetails?.lng || "" },
};
const HandleSubmit = async (result) => {
const PlateNumber = `${result.plate_part1}-${result.plate_part2}-${result.plate_part3}-${result.plate_part4}`;
const formData = new FormData();
const accidentDate =
result.accident_date == defaultData.accident_date
? moment(result.accident_date).locale("en").format("YYYY-MM-DD")
: result.accident_date;
formData.append("accident_date", accidentDate);
formData.append("accident_time", format(new Date(result.accident_time), "HH:mm"));
formData.append("accident_type", result.accident_type);
formData.append("province_id", result.province_id);
formData.append("city_id", result.city_id);
formData.append("axis_name", result.axis_name);
formData.append("is_foreign", result.isForeign);
if (result.isForeign == "0") {
formData.append("driver_name", result.driver_name);
formData.append("driver_phone_number", result.phone_number);
formData.append("driver_national_code", result.national_code);
formData.append("plaque", PlateNumber);
}
result.damage_picture1 !== defaultData.damage_picture1 &&
formData.append("damage_picture1", result.damage_picture1);
result.damage_picture2 !== defaultData.damage_picture2 &&
formData.append("damage_picture2", result.damage_picture2);
formData.append("lat", result.start_point.lat);
formData.append("lng", result.start_point.lng);
result.items_damage.map((item, index) => {
formData.append(`damage_items[${index}][id]`, item.id);
formData.append(`damage_items[${index}][value]`, item.value);
formData.append(`damage_items[${index}][amount]`, item.amount);
});
if (result.radio_button === "report_base") {
formData.append("report_base", 1);
}
if (result.radio_button === "police_file_checkbox") {
formData.append("report_base", 0);
result.police_file !== defaultData.police_file && formData.append("police_file", result.police_file);
formData.append("police_file_date", result.police_file_date);
formData.append("police_serial", result.police_serial);
}
await requestServer(`${UPDATE_DAMAGE_ITEM}/${rowId}`, "post", {
data: formData,
})
.then(() => {
mutate();
setOpenEditDialog(false);
})
.catch(() => {});
};
return (
<>
{damageItemDetailsLoading ? (
<DialogLoading />
) : (
<CreateFormContent
setOpen={setOpenEditDialog}
SubmitDamage={HandleSubmit}
defaultData={defaultData}
mutate={mutate}
/>
)}
</>
);
};
export default EditController;
import useRequest from "@/lib/hooks/useRequest";
import CreateFormContent from "@/components/dashboard/damages/operator/Actions/create/Forms/CreateFormContent";
import { useEffect, useState } from "react";
import { GET_DAMAGE_ITEM_DETAILS, UPDATE_DAMAGE_ITEM } from "@/core/utils/routes";
import DialogLoading from "@/core/components/DialogLoading";
import { format } from "date-fns";
import moment from "jalali-moment";
import { useAuth } from "@/lib/contexts/auth";
import { usePermissions } from "@/lib/hooks/usePermissions";
const EditController = ({ rowId, mutate, setOpenEditDialog }) => {
const requestServer = useRequest();
const [damageItemDetails, setDamageItemDetails] = useState(null);
const [damageItemDetailsLoading, setDamageItemDetailsLoading] = useState(false);
const { user } = useAuth();
const { data: userPermissions } = usePermissions();
const hasCreateProvincePermission = userPermissions.some((item) => ["add-receipt"].includes(item));
useEffect(() => {
setDamageItemDetailsLoading(true);
requestServer(`${GET_DAMAGE_ITEM_DETAILS}/${rowId}`, "get")
.then((response) => {
setDamageItemDetails(response.data.data);
setDamageItemDetailsLoading(false);
})
.catch((e) => {
setDamageItemDetailsLoading(false);
});
}, [rowId]);
const today = new Date().toISOString().split("T")[0];
const plaqueNumber = damageItemDetails?.is_foreign == 0 ? damageItemDetails?.plaque.split("-") || [] : [];
const defaultData = {
isForeign: String(damageItemDetails?.is_foreign),
damage_picture1: damageItemDetails?.damage_picture1 || null,
damage_picture2: damageItemDetails?.damage_picture2 || null,
accident_date: new Date(damageItemDetails?.accident_date) || "",
accident_time: new Date(`${today} ${damageItemDetails?.accident_time || ""}`),
accident_type: damageItemDetails?.accident_type || "",
axis_name: damageItemDetails?.axis_name || "",
driver_name: damageItemDetails?.driver_name || "",
police_file: damageItemDetails?.police_file || null,
police_file_date: damageItemDetails?.police_file_date || "",
police_serial: damageItemDetails?.police_serial || "",
items_damage: damageItemDetails?.damages || [],
phone_number: damageItemDetails?.driver_phone_number || "",
national_code: damageItemDetails?.driver_national_code || "",
plate_part1: plaqueNumber[0] || "",
plate_part2: plaqueNumber[1] || "",
plate_part3: plaqueNumber[2] || "",
plate_part4: plaqueNumber[3] || "",
radio_button: damageItemDetails?.report_base === 1 ? "report_base" : "police_file_checkbox",
report_base: damageItemDetails?.report_base,
province_id: damageItemDetails?.province_id || null,
is_province: !hasCreateProvincePermission,
city_id: damageItemDetails?.city_id || null,
start_point: { lat: damageItemDetails?.lat || "", lng: damageItemDetails?.lng || "" },
};
const HandleSubmit = async (result) => {
const PlateNumber = `${result.plate_part1}-${result.plate_part2}-${result.plate_part3}-${result.plate_part4}`;
const formData = new FormData();
const accidentDate =
result.accident_date == defaultData.accident_date
? moment(result.accident_date).locale("en").format("YYYY-MM-DD")
: result.accident_date;
formData.append("accident_date", accidentDate);
formData.append("accident_time", format(new Date(result.accident_time), "HH:mm"));
formData.append("accident_type", result.accident_type);
formData.append("province_id", result.province_id);
formData.append("city_id", result.city_id);
formData.append("axis_name", result.axis_name);
formData.append("is_foreign", result.isForeign);
if (result.isForeign == "0") {
formData.append("driver_name", result.driver_name);
formData.append("driver_phone_number", result.phone_number);
formData.append("driver_national_code", result.national_code);
formData.append("plaque", PlateNumber);
}
result.damage_picture1 !== defaultData.damage_picture1 &&
formData.append("damage_picture1", result.damage_picture1);
result.damage_picture2 !== defaultData.damage_picture2 &&
formData.append("damage_picture2", result.damage_picture2);
formData.append("lat", result.start_point.lat);
formData.append("lng", result.start_point.lng);
result.items_damage.map((item, index) => {
formData.append(`damage_items[${index}][id]`, item.id);
formData.append(`damage_items[${index}][value]`, item.value);
formData.append(`damage_items[${index}][amount]`, item.amount);
});
if (result.radio_button === "report_base") {
formData.append("report_base", 1);
}
if (result.radio_button === "police_file_checkbox") {
formData.append("report_base", 0);
result.police_file !== defaultData.police_file && formData.append("police_file", result.police_file);
formData.append("police_file_date", result.police_file_date);
formData.append("police_serial", result.police_serial);
}
await requestServer(`${UPDATE_DAMAGE_ITEM}/${rowId}`, "post", {
data: formData,
})
.then(() => {
mutate();
setOpenEditDialog(false);
})
.catch(() => {});
};
return (
<>
{damageItemDetailsLoading ? (
<DialogLoading />
) : (
<CreateFormContent
setOpen={setOpenEditDialog}
SubmitDamage={HandleSubmit}
defaultData={defaultData}
mutate={mutate}
/>
)}
</>
);
};
export default EditController;

118
src/components/dashboard/damages/operator/Form/EditForm/index.jsx
View File

@@ -1,59 +1,59 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import BorderColorIcon from "@mui/icons-material/BorderColor";
import EditController from "./EditController";
import CloseIcon from "@mui/icons-material/Close";
const EditForm = ({ row, mutate, rowId }) => {
const [openEditDialog, setOpenEditDialog] = useState(false);
return (
<>
<Tooltip title="ویرایش اطلاعات" arrow placement="right">
<IconButton
color="primary"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenEditDialog(true);
}}
>
<BorderColorIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="md"
fullWidth
open={openEditDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<IconButton
aria-label="close"
onClick={() => setOpenEditDialog(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{openEditDialog && (
<EditController
openEditDialog={openEditDialog}
setOpenEditDialog={setOpenEditDialog}
rowId={rowId}
row={row}
mutate={mutate}
/>
)}
</Dialog>
</>
);
};
export default EditForm;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import BorderColorIcon from "@mui/icons-material/BorderColor";
import EditController from "./EditController";
import CloseIcon from "@mui/icons-material/Close";
const EditForm = ({ row, mutate, rowId }) => {
const [openEditDialog, setOpenEditDialog] = useState(false);
return (
<>
<Tooltip title="ویرایش اطلاعات" arrow placement="right">
<IconButton
color="primary"
sx={{ textTransform: "unset", alignSelf: "center" }}
onClick={() => {
setOpenEditDialog(true);
}}
>
<BorderColorIcon />
</IconButton>
</Tooltip>
<Dialog
maxWidth="md"
fullWidth
open={openEditDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
>
<IconButton
aria-label="close"
onClick={() => setOpenEditDialog(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{openEditDialog && (
<EditController
openEditDialog={openEditDialog}
setOpenEditDialog={setOpenEditDialog}
rowId={rowId}
row={row}
mutate={mutate}
/>
)}
</Dialog>
</>
);
};
export default EditForm;

96
src/components/dashboard/damages/operator/Form/RegisterInsurance/DaghiFile.jsx
View File

@@ -1,48 +1,48 @@
import { Grid, Stack, TextField } from "@mui/material";
import { Controller } from "react-hook-form";
import ImageUpload from "./ImageUpload";
import NumberField from "@/core/components/NumberField";
const DaghiFile = ({ control }) => {
return (
<Stack spacing={3} mt={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="deposit_daghi_amount"
control={control}
render={({ field, fieldState: { error } }) => (
<NumberField
{...field}
value={field.value || ""}
label="مبلغ داغی (ریال)"
variant="outlined"
placeholder="مبلغ داغی را وارد کنید"
fullWidth
size="small"
error={error}
helperText={error && error.message}
/>
)}
/>
</Grid>
</Grid>
</Stack>
<Controller
name="deposit_daghi_image"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
title={"تصویر صورتجلسه تحویل داغی به انبار"}
onChange={field.onChange}
/>
)}
/>
</Stack>
);
};
export default DaghiFile;
import { Grid, Stack, TextField } from "@mui/material";
import { Controller } from "react-hook-form";
import ImageUpload from "./ImageUpload";
import NumberField from "@/core/components/NumberField";
const DaghiFile = ({ control }) => {
return (
<Stack spacing={3} mt={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="deposit_daghi_amount"
control={control}
render={({ field, fieldState: { error } }) => (
<NumberField
{...field}
value={field.value || ""}
label="مبلغ داغی (ریال)"
variant="outlined"
placeholder="مبلغ داغی را وارد کنید"
fullWidth
size="small"
error={error}
helperText={error && error.message}
/>
)}
/>
</Grid>
</Grid>
</Stack>
<Controller
name="deposit_daghi_image"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
title={"تصویر صورتجلسه تحویل داغی به انبار"}
onChange={field.onChange}
/>
)}
/>
</Stack>
);
};
export default DaghiFile;

106
src/components/dashboard/damages/operator/Form/RegisterInsurance/DaghiPayment.jsx
View File

@@ -1,53 +1,53 @@
import { useState } from "react";
import { FormControlLabel, RadioGroup, Stack } from "@mui/material";
import { Controller, useWatch } from "react-hook-form";
import Radio from "@mui/material/Radio";
import DaghiFile from "./DaghiFile";
const DaghiPayment = ({ control }) => {
const watchedStatus = useWatch({ control, name: "deposit_daghi_status" });
const [selectedOption, setSelectedOption] = useState(watchedStatus || null);
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
return (
<>
<RadioGroup
aria-label="file-options"
name="file-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
value="no_daghi"
control={
<Controller
control={control}
name="deposit_daghi_status"
render={({ field }) => <Radio {...field} value="no_daghi" />}
/>
}
label="صورتجلسه تحویل داغی به انبار ندارد"
/>
<FormControlLabel
value="has_daghi"
control={
<Controller
control={control}
name="deposit_daghi_status"
render={({ field }) => <Radio {...field} value="has_daghi" />}
/>
}
label="صورتجلسه تحویل داغی به انبار دارد"
/>
</Stack>
</RadioGroup>
{selectedOption === "has_daghi" && <DaghiFile control={control} />}
</>
);
};
export default DaghiPayment;
import { useState } from "react";
import { FormControlLabel, RadioGroup, Stack } from "@mui/material";
import { Controller, useWatch } from "react-hook-form";
import Radio from "@mui/material/Radio";
import DaghiFile from "./DaghiFile";
const DaghiPayment = ({ control }) => {
const watchedStatus = useWatch({ control, name: "deposit_daghi_status" });
const [selectedOption, setSelectedOption] = useState(watchedStatus || null);
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
return (
<>
<RadioGroup
aria-label="file-options"
name="file-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
value="no_daghi"
control={
<Controller
control={control}
name="deposit_daghi_status"
render={({ field }) => <Radio {...field} value="no_daghi" />}
/>
}
label="صورتجلسه تحویل داغی به انبار ندارد"
/>
<FormControlLabel
value="has_daghi"
control={
<Controller
control={control}
name="deposit_daghi_status"
render={({ field }) => <Radio {...field} value="has_daghi" />}
/>
}
label="صورتجلسه تحویل داغی به انبار دارد"
/>
</Stack>
</RadioGroup>
{selectedOption === "has_daghi" && <DaghiFile control={control} />}
</>
);
};
export default DaghiPayment;

154
src/components/dashboard/damages/operator/Form/RegisterInsurance/ImageUpload.jsx
View File

@@ -1,77 +1,77 @@
import { FormControl, FormHelperText } from "@mui/material";
import UploadSystem from "@/core/components/UploadSystem";
import React, { useEffect, useState } from "react";
const ImageUpload = ({ name, value, onChange, error, beforeImage = null, title }) => {
const [beforeImg, setBeforeImg] = useState(beforeImage ? beforeImage : null);
const [beforeFileType, setBeforeFileType] = useState(beforeImage ? "image/" : null);
const [beforeFileName, setBeforeFileName] = useState(null);
const [showBeforeImage, setShowBeforeImage] = useState(!beforeImage);
useEffect(() => {
if (value) {
setShowBeforeImage(false);
if (typeof value === "string") {
setBeforeImg(value);
setBeforeFileType("image/");
} else if (value instanceof File) {
setBeforeImg(URL.createObjectURL(value));
setBeforeFileType(value.type);
}
}
}, [value]);
const handleFileChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setBeforeImg(URL.createObjectURL(uploadedFile));
setBeforeFileType(fileType);
setBeforeFileName(fileName);
onChange(uploadedFile);
setShowBeforeImage(false);
}
};
return (
<FormControl
error={error}
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
}}
>
<FormHelperText
sx={{
fontSize: 14,
border: 1,
borderBottom: 0,
borderColor: "divider",
px: 2,
py: 1,
borderRadius: 2,
borderBottomRightRadius: 0,
borderBottomLeftRadius: 0,
}}
id={name}
>
{title}
</FormHelperText>
<UploadSystem
selectedImage={beforeImg}
handleUploadChange={handleFileChange}
fileType={beforeFileType}
fileName={beforeFileName}
setSelectedImage={setBeforeImg}
imageSize={[250, 150]}
setShowAddIcon={setShowBeforeImage}
showAddIcon={showBeforeImage}
/>
<FormHelperText id={name}>{error ? error.message : null}</FormHelperText>
</FormControl>
);
};
export default ImageUpload;
import { FormControl, FormHelperText } from "@mui/material";
import UploadSystem from "@/core/components/UploadSystem";
import React, { useEffect, useState } from "react";
const ImageUpload = ({ name, value, onChange, error, beforeImage = null, title }) => {
const [beforeImg, setBeforeImg] = useState(beforeImage ? beforeImage : null);
const [beforeFileType, setBeforeFileType] = useState(beforeImage ? "image/" : null);
const [beforeFileName, setBeforeFileName] = useState(null);
const [showBeforeImage, setShowBeforeImage] = useState(!beforeImage);
useEffect(() => {
if (value) {
setShowBeforeImage(false);
if (typeof value === "string") {
setBeforeImg(value);
setBeforeFileType("image/");
} else if (value instanceof File) {
setBeforeImg(URL.createObjectURL(value));
setBeforeFileType(value.type);
}
}
}, [value]);
const handleFileChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setBeforeImg(URL.createObjectURL(uploadedFile));
setBeforeFileType(fileType);
setBeforeFileName(fileName);
onChange(uploadedFile);
setShowBeforeImage(false);
}
};
return (
<FormControl
error={error}
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
}}
>
<FormHelperText
sx={{
fontSize: 14,
border: 1,
borderBottom: 0,
borderColor: "divider",
px: 2,
py: 1,
borderRadius: 2,
borderBottomRightRadius: 0,
borderBottomLeftRadius: 0,
}}
id={name}
>
{title}
</FormHelperText>
<UploadSystem
selectedImage={beforeImg}
handleUploadChange={handleFileChange}
fileType={beforeFileType}
fileName={beforeFileName}
setSelectedImage={setBeforeImg}
imageSize={[250, 150]}
setShowAddIcon={setShowBeforeImage}
showAddIcon={showBeforeImage}
/>
<FormHelperText id={name}>{error ? error.message : null}</FormHelperText>
</FormControl>
);
};
export default ImageUpload;

96
src/components/dashboard/damages/operator/Form/RegisterInsurance/InsuranceFile.jsx
View File

@@ -1,48 +1,48 @@
import NumberField from "@/core/components/NumberField";
import { Grid, Stack } from "@mui/material";
import { Controller } from "react-hook-form";
import ImageUpload from "./ImageUpload";
const InsuranceFile = ({ control }) => {
return (
<Stack spacing={3} mt={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="deposit_insurance_amount"
control={control}
render={({ field, fieldState: { error } }) => (
<NumberField
{...field}
value={field.value || ""}
label="مبلغ بیمه (ریال)"
variant="outlined"
fullWidth
size="small"
placeholder="مبلغ بیمه را وارد کنید"
error={error}
helperText={error && error.message}
/>
)}
/>
</Grid>
</Grid>
</Stack>
<Controller
name="deposit_insurance_image"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
title={"تصویر فیش واریزی بیمه"}
onChange={field.onChange}
/>
)}
/>
</Stack>
);
};
export default InsuranceFile;
import NumberField from "@/core/components/NumberField";
import { Grid, Stack } from "@mui/material";
import { Controller } from "react-hook-form";
import ImageUpload from "./ImageUpload";
const InsuranceFile = ({ control }) => {
return (
<Stack spacing={3} mt={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="deposit_insurance_amount"
control={control}
render={({ field, fieldState: { error } }) => (
<NumberField
{...field}
value={field.value || ""}
label="مبلغ بیمه (ریال)"
variant="outlined"
fullWidth
size="small"
placeholder="مبلغ بیمه را وارد کنید"
error={error}
helperText={error && error.message}
/>
)}
/>
</Grid>
</Grid>
</Stack>
<Controller
name="deposit_insurance_image"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
title={"تصویر فیش واریزی بیمه"}
onChange={field.onChange}
/>
)}
/>
</Stack>
);
};
export default InsuranceFile;

104
src/components/dashboard/damages/operator/Form/RegisterInsurance/InsurancePayment.jsx
View File

@@ -1,52 +1,52 @@
import { FormControlLabel, FormHelperText, RadioGroup, Stack } from "@mui/material";
import { Controller, useWatch } from "react-hook-form";
import Radio from "@mui/material/Radio";
import { useState } from "react";
import InsuranceFile from "./InsuranceFile";
const InsurancePayment = ({ control }) => {
const watchedStatus = useWatch({ control, name: "deposit_insurance_status" });
const [selectedOption, setSelectedOption] = useState(watchedStatus || null);
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
return (
<>
<RadioGroup
aria-label="file-options"
name="file-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
value="no_insurance"
control={
<Controller
control={control}
name="deposit_insurance_status"
render={({ field }) => <Radio {...field} value="no_insurance" />}
/>
}
label="فیش واریزی (بیمه) ندارد"
/>
<FormControlLabel
value="has_insurance"
control={
<Controller
control={control}
name="deposit_insurance_status"
render={({ field }) => <Radio {...field} value="has_insurance" />}
/>
}
label="فیش واریزی (بیمه) دارد"
/>
</Stack>
</RadioGroup>
{selectedOption === "has_insurance" && <InsuranceFile control={control} />}
</>
);
};
export default InsurancePayment;
import { FormControlLabel, FormHelperText, RadioGroup, Stack } from "@mui/material";
import { Controller, useWatch } from "react-hook-form";
import Radio from "@mui/material/Radio";
import { useState } from "react";
import InsuranceFile from "./InsuranceFile";
const InsurancePayment = ({ control }) => {
const watchedStatus = useWatch({ control, name: "deposit_insurance_status" });
const [selectedOption, setSelectedOption] = useState(watchedStatus || null);
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
return (
<>
<RadioGroup
aria-label="file-options"
name="file-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
value="no_insurance"
control={
<Controller
control={control}
name="deposit_insurance_status"
render={({ field }) => <Radio {...field} value="no_insurance" />}
/>
}
label="فیش واریزی (بیمه) ندارد"
/>
<FormControlLabel
value="has_insurance"
control={
<Controller
control={control}
name="deposit_insurance_status"
render={({ field }) => <Radio {...field} value="has_insurance" />}
/>
}
label="فیش واریزی (بیمه) دارد"
/>
</Stack>
</RadioGroup>
{selectedOption === "has_insurance" && <InsuranceFile control={control} />}
</>
);
};
export default InsurancePayment;

406
src/components/dashboard/damages/operator/Form/RegisterInsurance/RegisterInsuranceContent.jsx
View File

@@ -1,203 +1,203 @@
import { Box, Button, DialogActions, DialogContent, Tab, Tabs, Typography } from "@mui/material";
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
import LocalPostOfficeIcon from "@mui/icons-material/LocalPostOffice";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import StyledForm from "@/core/components/StyledForm";
import PaymentIcon from "@mui/icons-material/Payment";
import React, { useState } from "react";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import { mixed, object, string } from "yup";
import InsurancePayment from "./InsurancePayment";
import DaghiPayment from "./DaghiPayment";
import { CONFIRM_PAYMENT_INFO } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
function TabPanel(props) {
const { children, value, index } = props;
return (
<div role="tabpanel" hidden={value !== index}>
{value === index && <Box>{children}</Box>}
</div>
);
}
const validationSchema = object({
deposit_insurance_status: string().required("انتخاب یک گزینه الزامیست."),
deposit_daghi_status: string().required("انتخاب یک گزینه الزامیست."),
deposit_insurance_amount: string().when("deposit_insurance_status", {
is: "has_insurance",
then: (schema) => schema.required("مبلغ بیمه الزامی است."),
otherwise: (schema) => schema.notRequired(),
}),
deposit_insurance_image: mixed().when("deposit_insurance_status", {
is: "has_insurance",
then: (schema) => schema.required("تصویر فیش واریزی بیمه الزامی است."),
otherwise: (schema) => schema.notRequired(),
}),
deposit_daghi_amount: string()
.when("deposit_daghi_status", {
is: "has_daghi",
then: (schema) => schema.required("مبلغ داغی الزامی است."),
otherwise: (schema) => schema.notRequired(),
})
.test("max-percentage", "مبلغ داغی نباید بیشتر از ۳۰ درصد مبلغ کل خسارت باشد.", function (value) {
const sum = this.options.context.sum || 0;
if (!value || isNaN(value) || !sum) return true;
return parseFloat(value) <= sum * 0.3;
}),
deposit_daghi_image: mixed().when("deposit_daghi_status", {
is: "has_daghi",
then: (schema) => schema.required("تصویر صورتجلسه تحویل داغی به انبار الزامی است."),
otherwise: (schema) => schema.notRequired(),
}),
}).test("total-amount-limit", "مجموع مبلغ بیمه و داغی نباید از کل مبلغ خسارت بیشتر باشد.", function (values) {
const sum = this.options.context.sum || 0;
const depositInsuranceAmount = parseFloat(values.deposit_insurance_amount) || 0;
const depositDaghiAmount = parseFloat(values.deposit_daghi_amount) || 0;
return depositInsuranceAmount + depositDaghiAmount <= sum;
});
const RegisterInsuranceContent = ({ setOpenRegisterInsuranceDialog, row, mutate, rowId }) => {
const [tabState, setTabState] = useState(0);
const requestServer = useRequest({ notificationSuccess: true });
const handleClose = () => setOpenRegisterInsuranceDialog(false);
const handleChangeTab = (event, newValue) => setTabState(newValue);
const defaultValues = {
deposit_insurance_status: "no_insurance",
deposit_insurance_amount: "",
deposit_insurance_image: null,
deposit_daghi_status: "no_daghi",
deposit_daghi_amount: "",
deposit_daghi_image: null,
};
const handlePrev = () => {
if (tabState === 0) {
handleClose();
} else {
setTabState(tabState - 1);
}
};
const handleNext = async () => {
let fieldsToValidate = [];
if (tabState === 0) {
fieldsToValidate = ["deposit_insurance_status", "deposit_insurance_amount", "deposit_insurance_image"];
}
if (tabState === 1) {
fieldsToValidate = ["deposit_daghi_status", "deposit_daghi_amount", "deposit_daghi_image"];
}
const isValid = await trigger(fieldsToValidate);
if (isValid) {
setTabState(tabState + 1);
}
};
const {
control,
handleSubmit,
trigger,
formState: { isSubmitting, errors },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
context: { sum: row?.original?.sum },
});
const onSubmitBase = async (data) => {
const formData = new FormData();
const depositDaghiStatus = data.deposit_daghi_status === "no_daghi" ? 0 : 1;
const depositInsuranceStatus = data.deposit_insurance_status === "no_insurance" ? 0 : 1;
if (data.deposit_daghi_status === "has_daghi") {
formData.append("deposit_daghi_status", depositDaghiStatus);
formData.append("deposit_daghi_amount", data.deposit_daghi_amount);
formData.append("deposit_daghi_image", data.deposit_daghi_image);
}
if (data.deposit_insurance_status === "has_insurance") {
formData.append("deposit_insurance_status", depositInsuranceStatus);
formData.append("deposit_insurance_amount", data.deposit_insurance_amount);
formData.append("deposit_insurance_image", data.deposit_insurance_image);
}
try {
await requestServer(`${CONFIRM_PAYMENT_INFO}/${rowId}`, "post", {
data: formData,
});
mutate();
setOpenRegisterInsuranceDialog(false);
} catch (error) {}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmitBase)}>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant="fullWidth"
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab icon={<PaymentIcon />} label="فیش واریزی بیمه" />
<Tab disabled={tabState === 0} icon={<LocalPostOfficeIcon />} label="صورتجلسه تحویل داغی به انبار" />
</Tabs>
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
<Box sx={{ flex: 1 }}>
<TabPanel value={tabState} index={0}>
<InsurancePayment control={control} />
</TabPanel>
<TabPanel value={tabState} index={1}>
<DaghiPayment control={control} />
</TabPanel>
</Box>
</DialogContent>
{errors[""]?.message && (
<Typography textAlign={"center"} color={"error.main"} sx={{ mt: 2 }}>
{errors[""].message}
</Typography>
)}
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
variant="outlined"
color="secondary"
size="large"
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
>
{tabState === 0 ? "بستن" : "مرحله قبل"}
</Button>
{tabState !== 1 && (
<Button
type="button"
onClick={handleNext}
variant="contained"
key={"handleNext"}
size="large"
endIcon={<KeyboardDoubleArrowLeftIcon />}
>
مرحله بعد
</Button>
)}
{tabState === 1 && (
<Button
type={"submit"}
variant="contained"
size="large"
disabled={isSubmitting}
key={"submit"}
endIcon={<BeenhereIcon />}
>
{isSubmitting ? "در حال ثبت" : "ثبت"}
</Button>
)}
</DialogActions>
</StyledForm>
);
};
export default RegisterInsuranceContent;
import { Box, Button, DialogActions, DialogContent, Tab, Tabs, Typography } from "@mui/material";
import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import KeyboardDoubleArrowRightIcon from "@mui/icons-material/KeyboardDoubleArrowRight";
import KeyboardDoubleArrowLeftIcon from "@mui/icons-material/KeyboardDoubleArrowLeft";
import LocalPostOfficeIcon from "@mui/icons-material/LocalPostOffice";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import StyledForm from "@/core/components/StyledForm";
import PaymentIcon from "@mui/icons-material/Payment";
import React, { useState } from "react";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import { mixed, object, string } from "yup";
import InsurancePayment from "./InsurancePayment";
import DaghiPayment from "./DaghiPayment";
import { CONFIRM_PAYMENT_INFO } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
function TabPanel(props) {
const { children, value, index } = props;
return (
<div role="tabpanel" hidden={value !== index}>
{value === index && <Box>{children}</Box>}
</div>
);
}
const validationSchema = object({
deposit_insurance_status: string().required("انتخاب یک گزینه الزامیست."),
deposit_daghi_status: string().required("انتخاب یک گزینه الزامیست."),
deposit_insurance_amount: string().when("deposit_insurance_status", {
is: "has_insurance",
then: (schema) => schema.required("مبلغ بیمه الزامی است."),
otherwise: (schema) => schema.notRequired(),
}),
deposit_insurance_image: mixed().when("deposit_insurance_status", {
is: "has_insurance",
then: (schema) => schema.required("تصویر فیش واریزی بیمه الزامی است."),
otherwise: (schema) => schema.notRequired(),
}),
deposit_daghi_amount: string()
.when("deposit_daghi_status", {
is: "has_daghi",
then: (schema) => schema.required("مبلغ داغی الزامی است."),
otherwise: (schema) => schema.notRequired(),
})
.test("max-percentage", "مبلغ داغی نباید بیشتر از ۳۰ درصد مبلغ کل خسارت باشد.", function (value) {
const sum = this.options.context.sum || 0;
if (!value || isNaN(value) || !sum) return true;
return parseFloat(value) <= sum * 0.3;
}),
deposit_daghi_image: mixed().when("deposit_daghi_status", {
is: "has_daghi",
then: (schema) => schema.required("تصویر صورتجلسه تحویل داغی به انبار الزامی است."),
otherwise: (schema) => schema.notRequired(),
}),
}).test("total-amount-limit", "مجموع مبلغ بیمه و داغی نباید از کل مبلغ خسارت بیشتر باشد.", function (values) {
const sum = this.options.context.sum || 0;
const depositInsuranceAmount = parseFloat(values.deposit_insurance_amount) || 0;
const depositDaghiAmount = parseFloat(values.deposit_daghi_amount) || 0;
return depositInsuranceAmount + depositDaghiAmount <= sum;
});
const RegisterInsuranceContent = ({ setOpenRegisterInsuranceDialog, row, mutate, rowId }) => {
const [tabState, setTabState] = useState(0);
const requestServer = useRequest({ notificationSuccess: true });
const handleClose = () => setOpenRegisterInsuranceDialog(false);
const handleChangeTab = (event, newValue) => setTabState(newValue);
const defaultValues = {
deposit_insurance_status: "no_insurance",
deposit_insurance_amount: "",
deposit_insurance_image: null,
deposit_daghi_status: "no_daghi",
deposit_daghi_amount: "",
deposit_daghi_image: null,
};
const handlePrev = () => {
if (tabState === 0) {
handleClose();
} else {
setTabState(tabState - 1);
}
};
const handleNext = async () => {
let fieldsToValidate = [];
if (tabState === 0) {
fieldsToValidate = ["deposit_insurance_status", "deposit_insurance_amount", "deposit_insurance_image"];
}
if (tabState === 1) {
fieldsToValidate = ["deposit_daghi_status", "deposit_daghi_amount", "deposit_daghi_image"];
}
const isValid = await trigger(fieldsToValidate);
if (isValid) {
setTabState(tabState + 1);
}
};
const {
control,
handleSubmit,
trigger,
formState: { isSubmitting, errors },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
context: { sum: row?.original?.sum },
});
const onSubmitBase = async (data) => {
const formData = new FormData();
const depositDaghiStatus = data.deposit_daghi_status === "no_daghi" ? 0 : 1;
const depositInsuranceStatus = data.deposit_insurance_status === "no_insurance" ? 0 : 1;
if (data.deposit_daghi_status === "has_daghi") {
formData.append("deposit_daghi_status", depositDaghiStatus);
formData.append("deposit_daghi_amount", data.deposit_daghi_amount);
formData.append("deposit_daghi_image", data.deposit_daghi_image);
}
if (data.deposit_insurance_status === "has_insurance") {
formData.append("deposit_insurance_status", depositInsuranceStatus);
formData.append("deposit_insurance_amount", data.deposit_insurance_amount);
formData.append("deposit_insurance_image", data.deposit_insurance_image);
}
try {
await requestServer(`${CONFIRM_PAYMENT_INFO}/${rowId}`, "post", {
data: formData,
});
mutate();
setOpenRegisterInsuranceDialog(false);
} catch (error) {}
};
return (
<StyledForm onSubmit={handleSubmit(onSubmitBase)}>
<Tabs
allowScrollButtonsMobile
value={tabState}
onChange={handleChangeTab}
variant="fullWidth"
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "100%",
backgroundColor: "#efefef",
}}
>
<Tab icon={<PaymentIcon />} label="فیش واریزی بیمه" />
<Tab disabled={tabState === 0} icon={<LocalPostOfficeIcon />} label="صورتجلسه تحویل داغی به انبار" />
</Tabs>
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
<Box sx={{ flex: 1 }}>
<TabPanel value={tabState} index={0}>
<InsurancePayment control={control} />
</TabPanel>
<TabPanel value={tabState} index={1}>
<DaghiPayment control={control} />
</TabPanel>
</Box>
</DialogContent>
{errors[""]?.message && (
<Typography textAlign={"center"} color={"error.main"} sx={{ mt: 2 }}>
{errors[""].message}
</Typography>
)}
<DialogActions sx={{ alignItems: "center", justifyContent: "center" }}>
<Button
onClick={handlePrev}
variant="outlined"
color="secondary"
size="large"
startIcon={tabState === 0 ? <ExitToAppIcon /> : <KeyboardDoubleArrowRightIcon />}
>
{tabState === 0 ? "بستن" : "مرحله قبل"}
</Button>
{tabState !== 1 && (
<Button
type="button"
onClick={handleNext}
variant="contained"
key={"handleNext"}
size="large"
endIcon={<KeyboardDoubleArrowLeftIcon />}
>
مرحله بعد
</Button>
)}
{tabState === 1 && (
<Button
type={"submit"}
variant="contained"
size="large"
disabled={isSubmitting}
key={"submit"}
endIcon={<BeenhereIcon />}
>
{isSubmitting ? "در حال ثبت" : "ثبت"}
</Button>
)}
</DialogActions>
</StyledForm>
);
};
export default RegisterInsuranceContent;

106
src/components/dashboard/damages/operator/Form/RegisterInsurance/index.jsx
View File

@@ -1,53 +1,53 @@
import { Dialog, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ReceiptIcon from "@mui/icons-material/Receipt";
import RegisterInsuranceContent from "./RegisterInsuranceContent";
import CloseIcon from "@mui/icons-material/Close";
const RegisterInsurance = ({ row, mutate, rowId }) => {
const [openRegisterInsuranceDialog, setOpenRegisterInsuranceDialog] = useState(false);
return (
<>
<Tooltip title="ثبت بیمه و داغی">
<IconButton color="primary" onClick={() => setOpenRegisterInsuranceDialog(true)}>
<ReceiptIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openRegisterInsuranceDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"sm"}
scroll="paper"
>
<IconButton
aria-label="close"
onClick={() => setOpenRegisterInsuranceDialog(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{openRegisterInsuranceDialog && (
<RegisterInsuranceContent
rowId={rowId}
mutate={mutate}
row={row}
setOpenRegisterInsuranceDialog={setOpenRegisterInsuranceDialog}
/>
)}
</Dialog>
</>
);
};
export default RegisterInsurance;
import { Dialog, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ReceiptIcon from "@mui/icons-material/Receipt";
import RegisterInsuranceContent from "./RegisterInsuranceContent";
import CloseIcon from "@mui/icons-material/Close";
const RegisterInsurance = ({ row, mutate, rowId }) => {
const [openRegisterInsuranceDialog, setOpenRegisterInsuranceDialog] = useState(false);
return (
<>
<Tooltip title="ثبت بیمه و داغی">
<IconButton color="primary" onClick={() => setOpenRegisterInsuranceDialog(true)}>
<ReceiptIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openRegisterInsuranceDialog}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"sm"}
scroll="paper"
>
<IconButton
aria-label="close"
onClick={() => setOpenRegisterInsuranceDialog(false)}
sx={(theme) => ({
position: "absolute",
right: 8,
top: 8,
zIndex: 50,
color: theme.palette.grey[500],
})}
>
<CloseIcon />
</IconButton>
{openRegisterInsuranceDialog && (
<RegisterInsuranceContent
rowId={rowId}
mutate={mutate}
row={row}
setOpenRegisterInsuranceDialog={setOpenRegisterInsuranceDialog}
/>
)}
</Dialog>
</>
);
};
export default RegisterInsurance;

1008
src/components/dashboard/damages/operator/OperatorList.jsx
View File

File diff suppressed because it is too large Load Diff

164
src/components/dashboard/damages/operator/RowActions/DamageItemDialog/DamageItemContent.jsx
View File

@@ -1,82 +1,82 @@
import DialogLoading from "@/core/components/DialogLoading";
import { GET_DAMAGE_ITEM_DETAILS, GET_RAHDARAN_ROAD_ITEM } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import {
DialogContent,
Table,
TableBody,
TableCell,
TableContainer,
TableHead,
TableRow,
Typography,
} from "@mui/material";
import { useEffect, useState } from "react";
const DamageItemContent = ({ rowId }) => {
const [loading, setLoading] = useState(true);
const [data, setData] = useState(null);
const request = useRequest();
useEffect(() => {
const fetchData = async () => {
try {
setLoading(true);
const response = await request(`${GET_DAMAGE_ITEM_DETAILS}/${rowId}`);
setData(response.data.data);
} catch (error) {
} finally {
setLoading(false);
}
};
fetchData();
}, [rowId]);
return (
<>
<DialogContent>
{loading ? (
<DialogLoading />
) : data.damages ? (
<TableContainer sx={{ maxHeight: 600 }}>
<Table stickyHeader sx={{ minWidth: 800 }}>
<TableHead>
<TableRow>
<TableCell>نوع خسارت</TableCell>
<TableCell>میزان خسارت</TableCell>
<TableCell>هزینه خسارت (ریال)</TableCell>
</TableRow>
</TableHead>
<TableBody>
{data.damages.map((item) => {
return (
<TableRow
key={item.id}
sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
>
<TableCell>{item?.title}</TableCell>
<TableCell>
{(item?.pivot?.value / 1).toLocaleString()} ({item?.pivot?.unit})
</TableCell>
<TableCell>{(item?.pivot?.amount / 1).toLocaleString()}</TableCell>
</TableRow>
);
})}
<TableRow sx={{ "&:last-child td, &:last-child th": { border: 0 } }}>
<TableCell colSpan={2} align="center">
اجرت نصب
</TableCell>
<TableCell>{(data.ojrate_nasb / 1).toLocaleString()}</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
) : (
<Typography textAlign={"center"}>اطلاعات یافت نشد</Typography>
)}
</DialogContent>
</>
);
};
export default DamageItemContent;
import DialogLoading from "@/core/components/DialogLoading";
import { GET_DAMAGE_ITEM_DETAILS, GET_RAHDARAN_ROAD_ITEM } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import {
DialogContent,
Table,
TableBody,
TableCell,
TableContainer,
TableHead,
TableRow,
Typography,
} from "@mui/material";
import { useEffect, useState } from "react";
const DamageItemContent = ({ rowId }) => {
const [loading, setLoading] = useState(true);
const [data, setData] = useState(null);
const request = useRequest();
useEffect(() => {
const fetchData = async () => {
try {
setLoading(true);
const response = await request(`${GET_DAMAGE_ITEM_DETAILS}/${rowId}`);
setData(response.data.data);
} catch (error) {
} finally {
setLoading(false);
}
};
fetchData();
}, [rowId]);
return (
<>
<DialogContent>
{loading ? (
<DialogLoading />
) : data.damages ? (
<TableContainer sx={{ maxHeight: 600 }}>
<Table stickyHeader sx={{ minWidth: 800 }}>
<TableHead>
<TableRow>
<TableCell>نوع خسارت</TableCell>
<TableCell>میزان خسارت</TableCell>
<TableCell>هزینه خسارت (ریال)</TableCell>
</TableRow>
</TableHead>
<TableBody>
{data.damages.map((item) => {
return (
<TableRow
key={item.id}
sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
>
<TableCell>{item?.title}</TableCell>
<TableCell>
{(item?.pivot?.value / 1).toLocaleString()} ({item?.pivot?.unit})
</TableCell>
<TableCell>{(item?.pivot?.amount / 1).toLocaleString()}</TableCell>
</TableRow>
);
})}
<TableRow sx={{ "&:last-child td, &:last-child th": { border: 0 } }}>
<TableCell colSpan={2} align="center">
اجرت نصب
</TableCell>
<TableCell>{(data.ojrate_nasb / 1).toLocaleString()}</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
) : (
<Typography textAlign={"center"}>اطلاعات یافت نشد</Typography>
)}
</DialogContent>
</>
);
};
export default DamageItemContent;

86
src/components/dashboard/damages/operator/RowActions/DamageItemDialog/index.jsx
View File

@@ -1,43 +1,43 @@
import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
import MinorCrashIcon from "@mui/icons-material/MinorCrash";
import { useState } from "react";
import DamageItemContent from "./DamageItemContent";
const DamageItemDialog = ({ rowId }) => {
const [openDamageItemDialog, setOpenDamageItemDialog] = useState(false);
return (
<>
<Tooltip title="آیتم های خسارت">
<IconButton color="primary" onClick={() => setOpenDamageItemDialog(true)}>
<MinorCrashIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openDamageItemDialog}
onClose={() => setOpenDamageItemDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"md"}
>
<DialogTitle sx={{ fontSize: "large" }}>آیتم های خسارت</DialogTitle>
{openDamageItemDialog && <DamageItemContent rowId={rowId} />}
<DialogActions>
<Button
onClick={() => setOpenDamageItemDialog(false)}
variant="outlined"
color="secondary"
autoFocus
>
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DamageItemDialog;
import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
import MinorCrashIcon from "@mui/icons-material/MinorCrash";
import { useState } from "react";
import DamageItemContent from "./DamageItemContent";
const DamageItemDialog = ({ rowId }) => {
const [openDamageItemDialog, setOpenDamageItemDialog] = useState(false);
return (
<>
<Tooltip title="آیتم های خسارت">
<IconButton color="primary" onClick={() => setOpenDamageItemDialog(true)}>
<MinorCrashIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openDamageItemDialog}
onClose={() => setOpenDamageItemDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"md"}
>
<DialogTitle sx={{ fontSize: "large" }}>آیتم های خسارت</DialogTitle>
{openDamageItemDialog && <DamageItemContent rowId={rowId} />}
<DialogActions>
<Button
onClick={() => setOpenDamageItemDialog(false)}
variant="outlined"
color="secondary"
autoFocus
>
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DamageItemDialog;

206
src/components/dashboard/damages/operator/RowActions/DamageReport/DamageReportContent.jsx
View File

@@ -1,103 +1,103 @@
import { Box, Button, Chip, DialogContent, Divider, Grid, Typography } from "@mui/material";
import PaymentIcon from "@mui/icons-material/Payment";
import moment from "jalali-moment";
import DownloadIcon from "@mui/icons-material/Download";
import FormatListNumberedIcon from "@mui/icons-material/FormatListNumbered";
import EventNoteIcon from "@mui/icons-material/EventNote";
import ImageIcon from "@mui/icons-material/Image";
const DamageReportContent = ({ damageReportDetails }) => {
return (
<>
<DialogContent>
<Grid container spacing={3} sx={{ alignItems: "center", justifyContent: "space-around" }}>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<PaymentIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
نوع گزارش
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{damageReportDetails?.report_base === 1
? "بازدید عوامل و کارشناسان راهداری"
: "کروکی یا نامه پلیس راه"}
</Typography>
</Grid>
{damageReportDetails?.report_base === 0 && (
<>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<FormatListNumberedIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
شماره کروکی یا نامه پلیس راه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{damageReportDetails?.police_serial}
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<EventNoteIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
تاریخ کروکی یا نامه پلیس راه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{moment(damageReportDetails?.police_file_date, "YYYY-MM-DD HH:mm:ss")
.locale("fa")
.format("YYYY/MM/DD")}
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<ImageIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
تصویر کروکی یا نامه پلیس راه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Button
variant="contained"
color="primary"
size="small"
startIcon={<DownloadIcon />}
onClick={() => {
if (damageReportDetails?.police_file) {
window.open(damageReportDetails.police_file, "_blank");
} else {
alert("فایلی برای دانلود موجود نیست.");
}
}}
>
دانلود فایل
</Button>
</Grid>
</>
)}
</Grid>
</DialogContent>
</>
);
};
export default DamageReportContent;
import { Box, Button, Chip, DialogContent, Divider, Grid, Typography } from "@mui/material";
import PaymentIcon from "@mui/icons-material/Payment";
import moment from "jalali-moment";
import DownloadIcon from "@mui/icons-material/Download";
import FormatListNumberedIcon from "@mui/icons-material/FormatListNumbered";
import EventNoteIcon from "@mui/icons-material/EventNote";
import ImageIcon from "@mui/icons-material/Image";
const DamageReportContent = ({ damageReportDetails }) => {
return (
<>
<DialogContent>
<Grid container spacing={3} sx={{ alignItems: "center", justifyContent: "space-around" }}>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<PaymentIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
نوع گزارش
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{damageReportDetails?.report_base === 1
? "بازدید عوامل و کارشناسان راهداری"
: "کروکی یا نامه پلیس راه"}
</Typography>
</Grid>
{damageReportDetails?.report_base === 0 && (
<>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<FormatListNumberedIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
شماره کروکی یا نامه پلیس راه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{damageReportDetails?.police_serial}
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<EventNoteIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
تاریخ کروکی یا نامه پلیس راه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.800" }}>
{moment(damageReportDetails?.police_file_date, "YYYY-MM-DD HH:mm:ss")
.locale("fa")
.format("YYYY/MM/DD")}
</Typography>
</Grid>
<Grid item xs={12} sm={12} sx={{ display: "flex", alignItems: "center" }}>
<Box sx={{ display: "flex", alignItems: "center" }}>
<Chip
icon={<ImageIcon />}
label={
<Typography variant="body2" sx={{ fontWeight: 600, color: "grey.700" }}>
تصویر کروکی یا نامه پلیس راه
</Typography>
}
/>
</Box>
<Divider sx={{ flex: 1, mx: 2 }} />
<Button
variant="contained"
color="primary"
size="small"
startIcon={<DownloadIcon />}
onClick={() => {
if (damageReportDetails?.police_file) {
window.open(damageReportDetails.police_file, "_blank");
} else {
alert("فایلی برای دانلود موجود نیست.");
}
}}
>
دانلود فایل
</Button>
</Grid>
</>
)}
</Grid>
</DialogContent>
</>
);
};
export default DamageReportContent;

68
src/components/dashboard/damages/operator/RowActions/DamageReport/DamageReportController.jsx
View File

@@ -1,34 +1,34 @@
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_DAMAGE_ITEM_DETAILS } from "@/core/utils/routes";
import DialogLoading from "@/core/components/DialogLoading";
import DamageReportContent from "./DamageReportContent";
const DamageReportController = ({ rowId }) => {
const requestServer = useRequest();
const [damageReportDetails, setDamageReportDetails] = useState(null);
const [damageItemDetailsLoading, setDamageItemDetailsLoading] = useState(false);
useEffect(() => {
setDamageItemDetailsLoading(true);
requestServer(`${GET_DAMAGE_ITEM_DETAILS}/${rowId}`, "get")
.then((response) => {
setDamageReportDetails(response.data.data);
setDamageItemDetailsLoading(false);
})
.catch((e) => {
setDamageItemDetailsLoading(false);
});
}, [rowId]);
return (
<>
{damageItemDetailsLoading ? (
<DialogLoading />
) : (
<DamageReportContent damageReportDetails={damageReportDetails} />
)}
</>
);
};
export default DamageReportController;
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_DAMAGE_ITEM_DETAILS } from "@/core/utils/routes";
import DialogLoading from "@/core/components/DialogLoading";
import DamageReportContent from "./DamageReportContent";
const DamageReportController = ({ rowId }) => {
const requestServer = useRequest();
const [damageReportDetails, setDamageReportDetails] = useState(null);
const [damageItemDetailsLoading, setDamageItemDetailsLoading] = useState(false);
useEffect(() => {
setDamageItemDetailsLoading(true);
requestServer(`${GET_DAMAGE_ITEM_DETAILS}/${rowId}`, "get")
.then((response) => {
setDamageReportDetails(response.data.data);
setDamageItemDetailsLoading(false);
})
.catch((e) => {
setDamageItemDetailsLoading(false);
});
}, [rowId]);
return (
<>
{damageItemDetailsLoading ? (
<DialogLoading />
) : (
<DamageReportContent damageReportDetails={damageReportDetails} />
)}
</>
);
};
export default DamageReportController;

76
src/components/dashboard/damages/operator/RowActions/DamageReport/index.jsx
View File

@@ -1,38 +1,38 @@
import React, { useState } from "react";
import { Tooltip, IconButton, Dialog, DialogTitle, DialogActions, Button } from "@mui/material";
import AssessmentIcon from "@mui/icons-material/Assessment";
import DamageReportController from "./DamageReportController";
const DamageReportDialog = ({ rowId }) => {
const [openDamageReportDialog, setOpenDamageReportDialog] = useState(false);
return (
<>
<Tooltip title="گزارش خسارت">
<IconButton color="primary" onClick={() => setOpenDamageReportDialog(true)}>
<AssessmentIcon />
</IconButton>
</Tooltip>
<Dialog
open={openDamageReportDialog}
onClose={() => setOpenDamageReportDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"sm"}
fullWidth
>
<DialogTitle>گزارش خسارت</DialogTitle>
{openDamageReportDialog && <DamageReportController rowId={rowId} />}
<DialogActions>
<Button onClick={() => setOpenDamageReportDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DamageReportDialog;
import React, { useState } from "react";
import { Tooltip, IconButton, Dialog, DialogTitle, DialogActions, Button } from "@mui/material";
import AssessmentIcon from "@mui/icons-material/Assessment";
import DamageReportController from "./DamageReportController";
const DamageReportDialog = ({ rowId }) => {
const [openDamageReportDialog, setOpenDamageReportDialog] = useState(false);
return (
<>
<Tooltip title="گزارش خسارت">
<IconButton color="primary" onClick={() => setOpenDamageReportDialog(true)}>
<AssessmentIcon />
</IconButton>
</Tooltip>
<Dialog
open={openDamageReportDialog}
onClose={() => setOpenDamageReportDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"sm"}
fullWidth
>
<DialogTitle>گزارش خسارت</DialogTitle>
{openDamageReportDialog && <DamageReportController rowId={rowId} />}
<DialogActions>
<Button onClick={() => setOpenDamageReportDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default DamageReportDialog;

78
src/components/dashboard/damages/operator/RowActions/DeleteDialog/DeleteContent.jsx
View File

@@ -1,39 +1,39 @@
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import React, { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import { DELETE_DAMAGE_ITEM } from "@/core/utils/routes";
const DeleteContent = ({ rowId, mutate, setOpenDeleteDialog }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const handleClick = () => {
setSubmitting(true);
requestServer(`${DELETE_DAMAGE_ITEM}/${rowId}`, "delete")
.then(() => {
mutate();
setOpenDeleteDialog(false);
setSubmitting(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack alignItems="center" spacing={2}>
<Typography mt={2}>آیا از حذف فعالیت اطمینان دارید؟</Typography>
</Stack>
</DialogContent>
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
<Button onClick={() => setOpenDeleteDialog(false)} variant="outlined" color="secondary">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="error" disabled={submitting}>
{submitting ? "درحال حذف..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default DeleteContent;
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import React, { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import { DELETE_DAMAGE_ITEM } from "@/core/utils/routes";
const DeleteContent = ({ rowId, mutate, setOpenDeleteDialog }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const handleClick = () => {
setSubmitting(true);
requestServer(`${DELETE_DAMAGE_ITEM}/${rowId}`, "delete")
.then(() => {
mutate();
setOpenDeleteDialog(false);
setSubmitting(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack alignItems="center" spacing={2}>
<Typography mt={2}>آیا از حذف فعالیت اطمینان دارید؟</Typography>
</Stack>
</DialogContent>
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
<Button onClick={() => setOpenDeleteDialog(false)} variant="outlined" color="secondary">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="error" disabled={submitting}>
{submitting ? "درحال حذف..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default DeleteContent;

68
src/components/dashboard/damages/operator/RowActions/DeleteDialog/index.jsx
View File

@@ -1,34 +1,34 @@
import DeleteIcon from "@mui/icons-material/Delete";
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import DeleteContent from "./DeleteContent";
const DeleteDialog = ({ rowId, mutate }) => {
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
return (
<>
<Tooltip title="حذف">
<IconButton color="error" onClick={() => setOpenDeleteDialog(true)}>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
open={openDeleteDialog}
onClose={() => setOpenDeleteDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"md"}
>
<DialogTitle>حذف فعالیت</DialogTitle>
{openDeleteDialog && (
<DeleteContent rowId={rowId} mutate={mutate} setOpenDeleteDialog={setOpenDeleteDialog} />
)}
</Dialog>
</>
);
};
export default DeleteDialog;
import DeleteIcon from "@mui/icons-material/Delete";
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import DeleteContent from "./DeleteContent";
const DeleteDialog = ({ rowId, mutate }) => {
const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
return (
<>
<Tooltip title="حذف">
<IconButton color="error" onClick={() => setOpenDeleteDialog(true)}>
<DeleteIcon />
</IconButton>
</Tooltip>
<Dialog
open={openDeleteDialog}
onClose={() => setOpenDeleteDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"md"}
>
<DialogTitle>حذف فعالیت</DialogTitle>
{openDeleteDialog && (
<DeleteContent rowId={rowId} mutate={mutate} setOpenDeleteDialog={setOpenDeleteDialog} />
)}
</Dialog>
</>
);
};
export default DeleteDialog;

90
src/components/dashboard/damages/operator/RowActions/ImageDialog/ImageFormContent.jsx
View File

@@ -1,45 +1,45 @@
import { Box, Stack, Typography, useTheme } from "@mui/material";
import Image from "next/image";
const ImageFormContent = ({ image, title }) => {
const theme = useTheme();
return (
<Stack
spacing={2}
alignItems="center"
justifyContent="center"
sx={{
my: 2,
padding: 2,
borderRadius: "12px",
border: `1px solid ${theme.palette.primary.main}`,
}}
>
<Typography
variant="h6"
sx={{
color: theme.palette.primary.dark,
fontWeight: "bold",
}}
>
{title}
</Typography>
<Box sx={{ width: "100%", position: "relative", aspectRatio: "16/9" }}>
<Image
src={image}
alt="Image"
fill={true}
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
loading="lazy"
style={{
objectFit: "contain",
marginBottom: "16px",
borderRadius: "12px",
border: `1px solid ${theme.palette.divider}`,
}}
/>
</Box>
</Stack>
);
};
export default ImageFormContent;
import { Box, Stack, Typography, useTheme } from "@mui/material";
import Image from "next/image";
const ImageFormContent = ({ image, title }) => {
const theme = useTheme();
return (
<Stack
spacing={2}
alignItems="center"
justifyContent="center"
sx={{
my: 2,
padding: 2,
borderRadius: "12px",
border: `1px solid ${theme.palette.primary.main}`,
}}
>
<Typography
variant="h6"
sx={{
color: theme.palette.primary.dark,
fontWeight: "bold",
}}
>
{title}
</Typography>
<Box sx={{ width: "100%", position: "relative", aspectRatio: "16/9" }}>
<Image
src={image}
alt="Image"
fill={true}
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
loading="lazy"
style={{
objectFit: "contain",
marginBottom: "16px",
borderRadius: "12px",
border: `1px solid ${theme.palette.divider}`,
}}
/>
</Box>
</Stack>
);
};
export default ImageFormContent;

88
src/components/dashboard/damages/operator/RowActions/ImageDialog/index.jsx
View File

@@ -1,44 +1,44 @@
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Paper, Tooltip } from "@mui/material";
import { useState } from "react";
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
import ImageFormContent from "./ImageFormContent";
const ImageDialog = ({ images }) => {
const [openImageDialog, setOpenImageDialog] = useState(false);
return (
<>
<Tooltip title="تصاویر">
<IconButton color="primary" onClick={() => setOpenImageDialog(true)}>
<PhotoLibraryIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openImageDialog}
onClose={() => setOpenImageDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"sm"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>تصاویر</DialogTitle>
{openImageDialog && (
<DialogContent>
<ImageFormContent image={images[1]} title={"تصویر تصادف"} />
<ImageFormContent image={images[0]} title={"تصویر تصادف"} />
</DialogContent>
)}
<DialogActions>
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ImageDialog;
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Paper, Tooltip } from "@mui/material";
import { useState } from "react";
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
import ImageFormContent from "./ImageFormContent";
const ImageDialog = ({ images }) => {
const [openImageDialog, setOpenImageDialog] = useState(false);
return (
<>
<Tooltip title="تصاویر">
<IconButton color="primary" onClick={() => setOpenImageDialog(true)}>
<PhotoLibraryIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openImageDialog}
onClose={() => setOpenImageDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"sm"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>تصاویر</DialogTitle>
{openImageDialog && (
<DialogContent>
<ImageFormContent image={images[1]} title={"تصویر تصادف"} />
<ImageFormContent image={images[0]} title={"تصویر تصادف"} />
</DialogContent>
)}
<DialogActions>
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ImageDialog;

70
src/components/dashboard/damages/operator/RowActions/LocationForm/LocationFormContent.jsx
View File

@@ -1,35 +1,35 @@
"use client";
import { Box, Button, DialogActions, DialogContent, Stack } from "@mui/material";
import React from "react";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
import ShowLocationMarker from "@/core/components/ShowLocationMarker";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const LocationFormContent = ({ setOpenLocationDialog, start_lat, start_lng, end_lat, end_lng }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker
start_lat={start_lat}
start_lng={start_lng}
end_lat={end_lat}
end_lng={end_lng}
/>
</MapLayer>
</Box>
</DialogContent>
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
<Button onClick={() => setOpenLocationDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</>
);
};
export default LocationFormContent;
"use client";
import { Box, Button, DialogActions, DialogContent, Stack } from "@mui/material";
import React from "react";
import dynamic from "next/dynamic";
import MapLoading from "@/core/components/MapLayer/Loading";
import ShowLocationMarker from "@/core/components/ShowLocationMarker";
const MapLayer = dynamic(() => import("@/core/components/MapLayer"), {
loading: () => <MapLoading />,
ssr: false,
});
const LocationFormContent = ({ setOpenLocationDialog, start_lat, start_lng, end_lat, end_lng }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker
start_lat={start_lat}
start_lng={start_lng}
end_lat={end_lat}
end_lng={end_lng}
/>
</MapLayer>
</Box>
</DialogContent>
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
<Button onClick={() => setOpenLocationDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</>
);
};
export default LocationFormContent;

80
src/components/dashboard/damages/operator/RowActions/LocationForm/index.jsx
View File

@@ -1,40 +1,40 @@
import React, { useState } from "react";
import { Tooltip, IconButton, Dialog, DialogTitle } from "@mui/material";
import ExploreIcon from "@mui/icons-material/Explore";
import LocationFormContent from "./LocationFormContent";
const LocationForm = ({ start_lat, start_lng, end_lat, end_lng }) => {
const [openLocationDialog, setOpenLocationDialog] = useState(false);
return (
<>
<Tooltip title="موقعیت">
<IconButton color="primary" onClick={() => setOpenLocationDialog(true)}>
<ExploreIcon />
</IconButton>
</Tooltip>
<Dialog
open={openLocationDialog}
onClose={() => setOpenLocationDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"md"}
>
<DialogTitle>موقعیت</DialogTitle>
{openLocationDialog && (
<LocationFormContent
start_lat={start_lat}
start_lng={start_lng}
end_lat={end_lat}
end_lng={end_lng}
setOpenLocationDialog={setOpenLocationDialog}
/>
)}
</Dialog>
</>
);
};
export default LocationForm;
import React, { useState } from "react";
import { Tooltip, IconButton, Dialog, DialogTitle } from "@mui/material";
import ExploreIcon from "@mui/icons-material/Explore";
import LocationFormContent from "./LocationFormContent";
const LocationForm = ({ start_lat, start_lng, end_lat, end_lng }) => {
const [openLocationDialog, setOpenLocationDialog] = useState(false);
return (
<>
<Tooltip title="موقعیت">
<IconButton color="primary" onClick={() => setOpenLocationDialog(true)}>
<ExploreIcon />
</IconButton>
</Tooltip>
<Dialog
open={openLocationDialog}
onClose={() => setOpenLocationDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
dir="rtl"
maxWidth={"md"}
>
<DialogTitle>موقعیت</DialogTitle>
{openLocationDialog && (
<LocationFormContent
start_lat={start_lat}
start_lng={start_lng}
end_lat={end_lat}
end_lng={end_lng}
setOpenLocationDialog={setOpenLocationDialog}
/>
)}
</Dialog>
</>
);
};
export default LocationForm;

80
src/components/dashboard/damages/operator/RowActions/PoliceRahLetter/PoliceRahLetterContent.jsx
View File

@@ -1,40 +1,40 @@
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import React, { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import { GET_POLICERAH, GET_POLICERAH_PAGE } from "@/core/utils/routes";
const PoliceRahLetterContent = ({ setOpenPoliceRahDialog, rowId, mutate }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest();
const handleClick = () => {
setSubmitting(true);
requestServer(`${GET_POLICERAH}/${rowId}`, "get")
.then(() => {
mutate();
window.open(`${GET_POLICERAH_PAGE}/${rowId}`, "_blank");
setSubmitting(false);
setOpenPoliceRahDialog(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Typography mt={2}>آیا از صدور نامه به پلیس راه اطمینان دارید؟</Typography>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenPoliceRahDialog(false)} variant="outlined" color="secondary">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
{submitting ? "درحال صدور نامه پلیس راه..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default PoliceRahLetterContent;
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import React, { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import { GET_POLICERAH, GET_POLICERAH_PAGE } from "@/core/utils/routes";
const PoliceRahLetterContent = ({ setOpenPoliceRahDialog, rowId, mutate }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest();
const handleClick = () => {
setSubmitting(true);
requestServer(`${GET_POLICERAH}/${rowId}`, "get")
.then(() => {
mutate();
window.open(`${GET_POLICERAH_PAGE}/${rowId}`, "_blank");
setSubmitting(false);
setOpenPoliceRahDialog(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Typography mt={2}>آیا از صدور نامه به پلیس راه اطمینان دارید؟</Typography>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenPoliceRahDialog(false)} variant="outlined" color="secondary">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
{submitting ? "درحال صدور نامه پلیس راه..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default PoliceRahLetterContent;

76
src/components/dashboard/damages/operator/RowActions/PoliceRahLetter/index.jsx
View File

@@ -1,38 +1,38 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import GarageIcon from "@mui/icons-material/Garage";
import React, { useState } from "react";
import PoliceRahLetterContent from "./PoliceRahLetterContent";
const PoliceRahLetter = ({ rowId, mutate }) => {
const [openPoliceRahDialog, setOpenPoliceRahDialog] = useState(false);
return (
<>
<Tooltip title="نامه پلیس راه">
<IconButton color="primary" onClick={() => setOpenPoliceRahDialog(true)}>
<GarageIcon />
</IconButton>
</Tooltip>
<Dialog
open={openPoliceRahDialog}
onClose={() => setOpenPoliceRahDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"xs"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>صدور نامه پلیس راه</DialogTitle>
{openPoliceRahDialog && (
<PoliceRahLetterContent
mutate={mutate}
rowId={rowId}
setOpenPoliceRahDialog={setOpenPoliceRahDialog}
/>
)}
</Dialog>
</>
);
};
export default PoliceRahLetter;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import GarageIcon from "@mui/icons-material/Garage";
import React, { useState } from "react";
import PoliceRahLetterContent from "./PoliceRahLetterContent";
const PoliceRahLetter = ({ rowId, mutate }) => {
const [openPoliceRahDialog, setOpenPoliceRahDialog] = useState(false);
return (
<>
<Tooltip title="نامه پلیس راه">
<IconButton color="primary" onClick={() => setOpenPoliceRahDialog(true)}>
<GarageIcon />
</IconButton>
</Tooltip>
<Dialog
open={openPoliceRahDialog}
onClose={() => setOpenPoliceRahDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"xs"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>صدور نامه پلیس راه</DialogTitle>
{openPoliceRahDialog && (
<PoliceRahLetterContent
mutate={mutate}
rowId={rowId}
setOpenPoliceRahDialog={setOpenPoliceRahDialog}
/>
)}
</Dialog>
</>
);
};
export default PoliceRahLetter;

86
src/components/dashboard/damages/operator/RowActions/SendToInsurance/SendToInsuranceContent.jsx
View File

@@ -1,43 +1,43 @@
import { Alert, Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import React, { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import { GET_INSURANCE, GET_INSURANCE_PAGE } from "@/core/utils/routes";
const SendToInsuranceContent = ({ setOpenSendInsuranceDialog, rowId, mutate }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest();
const handleClick = () => {
setSubmitting(true);
requestServer(`${GET_INSURANCE}/${rowId}`, "get")
.then(() => {
mutate();
window.open(`${GET_INSURANCE_PAGE}/${rowId}`, "_blank");
setSubmitting(false);
setOpenSendInsuranceDialog(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Typography mt={2}>آیا از صدور نامه بیمه اطمینان دارید؟</Typography>
<Alert color="warning" icon={false}>
در صورت صدور نامه بیمه، اطلاعات قابل ویرایش یا حذف نخواهند بود
</Alert>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenSendInsuranceDialog(false)} variant="outlined" color="secondary">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
{submitting ? "درحال صدور نامه بیمه..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default SendToInsuranceContent;
import { Alert, Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import React, { useState } from "react";
import useRequest from "@/lib/hooks/useRequest";
import { GET_INSURANCE, GET_INSURANCE_PAGE } from "@/core/utils/routes";
const SendToInsuranceContent = ({ setOpenSendInsuranceDialog, rowId, mutate }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest();
const handleClick = () => {
setSubmitting(true);
requestServer(`${GET_INSURANCE}/${rowId}`, "get")
.then(() => {
mutate();
window.open(`${GET_INSURANCE_PAGE}/${rowId}`, "_blank");
setSubmitting(false);
setOpenSendInsuranceDialog(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Typography mt={2}>آیا از صدور نامه بیمه اطمینان دارید؟</Typography>
<Alert color="warning" icon={false}>
در صورت صدور نامه بیمه، اطلاعات قابل ویرایش یا حذف نخواهند بود
</Alert>
</Stack>
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenSendInsuranceDialog(false)} variant="outlined" color="secondary">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
{submitting ? "درحال صدور نامه بیمه..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default SendToInsuranceContent;

76
src/components/dashboard/damages/operator/RowActions/SendToInsurance/index.jsx
View File

@@ -1,38 +1,38 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import EmailIcon from "@mui/icons-material/Email";
import React, { useState } from "react";
import SendToInsuranceContent from "./SendToInsuranceContent";
const SendToInsurance = ({ rowId, mutate }) => {
const [openSendInsuranceDialog, setOpenSendInsuranceDialog] = useState(false);
return (
<>
<Tooltip title="نامه بیمه">
<IconButton color="primary" onClick={() => setOpenSendInsuranceDialog(true)}>
<EmailIcon />
</IconButton>
</Tooltip>
<Dialog
open={openSendInsuranceDialog}
onClose={() => setOpenSendInsuranceDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"xs"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>نامه بیمه</DialogTitle>
{openSendInsuranceDialog && (
<SendToInsuranceContent
mutate={mutate}
rowId={rowId}
setOpenSendInsuranceDialog={setOpenSendInsuranceDialog}
/>
)}
</Dialog>
</>
);
};
export default SendToInsurance;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import EmailIcon from "@mui/icons-material/Email";
import React, { useState } from "react";
import SendToInsuranceContent from "./SendToInsuranceContent";
const SendToInsurance = ({ rowId, mutate }) => {
const [openSendInsuranceDialog, setOpenSendInsuranceDialog] = useState(false);
return (
<>
<Tooltip title="نامه بیمه">
<IconButton color="primary" onClick={() => setOpenSendInsuranceDialog(true)}>
<EmailIcon />
</IconButton>
</Tooltip>
<Dialog
open={openSendInsuranceDialog}
onClose={() => setOpenSendInsuranceDialog(false)}
PaperProps={{
sx: {
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
},
}}
maxWidth={"xs"}
scroll="paper"
>
<DialogTitle sx={{ fontSize: "large" }}>نامه بیمه</DialogTitle>
{openSendInsuranceDialog && (
<SendToInsuranceContent
mutate={mutate}
rowId={rowId}
setOpenSendInsuranceDialog={setOpenSendInsuranceDialog}
/>
)}
</Dialog>
</>
);
};
export default SendToInsurance;

76
src/components/dashboard/damages/operator/RowActions/ShowPlate/index.jsx
View File

@@ -1,38 +1,38 @@
import { Stack } from "@mui/material";
const ShowPlate = ({ plate }) => {
return (
<Stack sx={{ border: 1, borderColor: "divider", borderRadius: 1 }} direction={"row"}>
<Stack sx={{ borderRight: 1, borderColor: "divider", textAlign: "center", px: 1 }}>
{plate.split("-")[3]}
</Stack>
<Stack direction={"row"} spacing={1} sx={{ width: "100%", px: 0.5 }}>
<Stack
sx={{
textAlign: "center",
width: "100%",
}}
>
{plate.split("-")[2]}
</Stack>
<Stack
sx={{
textAlign: "center",
width: "100%",
}}
>
{plate.split("-")[1]}
</Stack>
<Stack
sx={{
textAlign: "center",
width: "100%",
}}
>
{plate.split("-")[0]}
</Stack>
</Stack>
</Stack>
);
};
export default ShowPlate;
import { Stack } from "@mui/material";
const ShowPlate = ({ plate }) => {
return (
<Stack sx={{ border: 1, borderColor: "divider", borderRadius: 1 }} direction={"row"}>
<Stack sx={{ borderRight: 1, borderColor: "divider", textAlign: "center", px: 1 }}>
{plate.split("-")[3]}
</Stack>
<Stack direction={"row"} spacing={1} sx={{ width: "100%", px: 0.5 }}>
<Stack
sx={{
textAlign: "center",
width: "100%",
}}
>
{plate.split("-")[2]}
</Stack>
<Stack
sx={{
textAlign: "center",
width: "100%",
}}
>
{plate.split("-")[1]}
</Stack>
<Stack
sx={{
textAlign: "center",
width: "100%",
}}
>
{plate.split("-")[0]}
</Stack>
</Stack>
</Stack>
);
};
export default ShowPlate;

70
src/components/dashboard/damages/operator/RowActions/index.jsx
View File

@@ -1,35 +1,35 @@
import { Box } from "@mui/material";
import RegisterInsurance from "../Form/RegisterInsurance";
import CreateFactor from "../Form/CreateFactor";
import DeleteDialog from "./DeleteDialog";
import SendToInsurance from "./SendToInsurance";
import PoliceRahLetter from "./PoliceRahLetter";
import EditForm from "../Form/EditForm";
import { usePermissions } from "@/lib/hooks/usePermissions";
const RowActions = ({ row, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasDeletePermission = userPermissions.some((item) =>
["delete-receipt", "delete-receipt-province"].includes(item)
);
const hasEditPermission = userPermissions.some((item) => ["edit-receipt", "edit-receipt-province"].includes(item));
return (
<Box sx={{ display: "flex", gap: 1 }}>
{[4, 5].includes(row.original?.status) && <PoliceRahLetter mutate={mutate} rowId={row.getValue("id")} />}
{[2, 3].includes(row.original?.status) && (
<CreateFactor row={row} rowId={row.getValue("id")} mutate={mutate} />
)}
{[1, 2].includes(row.original?.status) && (
<RegisterInsurance mutate={mutate} row={row} rowId={row.getValue("id")} />
)}
{[0, 1, 2].includes(row.original?.status) && <SendToInsurance mutate={mutate} rowId={row.getValue("id")} />}
{hasEditPermission && [0].includes(row.original?.status) && (
<EditForm row={row} mutate={mutate} rowId={row.getValue("id")} />
)}
{hasDeletePermission && [0].includes(row.original?.status) && (
<DeleteDialog mutate={mutate} rowId={row.getValue("id")} />
)}
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import RegisterInsurance from "../Form/RegisterInsurance";
import CreateFactor from "../Form/CreateFactor";
import DeleteDialog from "./DeleteDialog";
import SendToInsurance from "./SendToInsurance";
import PoliceRahLetter from "./PoliceRahLetter";
import EditForm from "../Form/EditForm";
import { usePermissions } from "@/lib/hooks/usePermissions";
const RowActions = ({ row, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasDeletePermission = userPermissions.some((item) =>
["delete-receipt", "delete-receipt-province"].includes(item)
);
const hasEditPermission = userPermissions.some((item) => ["edit-receipt", "edit-receipt-province"].includes(item));
return (
<Box sx={{ display: "flex", gap: 1 }}>
{[4, 5].includes(row.original?.status) && <PoliceRahLetter mutate={mutate} rowId={row.getValue("id")} />}
{[2, 3].includes(row.original?.status) && (
<CreateFactor row={row} rowId={row.getValue("id")} mutate={mutate} />
)}
{[1, 2].includes(row.original?.status) && (
<RegisterInsurance mutate={mutate} row={row} rowId={row.getValue("id")} />
)}
{[0, 1, 2].includes(row.original?.status) && <SendToInsurance mutate={mutate} rowId={row.getValue("id")} />}
{hasEditPermission && [0].includes(row.original?.status) && (
<EditForm row={row} mutate={mutate} rowId={row.getValue("id")} />
)}
{hasDeletePermission && [0].includes(row.original?.status) && (
<DeleteDialog mutate={mutate} rowId={row.getValue("id")} />
)}
</Box>
);
};
export default RowActions;

32
src/components/dashboard/damages/operator/Toolbar.jsx
View File

@@ -1,16 +1,16 @@
import { Box } from "@mui/material";
import OperatorCreate from "./Actions/create";
import PrintExcel from "./ExcelPrint";
import { usePermissions } from "@/lib/hooks/usePermissions";
const Toolbar = ({ table, filterData, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasAddPermission = userPermissions.some((item) => ["add-receipt", "add-receipt-province"].includes(item));
return (
<Box sx={{ display: "flex", gap: 1 }}>
<PrintExcel table={table} filterData={filterData} />
{hasAddPermission && <OperatorCreate mutate={mutate} />}
</Box>
);
};
export default Toolbar;
import { Box } from "@mui/material";
import OperatorCreate from "./Actions/create";
import PrintExcel from "./ExcelPrint";
import { usePermissions } from "@/lib/hooks/usePermissions";
const Toolbar = ({ table, filterData, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasAddPermission = userPermissions.some((item) => ["add-receipt", "add-receipt-province"].includes(item));
return (
<Box sx={{ display: "flex", gap: 1 }}>
<PrintExcel table={table} filterData={filterData} />
{hasAddPermission && <OperatorCreate mutate={mutate} />}
</Box>
);
};
export default Toolbar;

28
src/components/dashboard/damages/operator/index.jsx
View File

@@ -1,14 +1,14 @@
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import OperatorList from "./OperatorList";
const OperatorPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"کارتابل عملیات خسارات وارده بر ابنیه فنی و تاسیسات راه"} />
<OperatorList />
</Stack>
);
};
export default OperatorPage;
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import OperatorList from "./OperatorList";
const OperatorPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"کارتابل عملیات خسارات وارده بر ابنیه فنی و تاسیسات راه"} />
<OperatorList />
</Stack>
);
};
export default OperatorPage;

144
src/components/dashboard/damages/report/ExcelPrint/index.jsx
View File

@@ -1,72 +1,72 @@
"use client";
import { EXPORT_COUNTRY_RECEIPT_REPORT, EXPORT_PROVINCE_RECEIPT_REPORT } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { useTheme } from "@emotion/react";
import DescriptionIcon from "@mui/icons-material/Description";
import { Button, CircularProgress, IconButton, useMediaQuery } from "@mui/material";
import FileSaver from "file-saver";
import moment from "jalali-moment";
import { useMemo, useState } from "react";
const PrintExcel = ({ table, filterData }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [loading, setLoading] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
if (filter.value) {
acc.push({ id: filter.id, value: filter.value });
}
return acc;
}, []);
const filterParams = useMemo(() => {
const params = new URLSearchParams();
activeFilters.length > 0 &&
activeFilters.map((filter, index) => {
params.set(`${filter.id}`, filter.value);
});
return params;
}, [activeFilters]);
const clickHandler = () => {
setLoading(true);
const CountryOrProvince = activeFilters.find((item) => item.id === "province_id");
const requestUrl =
CountryOrProvince.value === "-1" ? EXPORT_COUNTRY_RECEIPT_REPORT : EXPORT_PROVINCE_RECEIPT_REPORT;
requestServer(`${requestUrl}?${filterParams}`, "get", {
requestOptions: { responseType: "blob" },
})
.then((response) => {
const filename = `خروجی کارتابل گزارشات خسارات وارده بر ابنیه فنی تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
FileSaver.saveAs(response.data, filename);
})
.catch(() => {})
.finally(() => {
setLoading(false);
});
};
return (
<>
{isMobile ? (
<IconButton aria-label="خروجی اکسل" color="primary" onClick={clickHandler}>
<DescriptionIcon sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
color="primary"
variant="contained"
size="small"
disabled={loading}
sx={{ textTransform: "unset", alignSelf: "center" }}
startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
onClick={clickHandler}
>
خروجی اکسل
</Button>
)}
</>
);
};
export default PrintExcel;
"use client";
import { EXPORT_COUNTRY_RECEIPT_REPORT, EXPORT_PROVINCE_RECEIPT_REPORT } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { useTheme } from "@emotion/react";
import DescriptionIcon from "@mui/icons-material/Description";
import { Button, CircularProgress, IconButton, useMediaQuery } from "@mui/material";
import FileSaver from "file-saver";
import moment from "jalali-moment";
import { useMemo, useState } from "react";
const PrintExcel = ({ table, filterData }) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const [loading, setLoading] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const activeFilters = Object.entries(filterData).reduce((acc, [key, filter]) => {
if (filter.value) {
acc.push({ id: filter.id, value: filter.value });
}
return acc;
}, []);
const filterParams = useMemo(() => {
const params = new URLSearchParams();
activeFilters.length > 0 &&
activeFilters.map((filter, index) => {
params.set(`${filter.id}`, filter.value);
});
return params;
}, [activeFilters]);
const clickHandler = () => {
setLoading(true);
const CountryOrProvince = activeFilters.find((item) => item.id === "province_id");
const requestUrl =
CountryOrProvince.value === "-1" ? EXPORT_COUNTRY_RECEIPT_REPORT : EXPORT_PROVINCE_RECEIPT_REPORT;
requestServer(`${requestUrl}?${filterParams}`, "get", {
requestOptions: { responseType: "blob" },
})
.then((response) => {
const filename = `خروجی کارتابل گزارشات خسارات وارده بر ابنیه فنی تاریخ_${moment().format("jYYYY_jMM_jDD")}.xlsx`;
FileSaver.saveAs(response.data, filename);
})
.catch(() => {})
.finally(() => {
setLoading(false);
});
};
return (
<>
{isMobile ? (
<IconButton aria-label="خروجی اکسل" color="primary" onClick={clickHandler}>
<DescriptionIcon sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Button
color="primary"
variant="contained"
size="small"
disabled={loading}
sx={{ textTransform: "unset", alignSelf: "center" }}
startIcon={loading ? <CircularProgress size={18} color="inherit" /> : <DescriptionIcon />}
onClick={clickHandler}
>
خروجی اکسل
</Button>
)}
</>
);
};
export default PrintExcel;

646
src/components/dashboard/damages/report/ReportLists.jsx
View File

@@ -1,323 +1,323 @@
"use client";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { Box } from "@mui/material";
import { useMemo } from "react";
import Toolbar from "./Toolbar";
const ReportLists = ({ data, specialFilter }) => {
const columns = useMemo(() => {
return [
{
accessorKey: "edare_name",
header: "اداره",
id: "edare_name",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
},
{
header: "تعداد خسارات ثبت شده",
id: "countAll",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
columns: [
{
accessorKey: "tedade",
header: "کل",
id: "tedade",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "egdam",
header: "در دست اقدام",
id: "egdam",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "pardakht",
header: "در حال پرداخت",
id: "pardakht",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "khatm",
header: "خاتمه یافته",
id: "khatm",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
],
},
{
header: "تعداد نحوه شناسایی خسارت",
id: "police_rah_All",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
columns: [
{
accessorKey: "police_rah",
header: "گزارش پلیس راه",
id: "police_rah",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "gozaresh_gasht",
header: "گزارش گشت راهداری",
id: "gozaresh_gasht",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
],
},
{
accessorKey: "kol_sabt_shode",
header: "مبلغ کل خسارات ثبت شده (ریال)",
id: "kol_sabt_shode",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "vasel_shode",
header: "کل مبلغ وصول شده (ریال)",
id: "vasel_shode",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
header: "مبلغ وصول شده به تفکیک نوع پرداخت (ریال)",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
columns: [
{
accessorKey: "vasel_shode_final",
header: "فاکتور",
id: "vasel_shode_final",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "vasel_shode_bimeh",
header: "بیمه",
id: "vasel_shode_bimeh",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "vasel_shode_daghi",
header: "داغی",
id: "vasel_shode_daghi",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
],
},
];
}, []);
return (
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
TableToolbar={Toolbar}
columns={columns}
data={data.data}
page_name={"damagesReport"}
table_name={"damagesReportList"}
enablePagination={false}
specialFilter={specialFilter}
/>
</Box>
);
};
export default ReportLists;
"use client";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { Box } from "@mui/material";
import { useMemo } from "react";
import Toolbar from "./Toolbar";
const ReportLists = ({ data, specialFilter }) => {
const columns = useMemo(() => {
return [
{
accessorKey: "edare_name",
header: "اداره",
id: "edare_name",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
},
{
header: "تعداد خسارات ثبت شده",
id: "countAll",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
columns: [
{
accessorKey: "tedade",
header: "کل",
id: "tedade",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "egdam",
header: "در دست اقدام",
id: "egdam",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "pardakht",
header: "در حال پرداخت",
id: "pardakht",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "khatm",
header: "خاتمه یافته",
id: "khatm",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
],
},
{
header: "تعداد نحوه شناسایی خسارت",
id: "police_rah_All",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
columns: [
{
accessorKey: "police_rah",
header: "گزارش پلیس راه",
id: "police_rah",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "gozaresh_gasht",
header: "گزارش گشت راهداری",
id: "gozaresh_gasht",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
],
},
{
accessorKey: "kol_sabt_shode",
header: "مبلغ کل خسارات ثبت شده (ریال)",
id: "kol_sabt_shode",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "vasel_shode",
header: "کل مبلغ وصول شده (ریال)",
id: "vasel_shode",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
header: "مبلغ وصول شده به تفکیک نوع پرداخت (ریال)",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
columns: [
{
accessorKey: "vasel_shode_final",
header: "فاکتور",
id: "vasel_shode_final",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "vasel_shode_bimeh",
header: "بیمه",
id: "vasel_shode_bimeh",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
{
accessorKey: "vasel_shode_daghi",
header: "داغی",
id: "vasel_shode_daghi",
enableColumnFilter: false,
enableSorting: false,
datatype: "text",
grow: false,
size: 50,
muiTableBodyCellProps: {
sx: {
textAlign: "center",
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
return (renderedCellValue / 1).toLocaleString();
},
},
],
},
];
}, []);
return (
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
TableToolbar={Toolbar}
columns={columns}
data={data.data}
page_name={"damagesReport"}
table_name={"damagesReportList"}
enablePagination={false}
specialFilter={specialFilter}
/>
</Box>
);
};
export default ReportLists;

56
src/components/dashboard/damages/report/Search/FromDateController.jsx
View File

@@ -1,28 +1,28 @@
import { Controller } from "react-hook-form";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import React from "react";
import moment from "jalali-moment";
const FromDateController = ({ control }) => {
return (
<Controller
name="from_date"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<MuiDatePicker
name="from_date"
error={!!error}
value={value}
label={"تاریخ تصادف (از تاریخ)"}
placeholder={"از تاریخ"}
setFieldValue={(name, newValue) => {
const formattedDate = moment(new Date(newValue)).locale("en").format("YYYY-MM-DD");
onChange(formattedDate); // Update the field value in react-hook-form
}}
helperText={error ? error.message : null}
/>
)}
/>
);
};
export default FromDateController;
import { Controller } from "react-hook-form";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import React from "react";
import moment from "jalali-moment";
const FromDateController = ({ control }) => {
return (
<Controller
name="from_date"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<MuiDatePicker
name="from_date"
error={!!error}
value={value}
label={"تاریخ تصادف (از تاریخ)"}
placeholder={"از تاریخ"}
setFieldValue={(name, newValue) => {
const formattedDate = moment(new Date(newValue)).locale("en").format("YYYY-MM-DD");
onChange(formattedDate); // Update the field value in react-hook-form
}}
helperText={error ? error.message : null}
/>
)}
/>
);
};
export default FromDateController;

90
src/components/dashboard/damages/report/Search/SearchReportField.jsx
View File

@@ -1,45 +1,45 @@
import { Button, Grid, LinearProgress, Typography } from "@mui/material";
import SearchIcon from "@mui/icons-material/Search";
import React from "react";
import FromDateController from "./FromDateController";
import ToDateController from "./ToDateController";
import SelectProvince from "./SelectProvince";
import { Controller } from "react-hook-form";
const SearchReportField = ({ control, hasProvincesPermission }) => {
return (
<Grid container spacing={2} sx={{ py: 2 }}>
<Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
<FromDateController control={control} />
</Grid>
<Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
<ToDateController control={control} />
</Grid>
{hasProvincesPermission && (
<Grid item xs={12} md={3}>
<SelectProvince control={control} />
</Grid>
)}
<Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
<Controller
name="submitButton"
control={control}
render={({ field: { value, onChange }, formState: { isSubmitting } }) => (
<Button
variant="contained"
size="medium"
type="submit"
disabled={isSubmitting}
endIcon={<SearchIcon />}
fullWidth
>
{isSubmitting ? "درحال دریافت اطلاعات" : "جستجو"}
</Button>
)}
/>
</Grid>
</Grid>
);
};
export default SearchReportField;
import { Button, Grid, LinearProgress, Typography } from "@mui/material";
import SearchIcon from "@mui/icons-material/Search";
import React from "react";
import FromDateController from "./FromDateController";
import ToDateController from "./ToDateController";
import SelectProvince from "./SelectProvince";
import { Controller } from "react-hook-form";
const SearchReportField = ({ control, hasProvincesPermission }) => {
return (
<Grid container spacing={2} sx={{ py: 2 }}>
<Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
<FromDateController control={control} />
</Grid>
<Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
<ToDateController control={control} />
</Grid>
{hasProvincesPermission && (
<Grid item xs={12} md={3}>
<SelectProvince control={control} />
</Grid>
)}
<Grid item xs={12} md={hasProvincesPermission ? 3 : 4}>
<Controller
name="submitButton"
control={control}
render={({ field: { value, onChange }, formState: { isSubmitting } }) => (
<Button
variant="contained"
size="medium"
type="submit"
disabled={isSubmitting}
endIcon={<SearchIcon />}
fullWidth
>
{isSubmitting ? "درحال دریافت اطلاعات" : "جستجو"}
</Button>
)}
/>
</Grid>
</Grid>
);
};
export default SearchReportField;

94
src/components/dashboard/damages/report/Search/SelectProvince.jsx
View File

@@ -1,47 +1,47 @@
import { Controller } from "react-hook-form";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import React from "react";
import { FormControl, FormHelperText, InputLabel, LinearProgress, MenuItem, Select, Typography } from "@mui/material";
import useProvinces from "@/lib/hooks/useProvince";
const SelectProvince = ({ control }) => {
const { provinces, loadingProvinces, errorProvinces } = useProvinces();
return (
<Controller
name="province_id"
control={control}
render={({ field, fieldState: { error } }) => (
<FormControl error={!!error} size="small" fullWidth>
<InputLabel id="demo-error-label">استان</InputLabel>
<Select
{...field}
labelId="demo-error-label"
id="province_id"
value={loadingProvinces ? "loading" : field.value || ""}
label="استان"
onChange={field.onChange}
>
{loadingProvinces ? (
<MenuItem value={"loading"}>در حال بارگذاری...</MenuItem>
) : errorProvinces ? (
<MenuItem value={"error"}>خطا در بارگذاری</MenuItem>
) : (
[
<MenuItem key="-1" value={"-1"}>
کل کشور
</MenuItem>,
...provinces.map((province) => (
<MenuItem key={province.id} value={province.id}>
{province.name_fa}
</MenuItem>
)),
]
)}
</Select>
{error && <FormHelperText>{error.message}</FormHelperText>}
</FormControl>
)}
/>
);
};
export default SelectProvince;
import { Controller } from "react-hook-form";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import React from "react";
import { FormControl, FormHelperText, InputLabel, LinearProgress, MenuItem, Select, Typography } from "@mui/material";
import useProvinces from "@/lib/hooks/useProvince";
const SelectProvince = ({ control }) => {
const { provinces, loadingProvinces, errorProvinces } = useProvinces();
return (
<Controller
name="province_id"
control={control}
render={({ field, fieldState: { error } }) => (
<FormControl error={!!error} size="small" fullWidth>
<InputLabel id="demo-error-label">استان</InputLabel>
<Select
{...field}
labelId="demo-error-label"
id="province_id"
value={loadingProvinces ? "loading" : field.value || ""}
label="استان"
onChange={field.onChange}
>
{loadingProvinces ? (
<MenuItem value={"loading"}>در حال بارگذاری...</MenuItem>
) : errorProvinces ? (
<MenuItem value={"error"}>خطا در بارگذاری</MenuItem>
) : (
[
<MenuItem key="-1" value={"-1"}>
کل کشور
</MenuItem>,
...provinces.map((province) => (
<MenuItem key={province.id} value={province.id}>
{province.name_fa}
</MenuItem>
)),
]
)}
</Select>
{error && <FormHelperText>{error.message}</FormHelperText>}
</FormControl>
)}
/>
);
};
export default SelectProvince;

60
src/components/dashboard/damages/report/Search/ToDateController.jsx
View File

@@ -1,30 +1,30 @@
import { Controller, useWatch } from "react-hook-form";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import React from "react";
import moment from "jalali-moment";
const ToDateController = ({ control }) => {
const minDate = useWatch({ control, name: "from_date" });
return (
<Controller
name="date_to"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<MuiDatePicker
name="date_to"
minDate={minDate}
error={!!error}
value={value}
label={"تاریخ تصادف (تا تاریخ)"}
placeholder={"تا تاریخ"}
setFieldValue={(name, newValue) => {
const formattedDate = moment(new Date(newValue)).locale("en").format("YYYY-MM-DD");
onChange(formattedDate); // Update the field value in react-hook-form
}}
helperText={error ? error.message : null}
/>
)}
/>
);
};
export default ToDateController;
import { Controller, useWatch } from "react-hook-form";
import MuiDatePicker from "@/core/components/MuiDatePicker";
import React from "react";
import moment from "jalali-moment";
const ToDateController = ({ control }) => {
const minDate = useWatch({ control, name: "from_date" });
return (
<Controller
name="date_to"
control={control}
render={({ field: { onChange, value }, fieldState: { error } }) => (
<MuiDatePicker
name="date_to"
minDate={minDate}
error={!!error}
value={value}
label={"تاریخ تصادف (تا تاریخ)"}
placeholder={"تا تاریخ"}
setFieldValue={(name, newValue) => {
const formattedDate = moment(new Date(newValue)).locale("en").format("YYYY-MM-DD");
onChange(formattedDate); // Update the field value in react-hook-form
}}
helperText={error ? error.message : null}
/>
)}
/>
);
};
export default ToDateController;

26
src/components/dashboard/damages/report/Search/index.jsx
View File

@@ -1,13 +1,13 @@
import StyledForm from "@/core/components/StyledForm";
import SearchReportField from "./SearchReportField";
const SearchReportList = ({ handleSubmit, onSearchSubmit, control, hasProvincesPermission }) => {
return (
<>
<StyledForm onSubmit={handleSubmit(onSearchSubmit)}>
<SearchReportField control={control} hasProvincesPermission={hasProvincesPermission} />
</StyledForm>
</>
);
};
export default SearchReportList;
import StyledForm from "@/core/components/StyledForm";
import SearchReportField from "./SearchReportField";
const SearchReportList = ({ handleSubmit, onSearchSubmit, control, hasProvincesPermission }) => {
return (
<>
<StyledForm onSubmit={handleSubmit(onSearchSubmit)}>
<SearchReportField control={control} hasProvincesPermission={hasProvincesPermission} />
</StyledForm>
</>
);
};
export default SearchReportList;

22
src/components/dashboard/damages/report/Toolbar.jsx
View File

@@ -1,11 +1,11 @@
import PrintExcel from "./ExcelPrint";
import { Box } from "@mui/material";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<PrintExcel table={table} filterData={filterData} />
</Box>
);
};
export default Toolbar;
import PrintExcel from "./ExcelPrint";
import { Box } from "@mui/material";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<PrintExcel table={table} filterData={filterData} />
</Box>
);
};
export default Toolbar;

Some files were not shown because too many files have changed in this diff Show More