Feature/amiriis missions

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

View File

@@ -1,281 +1,281 @@
import { useEffect, useMemo, useState } from "react";
import { Box, Button, Dialog, DialogActions, Stack, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import RowActions from "./RowActions";
import { GET_FAST_REACT_COMPLAINTS } from "@/core/utils/routes";
import useProvinces from "@/lib/hooks/useProvince";
import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
import { usePermissions } from "@/lib/hooks/usePermissions";
import { useAuth } from "@/lib/contexts/auth";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import DescriptionForm from "./RowActions/DescriptionDialog";
import LocationForm from "./RowActions/LocationDialog";
import moment from "jalali-moment";
const ComplaintListTable = ({ open, setOpen, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasCountryPermission = userPermissions?.includes("show-fast-react");
const { user } = useAuth();
const columns = useMemo(() => {
const dynamicColumns = {
header: "استان",
id: "road_observeds__province_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
grow: false,
size: 130,
ColumnSelectComponent: (props) => {
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
const getColumnSelectOptions = useMemo(() => {
if (loadingProvinces) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorProvinces) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل کشور" },
...provinces.map((province) => ({
value: province.id,
label: province.name_fa,
})),
];
}, [provinces, errorProvinces, loadingProvinces]);
return (
<CustomSelectByDependency
{...props}
value={loadingProvinces ? "loading" : props.filterParameters.value}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ row }) => <>{row.original.province_fa}</>,
};
return [
{
accessorKey: "id",
header: "کد یکتا",
id: "road_observeds__id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
...(hasCountryPermission ? [dynamicColumns] : []),
{
header: "اداره",
id: "road_observeds__edarate_shahri_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
dependencyId: hasCountryPermission ? "road_observeds__province_id" : null,
grow: false,
size: 120,
ColumnSelectComponent: (props) => {
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const [prevDependency, setPrevDependency] = useState(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const getColumnSelectOptions = useMemo(() => {
if (hasCountryPermission && props.dependencyFieldValue.value === "") {
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
}
if (loadingEdaratList) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorEdaratList) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل ادارات" },
...edaratList.map((edare) => ({
value: edare.id,
label: edare.name_fa,
})),
];
}, [edaratList, loadingEdaratList, errorEdaratList]);
useEffect(() => {
if (hasCountryPermission) return;
if (prevDependency === props.dependencyFieldValue?.value) return;
props.handleChange({ ...props.filterParameters, value: "" });
setPrevDependency(props.dependencyFieldValue?.value);
}, [props.dependencyFieldValue?.value, hasCountryPermission]);
return (
<CustomSelectByDependency
{...props}
value={
props.dependencyFieldValue?.value === ""
? "empty"
: loadingEdaratList
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ row }) => <>{row.original.edarate_shahri_name_fa}</>,
},
{
header: "اطلاعات ثبت‌ شده در سامانه سوانح",
id: "fkInfo",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorKey: "fk_RegisteredEventMessage",
header: "کد سوانح",
id: "fk_RegisteredEventMessage",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Title",
header: "موضوع گزارش",
id: "Title",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "FeatureTypeTitle",
header: "نوع گزارش",
id: "FeatureTypeTitle",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Description",
header: "توضیح گزارش",
id: "Description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm description={renderedCellValue} title={"توضیح گزارش"} />
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "موقعیت",
id: "location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
</Stack>
);
},
},
{
accessorKey: "MobileForSendEventSms",
header: "شماره تماس گیرنده",
id: "MobileForSendEventSms",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
header: "تاریخ ثبت",
id: "StartTime_DateTime",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
];
}, []);
return (
<Dialog onClose={() => setOpen(false)} open={open} fullWidth maxWidth={"xl"}>
{open && (
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
table_title={"لیست شکایات"}
columns={columns}
sorting={[{ id: "StartTime_DateTime", desc: true }]}
table_url={GET_FAST_REACT_COMPLAINTS}
page_name={"fastReactComplaint"}
table_name={"fastReactComplaintList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"first"}
RowActions={(props) => <RowActions {...props} mutateParentTable={mutate} />}
/>
</Box>
)}
<DialogActions>
<Button variant={"outlined"} color={"secondary"} onClick={() => setOpen(false)}>
بستن
</Button>
</DialogActions>
</Dialog>
);
};
export default ComplaintListTable;
import { useEffect, useMemo, useState } from "react";
import { Box, Button, Dialog, DialogActions, Stack, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import RowActions from "./RowActions";
import { GET_FAST_REACT_COMPLAINTS } from "@/core/utils/routes";
import useProvinces from "@/lib/hooks/useProvince";
import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
import { usePermissions } from "@/lib/hooks/usePermissions";
import { useAuth } from "@/lib/contexts/auth";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import DescriptionForm from "./RowActions/DescriptionDialog";
import LocationForm from "./RowActions/LocationDialog";
import moment from "jalali-moment";
const ComplaintListTable = ({ open, setOpen, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasCountryPermission = userPermissions?.includes("show-fast-react");
const { user } = useAuth();
const columns = useMemo(() => {
const dynamicColumns = {
header: "استان",
id: "road_observeds__province_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
grow: false,
size: 130,
ColumnSelectComponent: (props) => {
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
const getColumnSelectOptions = useMemo(() => {
if (loadingProvinces) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorProvinces) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل کشور" },
...provinces.map((province) => ({
value: province.id,
label: province.name_fa,
})),
];
}, [provinces, errorProvinces, loadingProvinces]);
return (
<CustomSelectByDependency
{...props}
value={loadingProvinces ? "loading" : props.filterParameters.value}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ row }) => <>{row.original.province_fa}</>,
};
return [
{
accessorKey: "id",
header: "کد یکتا",
id: "road_observeds__id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
...(hasCountryPermission ? [dynamicColumns] : []),
{
header: "اداره",
id: "road_observeds__edarate_shahri_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
dependencyId: hasCountryPermission ? "road_observeds__province_id" : null,
grow: false,
size: 120,
ColumnSelectComponent: (props) => {
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const [prevDependency, setPrevDependency] = useState(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const getColumnSelectOptions = useMemo(() => {
if (hasCountryPermission && props.dependencyFieldValue.value === "") {
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
}
if (loadingEdaratList) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorEdaratList) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل ادارات" },
...edaratList.map((edare) => ({
value: edare.id,
label: edare.name_fa,
})),
];
}, [edaratList, loadingEdaratList, errorEdaratList]);
useEffect(() => {
if (hasCountryPermission) return;
if (prevDependency === props.dependencyFieldValue?.value) return;
props.handleChange({ ...props.filterParameters, value: "" });
setPrevDependency(props.dependencyFieldValue?.value);
}, [props.dependencyFieldValue?.value, hasCountryPermission]);
return (
<CustomSelectByDependency
{...props}
value={
props.dependencyFieldValue?.value === ""
? "empty"
: loadingEdaratList
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ row }) => <>{row.original.edarate_shahri_name_fa}</>,
},
{
header: "اطلاعات ثبت‌ شده در سامانه سوانح",
id: "fkInfo",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorKey: "fk_RegisteredEventMessage",
header: "کد سوانح",
id: "fk_RegisteredEventMessage",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Title",
header: "موضوع گزارش",
id: "Title",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "FeatureTypeTitle",
header: "نوع گزارش",
id: "FeatureTypeTitle",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Description",
header: "توضیح گزارش",
id: "Description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm description={renderedCellValue} title={"توضیح گزارش"} />
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "موقعیت",
id: "location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
</Stack>
);
},
},
{
accessorKey: "MobileForSendEventSms",
header: "شماره تماس گیرنده",
id: "MobileForSendEventSms",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
header: "تاریخ ثبت",
id: "StartTime_DateTime",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
];
}, []);
return (
<Dialog onClose={() => setOpen(false)} open={open} fullWidth maxWidth={"xl"}>
{open && (
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
table_title={"لیست شکایات"}
columns={columns}
sorting={[{ id: "StartTime_DateTime", desc: true }]}
table_url={GET_FAST_REACT_COMPLAINTS}
page_name={"fastReactComplaint"}
table_name={"fastReactComplaintList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"first"}
RowActions={(props) => <RowActions {...props} mutateParentTable={mutate} />}
/>
</Box>
)}
<DialogActions>
<Button variant={"outlined"} color={"secondary"} onClick={() => setOpen(false)}>
بستن
</Button>
</DialogActions>
</Dialog>
);
};
export default ComplaintListTable;

View File

@@ -1,74 +1,74 @@
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 { EXPORT_FAST_REACT_COMPLAINT_LIST } from "@/core/utils/routes";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
const PrintExcel = ({ table, filterData }) => {
const [loading, setLoading] = useState(false);
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const requestServer = useRequest();
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_FAST_REACT_COMPLAINT_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;
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 { EXPORT_FAST_REACT_COMPLAINT_LIST } from "@/core/utils/routes";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
const PrintExcel = ({ table, filterData }) => {
const [loading, setLoading] = useState(false);
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const requestServer = useRequest();
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_FAST_REACT_COMPLAINT_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;

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;

View File

@@ -1,111 +1,111 @@
import StyledForm from "@/core/components/StyledForm";
import { yupResolver } from "@hookform/resolvers/yup";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import { Button, DialogActions, DialogContent, FormControlLabel, RadioGroup, Stack } from "@mui/material";
import Radio from "@mui/material/Radio";
import { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { mixed, object, string } from "yup";
import RegisterActionDone from "./RegisterActionDone";
import RegisterActionUndone from "./RegisterActionUndone";
const RegisterActionContent = ({ setOpen, defaultValues, onBaseSubmit }) => {
const [selectedOption, setSelectedOption] = useState(defaultValues?.rms_status || "1");
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
const validationSchema = object({
description: string().required("توضیحات الزامی است"),
start_point: mixed().when("rms_status", {
is: "1",
then: (schema) =>
schema
.test("start-point-required", "مکان اقدام الزامی است", function (value) {
return !!value;
})
.required("مکان اقدام الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
image_before_1: mixed().when("rms_status", {
is: "1",
then: (schema) => schema.required("تصویر قبل از اقدام الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
image_after_1: mixed().when("rms_status", {
is: "1",
then: (schema) => schema.required("تصویر بعد از اقدام الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
});
const {
control,
handleSubmit,
setValue,
formState: { isSubmitting, errors },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
await onBaseSubmit(data);
};
return (
<StyledForm onSubmit={handleSubmit(onSubmit)}>
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
<RadioGroup
aria-label="file-options"
name="status-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
control={
<Controller
name="rms_status"
control={control}
render={({ field }) => <Radio {...field} value="1" />}
/>
}
label="اقدام انجام شد"
/>
<FormControlLabel
control={
<Controller
name="rms_status"
control={control}
render={({ field }) => <Radio {...field} value="2" />}
/>
}
label="اقدام انجام نشد"
/>
</Stack>
</RadioGroup>
{selectedOption === "1" ? (
<RegisterActionDone control={control} setValue={setValue} errors={errors} />
) : (
<RegisterActionUndone control={control} />
)}
</DialogContent>
<DialogActions>
<Button color={"secondary"} variant={"outlined"} onClick={() => setOpen(false)}>
بستن
</Button>
<Button
disabled={isSubmitting}
endIcon={<BeenhereIcon />}
color={"primary"}
variant={"contained"}
type={"submit"}
>
{isSubmitting ? "درحال ثبت اقدام..." : "ثبت اقدام"}
</Button>
</DialogActions>
</StyledForm>
);
};
export default RegisterActionContent;
import StyledForm from "@/core/components/StyledForm";
import { yupResolver } from "@hookform/resolvers/yup";
import BeenhereIcon from "@mui/icons-material/Beenhere";
import { Button, DialogActions, DialogContent, FormControlLabel, RadioGroup, Stack } from "@mui/material";
import Radio from "@mui/material/Radio";
import { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { mixed, object, string } from "yup";
import RegisterActionDone from "./RegisterActionDone";
import RegisterActionUndone from "./RegisterActionUndone";
const RegisterActionContent = ({ setOpen, defaultValues, onBaseSubmit }) => {
const [selectedOption, setSelectedOption] = useState(defaultValues?.rms_status || "1");
const handleOptionChange = (e) => {
setSelectedOption(e.target.value);
};
const validationSchema = object({
description: string().required("توضیحات الزامی است"),
start_point: mixed().when("rms_status", {
is: "1",
then: (schema) =>
schema
.test("start-point-required", "مکان اقدام الزامی است", function (value) {
return !!value;
})
.required("مکان اقدام الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
image_before_1: mixed().when("rms_status", {
is: "1",
then: (schema) => schema.required("تصویر قبل از اقدام الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
image_after_1: mixed().when("rms_status", {
is: "1",
then: (schema) => schema.required("تصویر بعد از اقدام الزامی است"),
otherwise: (schema) => schema.notRequired(),
}),
});
const {
control,
handleSubmit,
setValue,
formState: { isSubmitting, errors },
} = useForm({
defaultValues,
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
await onBaseSubmit(data);
};
return (
<StyledForm onSubmit={handleSubmit(onSubmit)}>
<DialogContent dividers sx={{ overflowY: "auto", maxHeight: "70vh" }}>
<RadioGroup
aria-label="file-options"
name="status-options"
value={selectedOption}
onChange={handleOptionChange}
>
<Stack direction={"row"} alignItems={"center"} justifyContent={"center"}>
<FormControlLabel
control={
<Controller
name="rms_status"
control={control}
render={({ field }) => <Radio {...field} value="1" />}
/>
}
label="اقدام انجام شد"
/>
<FormControlLabel
control={
<Controller
name="rms_status"
control={control}
render={({ field }) => <Radio {...field} value="2" />}
/>
}
label="اقدام انجام نشد"
/>
</Stack>
</RadioGroup>
{selectedOption === "1" ? (
<RegisterActionDone control={control} setValue={setValue} errors={errors} />
) : (
<RegisterActionUndone control={control} />
)}
</DialogContent>
<DialogActions>
<Button color={"secondary"} variant={"outlined"} onClick={() => setOpen(false)}>
بستن
</Button>
<Button
disabled={isSubmitting}
endIcon={<BeenhereIcon />}
color={"primary"}
variant={"contained"}
type={"submit"}
>
{isSubmitting ? "درحال ثبت اقدام..." : "ثبت اقدام"}
</Button>
</DialogActions>
</StyledForm>
);
};
export default RegisterActionContent;

View File

@@ -1,86 +1,86 @@
import { Controller, useWatch } from "react-hook-form";
import { Grid, Stack, TextField } from "@mui/material";
import ImageUpload from "./ImageUpload";
import MapInfoOneMarker from "@/core/components/MapInfoOneMarker";
const RegisterActionDone = ({ control, setValue, errors }) => {
const StartPoint = useWatch({ control, name: "start_point" });
return (
<Stack spacing={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="description"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<TextField
name={field.name}
value={field.value}
label={"توضیحات"}
placeholder={"لطفا توضیحات خود را وارد کنید"}
onChange={field.onChange}
fullWidth
multiline
rows={4}
error={error}
helperText={error ? error.message : null}
size={"small"}
/>
);
}}
/>
</Grid>
</Grid>
</Stack>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={6}>
<Controller
name="image_before_1"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر قبل از اقدام"}
/>
)}
/>
</Grid>
<Grid item xs={12} sm={6}>
<Controller
name="image_after_1"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر بعد از اقدام"}
/>
)}
/>
</Grid>
</Grid>
</Stack>
<Stack>
<Grid container>
<Grid item xs={12} sm={12}>
<MapInfoOneMarker
setValue={setValue}
StartPoint={StartPoint}
errors={errors}
title={"برای ثبت محل اقدام، لطفاً نقشه را بیشتر زوم کنید."}
/>
</Grid>
</Grid>
</Stack>
</Stack>
);
};
export default RegisterActionDone;
import { Controller, useWatch } from "react-hook-form";
import { Grid, Stack, TextField } from "@mui/material";
import ImageUpload from "./ImageUpload";
import MapInfoOneMarker from "@/core/components/MapInfoOneMarker";
const RegisterActionDone = ({ control, setValue, errors }) => {
const StartPoint = useWatch({ control, name: "start_point" });
return (
<Stack spacing={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="description"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<TextField
name={field.name}
value={field.value}
label={"توضیحات"}
placeholder={"لطفا توضیحات خود را وارد کنید"}
onChange={field.onChange}
fullWidth
multiline
rows={4}
error={error}
helperText={error ? error.message : null}
size={"small"}
/>
);
}}
/>
</Grid>
</Grid>
</Stack>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={6}>
<Controller
name="image_before_1"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر قبل از اقدام"}
/>
)}
/>
</Grid>
<Grid item xs={12} sm={6}>
<Controller
name="image_after_1"
control={control}
render={({ field, fieldState: { error } }) => (
<ImageUpload
name={field.name}
value={field.value}
error={error}
onChange={field.onChange}
title={"تصویر بعد از اقدام"}
/>
)}
/>
</Grid>
</Grid>
</Stack>
<Stack>
<Grid container>
<Grid item xs={12} sm={12}>
<MapInfoOneMarker
setValue={setValue}
StartPoint={StartPoint}
errors={errors}
title={"برای ثبت محل اقدام، لطفاً نقشه را بیشتر زوم کنید."}
/>
</Grid>
</Grid>
</Stack>
</Stack>
);
};
export default RegisterActionDone;

View File

@@ -1,37 +1,37 @@
import { Grid, Stack, TextField } from "@mui/material";
import { Controller } from "react-hook-form";
const RegisterActionUndone = ({ control }) => {
return (
<Stack spacing={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="description"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<TextField
name={field.name}
value={field.value}
label={"توضیحات"}
placeholder={"لطفا توضیحات خود را وارد کنید"}
onChange={field.onChange}
fullWidth
multiline
rows={4}
error={error}
helperText={error ? error.message : null}
size={"small"}
/>
);
}}
/>
</Grid>
</Grid>
</Stack>
</Stack>
);
};
export default RegisterActionUndone;
import { Grid, Stack, TextField } from "@mui/material";
import { Controller } from "react-hook-form";
const RegisterActionUndone = ({ control }) => {
return (
<Stack spacing={2}>
<Stack>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Controller
name="description"
control={control}
render={({ field, fieldState: { error } }) => {
return (
<TextField
name={field.name}
value={field.value}
label={"توضیحات"}
placeholder={"لطفا توضیحات خود را وارد کنید"}
onChange={field.onChange}
fullWidth
multiline
rows={4}
error={error}
helperText={error ? error.message : null}
size={"small"}
/>
);
}}
/>
</Grid>
</Grid>
</Stack>
</Stack>
);
};
export default RegisterActionUndone;

View File

@@ -1,67 +1,67 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import RegisterActionContent from "./RegisterActionContent";
import AppRegistrationIcon from "@mui/icons-material/AppRegistration";
import useRequest from "@/lib/hooks/useRequest";
import { REGISTER_COMPLAINTS_LIST } from "@/core/utils/routes";
const RegisterAction = ({ rowId, mutate, mutateParentTable }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openRegisterActionDialog, setOpenRegisterActionDialog] = useState(false);
const defaultValues = {
rms_status: "1",
description: "",
start_point: "",
image_before_1: null,
image_after_1: null,
};
const onBaseSubmit = async (result) => {
const formData = new FormData();
const rmsLatLng = `${result.start_point.lat},${result.start_point.lng}`;
if (result.rms_status === "1") {
formData.append("rms_description", result.description);
formData.append("rms_status", 1);
formData.append("start_point", rmsLatLng);
formData.append("image_before", result.image_before_1);
formData.append("image_after", result.image_after_1);
} else {
formData.append("rms_description", result.description);
formData.append("rms_status", 2);
}
await requestServer(`${REGISTER_COMPLAINTS_LIST}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then((res) => {
mutate();
mutateParentTable();
setOpenRegisterActionDialog(false);
})
.catch(() => {});
};
return (
<>
<Tooltip title="ثبت اقدام">
<IconButton color="primary" onClick={() => setOpenRegisterActionDialog(true)}>
<AppRegistrationIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openRegisterActionDialog}
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>
<RegisterActionContent
setOpen={setOpenRegisterActionDialog}
onBaseSubmit={onBaseSubmit}
defaultValues={defaultValues}
/>
</Dialog>
</>
);
};
export default RegisterAction;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import RegisterActionContent from "./RegisterActionContent";
import AppRegistrationIcon from "@mui/icons-material/AppRegistration";
import useRequest from "@/lib/hooks/useRequest";
import { REGISTER_COMPLAINTS_LIST } from "@/core/utils/routes";
const RegisterAction = ({ rowId, mutate, mutateParentTable }) => {
const requestServer = useRequest({ notificationSuccess: true });
const [openRegisterActionDialog, setOpenRegisterActionDialog] = useState(false);
const defaultValues = {
rms_status: "1",
description: "",
start_point: "",
image_before_1: null,
image_after_1: null,
};
const onBaseSubmit = async (result) => {
const formData = new FormData();
const rmsLatLng = `${result.start_point.lat},${result.start_point.lng}`;
if (result.rms_status === "1") {
formData.append("rms_description", result.description);
formData.append("rms_status", 1);
formData.append("start_point", rmsLatLng);
formData.append("image_before", result.image_before_1);
formData.append("image_after", result.image_after_1);
} else {
formData.append("rms_description", result.description);
formData.append("rms_status", 2);
}
await requestServer(`${REGISTER_COMPLAINTS_LIST}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then((res) => {
mutate();
mutateParentTable();
setOpenRegisterActionDialog(false);
})
.catch(() => {});
};
return (
<>
<Tooltip title="ثبت اقدام">
<IconButton color="primary" onClick={() => setOpenRegisterActionDialog(true)}>
<AppRegistrationIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openRegisterActionDialog}
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>
<RegisterActionContent
setOpen={setOpenRegisterActionDialog}
onBaseSubmit={onBaseSubmit}
defaultValues={defaultValues}
/>
</Dialog>
</>
);
};
export default RegisterAction;

View File

@@ -1,50 +1,50 @@
import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
import { useState } from "react";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import CloseIcon from "@mui/icons-material/Close";
const DescriptionForm = ({ description, title, icon: IconComponent = RemoveRedEyeIcon }) => {
const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
return (
<>
<Tooltip title={title}>
<IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
<IconComponent />
</IconButton>
</Tooltip>
<Dialog
open={openOfficerDescriptionDialog}
onClose={() => setOpenOfficerDescriptionDialog(false)}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
borderRadius: 2,
padding: 1,
},
}}
maxWidth="sm"
fullWidth
dir="rtl"
>
<DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
<Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
{title}
</Typography>
<IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
<CloseIcon />
</IconButton>
</DialogTitle>
<DialogContent>
<Card elevation={0}>
<CardContent>
<Typography variant="body2">{description || "هیچ توضیحی موجود نیست"} </Typography>
</CardContent>
</Card>
</DialogContent>
</Dialog>
</>
);
};
export default DescriptionForm;
import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
import { useState } from "react";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import CloseIcon from "@mui/icons-material/Close";
const DescriptionForm = ({ description, title, icon: IconComponent = RemoveRedEyeIcon }) => {
const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
return (
<>
<Tooltip title={title}>
<IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
<IconComponent />
</IconButton>
</Tooltip>
<Dialog
open={openOfficerDescriptionDialog}
onClose={() => setOpenOfficerDescriptionDialog(false)}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
borderRadius: 2,
padding: 1,
},
}}
maxWidth="sm"
fullWidth
dir="rtl"
>
<DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
<Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
{title}
</Typography>
<IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
<CloseIcon />
</IconButton>
</DialogTitle>
<DialogContent>
<Card elevation={0}>
<CardContent>
<Typography variant="body2">{description || "هیچ توضیحی موجود نیست"} </Typography>
</CardContent>
</Card>
</DialogContent>
</Dialog>
</>
);
};
export default DescriptionForm;

View File

@@ -1,30 +1,30 @@
"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 }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={start_lat} start_lng={start_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 }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={start_lat} start_lng={start_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;

View File

@@ -1,36 +1,36 @@
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 }) => {
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>
<LocationFormContent
start_lat={start_lat}
start_lng={start_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 }) => {
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>
<LocationFormContent
start_lat={start_lat}
start_lng={start_lng}
setOpenLocationDialog={setOpenLocationDialog}
/>
</Dialog>
</>
);
};
export default LocationForm;

View File

@@ -1,70 +1,70 @@
"use client";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import { FormControl, FormHelperText, InputLabel, MenuItem, OutlinedInput, Select } from "@mui/material";
import { useEffect, useMemo, useState } from "react";
import { useWatch } from "react-hook-form";
const EdarateShahriField = ({ control, field, fieldState: { error } }) => {
const dependencyField = useWatch({ control, name: "province_id" });
return (
<EdarehShahriController
value={field.value}
onChange={field.onChange}
dependencyField={dependencyField}
error={error}
/>
);
};
const EdarehShahriController = ({ value, onChange, dependencyField, error }) => {
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(dependencyField);
const [prevDependency, setPrevDependency] = useState(dependencyField);
const columnSelectOption = useMemo(() => {
if (dependencyField === "") {
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
}
if (loadingEdaratList) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorEdaratList) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return edaratList.map((edare) => ({
value: edare.id,
label: edare.name_fa,
}));
}, [edaratList, loadingEdaratList, errorEdaratList]);
useEffect(() => {
if (prevDependency === dependencyField) return;
onChange("");
setPrevDependency(dependencyField);
}, [dependencyField]);
return (
<FormControl fullWidth error={!!error} size="small">
<InputLabel id={`labeledarat_id`} shrink>
اداره
</InputLabel>
<Select
labelId={`labeledarat_id`}
id={"edarat_id"}
name={`edarat_id`}
value={dependencyField === "" ? "empty" : loadingEdaratList ? "loading" : value}
input={<OutlinedInput label="اداره" />}
size="small"
onChange={(e) => onChange(e.target.value)}
displayEmpty
>
{columnSelectOption.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</Select>
{error && <FormHelperText>{error.message}</FormHelperText>}
</FormControl>
);
};
export default EdarateShahriField;
"use client";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import { FormControl, FormHelperText, InputLabel, MenuItem, OutlinedInput, Select } from "@mui/material";
import { useEffect, useMemo, useState } from "react";
import { useWatch } from "react-hook-form";
const EdarateShahriField = ({ control, field, fieldState: { error } }) => {
const dependencyField = useWatch({ control, name: "province_id" });
return (
<EdarehShahriController
value={field.value}
onChange={field.onChange}
dependencyField={dependencyField}
error={error}
/>
);
};
const EdarehShahriController = ({ value, onChange, dependencyField, error }) => {
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(dependencyField);
const [prevDependency, setPrevDependency] = useState(dependencyField);
const columnSelectOption = useMemo(() => {
if (dependencyField === "") {
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
}
if (loadingEdaratList) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorEdaratList) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return edaratList.map((edare) => ({
value: edare.id,
label: edare.name_fa,
}));
}, [edaratList, loadingEdaratList, errorEdaratList]);
useEffect(() => {
if (prevDependency === dependencyField) return;
onChange("");
setPrevDependency(dependencyField);
}, [dependencyField]);
return (
<FormControl fullWidth error={!!error} size="small">
<InputLabel id={`labeledarat_id`} shrink>
اداره
</InputLabel>
<Select
labelId={`labeledarat_id`}
id={"edarat_id"}
name={`edarat_id`}
value={dependencyField === "" ? "empty" : loadingEdaratList ? "loading" : value}
input={<OutlinedInput label="اداره" />}
size="small"
onChange={(e) => onChange(e.target.value)}
displayEmpty
>
{columnSelectOption.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</Select>
{error && <FormHelperText>{error.message}</FormHelperText>}
</FormControl>
);
};
export default EdarateShahriField;

View File

@@ -1,33 +1,33 @@
import useProvinces from "@/lib/hooks/useProvince";
import { FormControl, FormHelperText, InputLabel, MenuItem, Select } from "@mui/material";
const ProvinceField = ({ field, fieldState: { error } }) => {
const { provinces, loadingProvinces, errorProvinces } = useProvinces();
return (
<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>
) : (
provinces.map((province) => (
<MenuItem key={province.id} value={province.id}>
{province.name_fa}
</MenuItem>
))
)}
</Select>
{error && <FormHelperText>{error.message}</FormHelperText>}
</FormControl>
);
};
export default ProvinceField;
import useProvinces from "@/lib/hooks/useProvince";
import { FormControl, FormHelperText, InputLabel, MenuItem, Select } from "@mui/material";
const ProvinceField = ({ field, fieldState: { error } }) => {
const { provinces, loadingProvinces, errorProvinces } = useProvinces();
return (
<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>
) : (
provinces.map((province) => (
<MenuItem key={province.id} value={province.id}>
{province.name_fa}
</MenuItem>
))
)}
</Select>
{error && <FormHelperText>{error.message}</FormHelperText>}
</FormControl>
);
};
export default ProvinceField;

View File

@@ -1,102 +1,102 @@
import { REFER_FAST_REACT } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
import { Button, DialogActions, DialogContent, Stack, TextField } from "@mui/material";
import { Controller, useForm } from "react-hook-form";
import * as Yup from "yup";
import EdarateShahriField from "./EdarateShahriField";
import ProvinceField from "./ProvinceField";
const ReferContent = ({ row, mutate, setOpenReferDialog }) => {
const requestServer = useRequest({ notificationSuccess: true });
const validationSchema = Yup.object().shape({
province_id: Yup.string().required("لطفاً استان را وارد کنید."),
edarat_shahri_id: Yup.string().required("لطفاً اداره را وارد کنید."),
description: Yup.string().required("لطفاً توضیحات را وارد کنید."),
});
const {
control,
register,
handleSubmit,
formState: { errors, isSubmitting },
} = useForm({
defaultValues: {
province_id: row.original.province_id,
edarat_shahri_id: "",
description: "",
},
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("province_id", data.province_id);
formData.append("edarate_shahri_id", data.edarat_shahri_id);
formData.append("refer_description", data.description);
await requestServer(`${REFER_FAST_REACT}/${row.original.id}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenReferDialog(false);
})
.catch(() => {});
};
return (
<>
<DialogContent dividers>
<Stack spacing={2}>
{/* <Controller
control={control}
name={"province_id"}
render={(props) => {
return <ProvinceField {...props} />;
}}
/> */}
<Controller
control={control}
name={"edarat_shahri_id"}
render={(props) => {
return <EdarateShahriField {...props} control={control} />;
}}
/>
<Stack>
<TextField
{...register("description")}
multiline
rows={5}
label="توضیحات و دلایل ارجاع"
placeholder="لطفاً علت ارجاع خود را توضیح دهید"
error={!!errors.description}
helperText={errors.description?.message}
fullWidth
variant="outlined"
sx={{ mt: 1 }}
InputLabelProps={{ shrink: true }}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenReferDialog(false)}
variant="outlined"
color="secondary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
{isSubmitting ? "درحال ارجاع..." : "ارجاع"}
</Button>
</DialogActions>
</>
);
};
export default ReferContent;
import { REFER_FAST_REACT } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { yupResolver } from "@hookform/resolvers/yup";
import { Button, DialogActions, DialogContent, Stack, TextField } from "@mui/material";
import { Controller, useForm } from "react-hook-form";
import * as Yup from "yup";
import EdarateShahriField from "./EdarateShahriField";
import ProvinceField from "./ProvinceField";
const ReferContent = ({ row, mutate, setOpenReferDialog }) => {
const requestServer = useRequest({ notificationSuccess: true });
const validationSchema = Yup.object().shape({
province_id: Yup.string().required("لطفاً استان را وارد کنید."),
edarat_shahri_id: Yup.string().required("لطفاً اداره را وارد کنید."),
description: Yup.string().required("لطفاً توضیحات را وارد کنید."),
});
const {
control,
register,
handleSubmit,
formState: { errors, isSubmitting },
} = useForm({
defaultValues: {
province_id: row.original.province_id,
edarat_shahri_id: "",
description: "",
},
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("province_id", data.province_id);
formData.append("edarate_shahri_id", data.edarat_shahri_id);
formData.append("refer_description", data.description);
await requestServer(`${REFER_FAST_REACT}/${row.original.id}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenReferDialog(false);
})
.catch(() => {});
};
return (
<>
<DialogContent dividers>
<Stack spacing={2}>
{/* <Controller
control={control}
name={"province_id"}
render={(props) => {
return <ProvinceField {...props} />;
}}
/> */}
<Controller
control={control}
name={"edarat_shahri_id"}
render={(props) => {
return <EdarateShahriField {...props} control={control} />;
}}
/>
<Stack>
<TextField
{...register("description")}
multiline
rows={5}
label="توضیحات و دلایل ارجاع"
placeholder="لطفاً علت ارجاع خود را توضیح دهید"
error={!!errors.description}
helperText={errors.description?.message}
fullWidth
variant="outlined"
sx={{ mt: 1 }}
InputLabelProps={{ shrink: true }}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenReferDialog(false)}
variant="outlined"
color="secondary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
{isSubmitting ? "درحال ارجاع..." : "ارجاع"}
</Button>
</DialogActions>
</>
);
};
export default ReferContent;

View File

@@ -1,32 +1,32 @@
import SettingsBackupRestoreIcon from "@mui/icons-material/SettingsBackupRestore";
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ReferContent from "./ReferContent";
const Refer = ({ row, mutate }) => {
const [openReferDialog, setOpenReferDialog] = useState(false);
return (
<>
<Tooltip title="ارجاع">
<IconButton color="primary" onClick={() => setOpenReferDialog(true)}>
<SettingsBackupRestoreIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openReferDialog}
maxWidth="xs"
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>
{openReferDialog && <ReferContent mutate={mutate} row={row} setOpenReferDialog={setOpenReferDialog} />}
</Dialog>
</>
);
};
export default Refer;
import SettingsBackupRestoreIcon from "@mui/icons-material/SettingsBackupRestore";
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ReferContent from "./ReferContent";
const Refer = ({ row, mutate }) => {
const [openReferDialog, setOpenReferDialog] = useState(false);
return (
<>
<Tooltip title="ارجاع">
<IconButton color="primary" onClick={() => setOpenReferDialog(true)}>
<SettingsBackupRestoreIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openReferDialog}
maxWidth="xs"
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>
{openReferDialog && <ReferContent mutate={mutate} row={row} setOpenReferDialog={setOpenReferDialog} />}
</Dialog>
</>
);
};
export default Refer;

View File

@@ -1,82 +1,82 @@
import DialogLoading from "@/core/components/DialogLoading";
import { GET_FAST_REACT_REFER_LIST } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import {
DialogContent,
Table,
TableBody,
TableCell,
TableContainer,
TableHead,
TableRow,
Typography,
} from "@mui/material";
import moment from "jalali-moment";
import { useEffect, useState } from "react";
const ReferListContent = ({ 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_FAST_REACT_REFER_LIST}/${rowId}`);
setData(response.data.data);
} catch (error) {
} finally {
setLoading(false);
}
};
fetchData();
}, [rowId]);
return (
<>
<DialogContent>
{loading ? (
<DialogLoading />
) : data.length !== 0 ? (
<TableContainer sx={{ maxHeight: 600 }}>
<Table stickyHeader sx={{ minWidth: 800 }}>
<TableHead>
<TableRow>
<TableCell>کاربر</TableCell>
<TableCell>از اداره</TableCell>
<TableCell>به اداره</TableCell>
<TableCell>تاریخ</TableCell>
<TableCell>توضیحات</TableCell>
</TableRow>
</TableHead>
<TableBody>
{data.map((refer, index) => {
const formatLocation = (province, edareh) =>
province ? `${province} | ${edareh}` : edareh;
return (
<TableRow key={refer.id || index}>
<TableCell>{refer.user}</TableCell>
<TableCell>
{formatLocation(refer.from_province, refer.from_edareh)}
</TableCell>
<TableCell>{formatLocation(refer.to_province, refer.to_edareh)}</TableCell>
<TableCell>
{moment(refer.created_at).locale("fa").format("HH:mm | yyyy/MM/DD")}
</TableCell>
<TableCell>{refer.description}</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</TableContainer>
) : (
<Typography textAlign={"center"}>ارجاعی در سامانه یافت نشد</Typography>
)}
</DialogContent>
</>
);
};
export default ReferListContent;
import DialogLoading from "@/core/components/DialogLoading";
import { GET_FAST_REACT_REFER_LIST } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import {
DialogContent,
Table,
TableBody,
TableCell,
TableContainer,
TableHead,
TableRow,
Typography,
} from "@mui/material";
import moment from "jalali-moment";
import { useEffect, useState } from "react";
const ReferListContent = ({ 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_FAST_REACT_REFER_LIST}/${rowId}`);
setData(response.data.data);
} catch (error) {
} finally {
setLoading(false);
}
};
fetchData();
}, [rowId]);
return (
<>
<DialogContent>
{loading ? (
<DialogLoading />
) : data.length !== 0 ? (
<TableContainer sx={{ maxHeight: 600 }}>
<Table stickyHeader sx={{ minWidth: 800 }}>
<TableHead>
<TableRow>
<TableCell>کاربر</TableCell>
<TableCell>از اداره</TableCell>
<TableCell>به اداره</TableCell>
<TableCell>تاریخ</TableCell>
<TableCell>توضیحات</TableCell>
</TableRow>
</TableHead>
<TableBody>
{data.map((refer, index) => {
const formatLocation = (province, edareh) =>
province ? `${province} | ${edareh}` : edareh;
return (
<TableRow key={refer.id || index}>
<TableCell>{refer.user}</TableCell>
<TableCell>
{formatLocation(refer.from_province, refer.from_edareh)}
</TableCell>
<TableCell>{formatLocation(refer.to_province, refer.to_edareh)}</TableCell>
<TableCell>
{moment(refer.created_at).locale("fa").format("HH:mm | yyyy/MM/DD")}
</TableCell>
<TableCell>{refer.description}</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</TableContainer>
) : (
<Typography textAlign={"center"}>ارجاعی در سامانه یافت نشد</Typography>
)}
</DialogContent>
</>
);
};
export default ReferListContent;

View File

@@ -1,43 +1,43 @@
import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
import ListAltIcon from "@mui/icons-material/ListAlt";
import ReferListContent from "./ReferListContent";
import { useState } from "react";
const ReferList = ({ rowId }) => {
const [openReferListDialog, setOpenReferListDialog] = useState(false);
return (
<>
<Tooltip title="لیست ارجاعات">
<IconButton color="primary" onClick={() => setOpenReferListDialog(true)}>
<ListAltIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openReferListDialog}
onClose={() => setOpenReferListDialog(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>
{openReferListDialog && <ReferListContent rowId={rowId} />}
<DialogActions>
<Button
onClick={() => setOpenReferListDialog(false)}
variant="outlined"
color="secondary"
autoFocus
>
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ReferList;
import { Button, Dialog, DialogActions, DialogTitle, IconButton, Tooltip } from "@mui/material";
import ListAltIcon from "@mui/icons-material/ListAlt";
import ReferListContent from "./ReferListContent";
import { useState } from "react";
const ReferList = ({ rowId }) => {
const [openReferListDialog, setOpenReferListDialog] = useState(false);
return (
<>
<Tooltip title="لیست ارجاعات">
<IconButton color="primary" onClick={() => setOpenReferListDialog(true)}>
<ListAltIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openReferListDialog}
onClose={() => setOpenReferListDialog(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>
{openReferListDialog && <ReferListContent rowId={rowId} />}
<DialogActions>
<Button
onClick={() => setOpenReferListDialog(false)}
variant="outlined"
color="secondary"
autoFocus
>
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ReferList;

View File

@@ -1,24 +1,24 @@
import { Box } from "@mui/material";
import RegisterAction from "../Form/registerAction";
import ReferList from "./ReferList";
import Refer from "./Refer";
import { usePermissions } from "@/lib/hooks/usePermissions";
const RowActions = ({ row, mutate, mutateParentTable }) => {
const { data: userPermissions } = usePermissions();
const hasActionPermission = userPermissions.includes("show-fast-react-edarate-shahri");
return (
<Box sx={{ display: "flex", gap: 1 }}>
{hasActionPermission && (
<RegisterAction
mutate={mutate}
mutateParentTable={mutateParentTable}
rowId={row.getValue("road_observeds__id")}
/>
)}
<Refer row={row} mutate={mutate} />
<ReferList rowId={row.getValue("road_observeds__id")} />
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import RegisterAction from "../Form/registerAction";
import ReferList from "./ReferList";
import Refer from "./Refer";
import { usePermissions } from "@/lib/hooks/usePermissions";
const RowActions = ({ row, mutate, mutateParentTable }) => {
const { data: userPermissions } = usePermissions();
const hasActionPermission = userPermissions.includes("show-fast-react-edarate-shahri");
return (
<Box sx={{ display: "flex", gap: 1 }}>
{hasActionPermission && (
<RegisterAction
mutate={mutate}
mutateParentTable={mutateParentTable}
rowId={row.getValue("road_observeds__id")}
/>
)}
<Refer row={row} mutate={mutate} />
<ReferList rowId={row.getValue("road_observeds__id")} />
</Box>
);
};
export default RowActions;

View File

@@ -1,11 +1,11 @@
import { Stack } from "@mui/material";
import PrintExcel from "./ExcelPrint";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Stack direction={"row"} spacing={2}>
<PrintExcel table={table} filterData={filterData} />
</Stack>
);
};
export default Toolbar;
import { Stack } from "@mui/material";
import PrintExcel from "./ExcelPrint";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Stack direction={"row"} spacing={2}>
<PrintExcel table={table} filterData={filterData} />
</Stack>
);
};
export default Toolbar;

View File

@@ -1,45 +1,45 @@
import { Badge, Button, IconButton, useMediaQuery } from "@mui/material";
import ChecklistIcon from "@mui/icons-material/Checklist";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import ComplaintListTable from "./ComplaintListTable";
import { useSidebarBadge } from "@/lib/hooks/useSidebarBadge";
import { getValueByPath } from "@/core/utils/getValueByPath";
const ComplaintList = ({ mutate }) => {
const { data } = useSidebarBadge();
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}>
<ChecklistIcon sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Badge
badgeContent={data ? getValueByPath(data, "roadObserved.complaint_cnt").toLocaleString() : 0}
max={999999}
color="warning"
>
<Button
size={"small"}
variant="contained"
color="primary"
startIcon={<ChecklistIcon />}
onClick={handleOpen}
>
لیست شکایات
</Button>
</Badge>
)}
<ComplaintListTable open={open} setOpen={setOpen} mutate={mutate} />
</>
);
};
export default ComplaintList;
import { Badge, Button, IconButton, useMediaQuery } from "@mui/material";
import ChecklistIcon from "@mui/icons-material/Checklist";
import { useTheme } from "@emotion/react";
import { useState } from "react";
import ComplaintListTable from "./ComplaintListTable";
import { useSidebarBadge } from "@/lib/hooks/useSidebarBadge";
import { getValueByPath } from "@/core/utils/getValueByPath";
const ComplaintList = ({ mutate }) => {
const { data } = useSidebarBadge();
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}>
<ChecklistIcon sx={{ fontSize: "25px" }} />
</IconButton>
) : (
<Badge
badgeContent={data ? getValueByPath(data, "roadObserved.complaint_cnt").toLocaleString() : 0}
max={999999}
color="warning"
>
<Button
size={"small"}
variant="contained"
color="primary"
startIcon={<ChecklistIcon />}
onClick={handleOpen}
>
لیست شکایات
</Button>
</Badge>
)}
<ComplaintListTable open={open} setOpen={setOpen} mutate={mutate} />
</>
);
};
export default ComplaintList;

View File

@@ -1,75 +1,75 @@
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 { EXPORT_FAST_REACT_OPERATOR_LIST } from "@/core/utils/routes";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
const PrintExcel = ({ table, filterData }) => {
const [loading, setLoading] = useState(false);
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const requestServer = useRequest();
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_FAST_REACT_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;
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 { EXPORT_FAST_REACT_OPERATOR_LIST } from "@/core/utils/routes";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
const PrintExcel = ({ table, filterData }) => {
const [loading, setLoading] = useState(false);
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const requestServer = useRequest();
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_FAST_REACT_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;

View File

@@ -1,72 +1,72 @@
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_FAST_REACT_ITEM_DETAIL, UPDATE_FAST_REACT } from "@/core/utils/routes";
import DialogLoading from "@/core/components/DialogLoading";
import RegisterActionContent from "@/components/dashboard/fastReact/complaintList/Form/registerAction/RegisterActionContent";
const EditController = ({ rowId, mutate, setOpenEditDialog }) => {
const requestServer = useRequest();
const [fastReactItemDetails, setFastReactItemDetails] = useState(null);
const [fastReactItemDetailsLoading, setFastReactItemDetailsLoading] = useState(false);
useEffect(() => {
setFastReactItemDetailsLoading(true);
requestServer(`${GET_FAST_REACT_ITEM_DETAIL}/${rowId}`, "get")
.then((response) => {
setFastReactItemDetails(response.data.data);
setFastReactItemDetailsLoading(false);
})
.catch((e) => {
setFastReactItemDetailsLoading(false);
});
}, [rowId]);
const startPoint = fastReactItemDetails?.rms_start_latlng
? { lat: fastReactItemDetails?.rms_start_latlng[0], lng: fastReactItemDetails?.rms_start_latlng[1] }
: { lat: "", lng: "" };
const defaultData = {
rms_status: `${fastReactItemDetails?.rms_status || "1"}`,
description: fastReactItemDetails?.rms_description || "",
start_point: startPoint,
image_before_1: fastReactItemDetails?.image_before || null,
image_after_1: fastReactItemDetails?.image_after || null,
};
const HandleSubmit = async (result) => {
const formData = new FormData();
const rmsLatLng = `${result.start_point.lat},${result.start_point.lng}`;
if (result.rms_status === "1") {
formData.append("rms_description", result.description);
formData.append("rms_status", 1);
formData.append("start_point", rmsLatLng);
result.image_before_1 !== defaultData.image_before_1 &&
formData.append("image_before", result.image_before_1);
result.image_after_1 !== defaultData.image_after_1 && formData.append("image_after", result.image_after_1);
} else {
formData.append("rms_description", result.description);
formData.append("rms_status", 2);
}
await requestServer(`${UPDATE_FAST_REACT}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenEditDialog(false);
})
.catch(() => {});
};
return (
<>
{fastReactItemDetailsLoading ? (
<DialogLoading />
) : (
<RegisterActionContent
setOpen={setOpenEditDialog}
onBaseSubmit={HandleSubmit}
defaultValues={defaultData}
/>
)}
</>
);
};
export default EditController;
import useRequest from "@/lib/hooks/useRequest";
import { useEffect, useState } from "react";
import { GET_FAST_REACT_ITEM_DETAIL, UPDATE_FAST_REACT } from "@/core/utils/routes";
import DialogLoading from "@/core/components/DialogLoading";
import RegisterActionContent from "@/components/dashboard/fastReact/complaintList/Form/registerAction/RegisterActionContent";
const EditController = ({ rowId, mutate, setOpenEditDialog }) => {
const requestServer = useRequest();
const [fastReactItemDetails, setFastReactItemDetails] = useState(null);
const [fastReactItemDetailsLoading, setFastReactItemDetailsLoading] = useState(false);
useEffect(() => {
setFastReactItemDetailsLoading(true);
requestServer(`${GET_FAST_REACT_ITEM_DETAIL}/${rowId}`, "get")
.then((response) => {
setFastReactItemDetails(response.data.data);
setFastReactItemDetailsLoading(false);
})
.catch((e) => {
setFastReactItemDetailsLoading(false);
});
}, [rowId]);
const startPoint = fastReactItemDetails?.rms_start_latlng
? { lat: fastReactItemDetails?.rms_start_latlng[0], lng: fastReactItemDetails?.rms_start_latlng[1] }
: { lat: "", lng: "" };
const defaultData = {
rms_status: `${fastReactItemDetails?.rms_status || "1"}`,
description: fastReactItemDetails?.rms_description || "",
start_point: startPoint,
image_before_1: fastReactItemDetails?.image_before || null,
image_after_1: fastReactItemDetails?.image_after || null,
};
const HandleSubmit = async (result) => {
const formData = new FormData();
const rmsLatLng = `${result.start_point.lat},${result.start_point.lng}`;
if (result.rms_status === "1") {
formData.append("rms_description", result.description);
formData.append("rms_status", 1);
formData.append("start_point", rmsLatLng);
result.image_before_1 !== defaultData.image_before_1 &&
formData.append("image_before", result.image_before_1);
result.image_after_1 !== defaultData.image_after_1 && formData.append("image_after", result.image_after_1);
} else {
formData.append("rms_description", result.description);
formData.append("rms_status", 2);
}
await requestServer(`${UPDATE_FAST_REACT}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenEditDialog(false);
})
.catch(() => {});
};
return (
<>
{fastReactItemDetailsLoading ? (
<DialogLoading />
) : (
<RegisterActionContent
setOpen={setOpenEditDialog}
onBaseSubmit={HandleSubmit}
defaultValues={defaultData}
/>
)}
</>
);
};
export default EditController;

View File

@@ -1,58 +1,58 @@
import BorderColorIcon from "@mui/icons-material/BorderColor";
import CloseIcon from "@mui/icons-material/Close";
import { Dialog, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import EditController from "./EditController";
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
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 BorderColorIcon from "@mui/icons-material/BorderColor";
import CloseIcon from "@mui/icons-material/Close";
import { Dialog, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import EditController from "./EditController";
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
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;

View File

@@ -1,370 +1,370 @@
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_FAST_REACT_OPERATOR } from "@/core/utils/routes";
import EngineeringIcon from "@mui/icons-material/Engineering";
import ThreePIcon from "@mui/icons-material/ThreeP";
import { Box, Stack, Typography } from "@mui/material";
import moment from "jalali-moment";
import { useMemo } from "react";
import RowActions from "./RowActions";
import DescriptionForm from "./RowActions/DescriptionDialog";
import ImageDialog from "./RowActions/ImageDialog";
import LocationForm from "./RowActions/LocationDialog";
import Toolbar from "./Toolbar";
import BlinkingCell from "@/core/components/BlinkingCell";
const OperatorList = () => {
const statusOptions = [
{ value: "", label: "همه وضعیت ها" },
{ value: 0, label: "درحال بررسی" },
{ value: 1, label: "تایید شده" },
{ value: 2, label: "عدم تایید" },
];
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "road_observeds__id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
Cell: ({ row }) => <BlinkingCell value={row.original.id} visible={row.original.status == 2} />,
},
{
header: "اطلاعات ثبت‌ شده در سامانه سوانح",
id: "fkInfo",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorKey: "fk_RegisteredEventMessage",
header: "کد سوانح",
id: "fk_RegisteredEventMessage",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Title",
header: "موضوع گزارش",
id: "Title",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "FeatureTypeTitle",
header: "نوع گزارش",
id: "FeatureTypeTitle",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Description",
header: "توضیح گزارش",
id: "Description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm description={renderedCellValue} title={"توضیحات گزارش"} />
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "موقعیت",
id: "location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.lat) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
</Stack>
);
},
},
{
accessorKey: "MobileForSendEventSms",
header: "شماره تماس گیرنده",
id: "MobileForSendEventSms",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
header: "تاریخ ثبت",
id: "StartTime_DateTime",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
header: "اطلاعات اقدام",
id: "rms_register",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorFn: (row) => (row.rms_status == 1 ? "اقدام انجام شد" : "اقدام انجام نشد"),
header: "وضعیت اقدام",
id: "rms_register_status",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
},
{
accessorKey: "rms_description",
header: "توضیح مامور",
id: "rms_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات مامور"}
icon={EngineeringIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "تصاویر",
id: "rms_images",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original?.image_before && !row.original?.image_after) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
{row.original?.image_before && row.original?.image_after && (
<ImageDialog
image_before={row.original?.image_before}
image_after={row.original?.image_after}
/>
)}
</Stack>
);
},
},
{
header: "موقعیت",
id: "rms_location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.rms_start_latlng) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm
start_lat={row.original.rms_start_latlng[0]}
start_lng={row.original.rms_start_latlng[1]}
/>
</Stack>
);
},
},
{
accessorFn: (row) => {
return row.rms_last_activity
? moment(row?.rms_last_activity).locale("fa").format("HH:mm | yyyy/MM/DD")
: "-";
},
header: "تاریخ اقدام",
id: "rms_last_activity",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
accessorKey: "status",
header: "وضعیت نظارت",
id: "status",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
sortDescFirst: true,
grow: false,
size: 100,
columnSelectOption: () => {
return statusOptions.map((status) => ({
value: status.value,
label: status.label,
}));
},
Cell: ({ row }) => <>{row.original.status_fa}</>,
},
{
accessorKey: "supervisor_description",
header: "توضیح ناظر",
id: "supervisor_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات ناظر"}
icon={ThreePIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
],
[]
);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
columns={columns}
sorting={[
{ id: "status", desc: true },
{ id: "road_observeds__id", desc: true },
]}
table_url={GET_FAST_REACT_OPERATOR}
page_name={"fastReactOperator"}
table_name={"fastReactOperatorList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"first"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default OperatorList;
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_FAST_REACT_OPERATOR } from "@/core/utils/routes";
import EngineeringIcon from "@mui/icons-material/Engineering";
import ThreePIcon from "@mui/icons-material/ThreeP";
import { Box, Stack, Typography } from "@mui/material";
import moment from "jalali-moment";
import { useMemo } from "react";
import RowActions from "./RowActions";
import DescriptionForm from "./RowActions/DescriptionDialog";
import ImageDialog from "./RowActions/ImageDialog";
import LocationForm from "./RowActions/LocationDialog";
import Toolbar from "./Toolbar";
import BlinkingCell from "@/core/components/BlinkingCell";
const OperatorList = () => {
const statusOptions = [
{ value: "", label: "همه وضعیت ها" },
{ value: 0, label: "درحال بررسی" },
{ value: 1, label: "تایید شده" },
{ value: 2, label: "عدم تایید" },
];
const columns = useMemo(
() => [
{
accessorKey: "id",
header: "کد یکتا",
id: "road_observeds__id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
Cell: ({ row }) => <BlinkingCell value={row.original.id} visible={row.original.status == 2} />,
},
{
header: "اطلاعات ثبت‌ شده در سامانه سوانح",
id: "fkInfo",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorKey: "fk_RegisteredEventMessage",
header: "کد سوانح",
id: "fk_RegisteredEventMessage",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Title",
header: "موضوع گزارش",
id: "Title",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "FeatureTypeTitle",
header: "نوع گزارش",
id: "FeatureTypeTitle",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Description",
header: "توضیح گزارش",
id: "Description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm description={renderedCellValue} title={"توضیحات گزارش"} />
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "موقعیت",
id: "location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.lat) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
</Stack>
);
},
},
{
accessorKey: "MobileForSendEventSms",
header: "شماره تماس گیرنده",
id: "MobileForSendEventSms",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
header: "تاریخ ثبت",
id: "StartTime_DateTime",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
header: "اطلاعات اقدام",
id: "rms_register",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorFn: (row) => (row.rms_status == 1 ? "اقدام انجام شد" : "اقدام انجام نشد"),
header: "وضعیت اقدام",
id: "rms_register_status",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
},
{
accessorKey: "rms_description",
header: "توضیح مامور",
id: "rms_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات مامور"}
icon={EngineeringIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "تصاویر",
id: "rms_images",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original?.image_before && !row.original?.image_after) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
{row.original?.image_before && row.original?.image_after && (
<ImageDialog
image_before={row.original?.image_before}
image_after={row.original?.image_after}
/>
)}
</Stack>
);
},
},
{
header: "موقعیت",
id: "rms_location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.rms_start_latlng) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm
start_lat={row.original.rms_start_latlng[0]}
start_lng={row.original.rms_start_latlng[1]}
/>
</Stack>
);
},
},
{
accessorFn: (row) => {
return row.rms_last_activity
? moment(row?.rms_last_activity).locale("fa").format("HH:mm | yyyy/MM/DD")
: "-";
},
header: "تاریخ اقدام",
id: "rms_last_activity",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
accessorKey: "status",
header: "وضعیت نظارت",
id: "status",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
sortDescFirst: true,
grow: false,
size: 100,
columnSelectOption: () => {
return statusOptions.map((status) => ({
value: status.value,
label: status.label,
}));
},
Cell: ({ row }) => <>{row.original.status_fa}</>,
},
{
accessorKey: "supervisor_description",
header: "توضیح ناظر",
id: "supervisor_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات ناظر"}
icon={ThreePIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
],
[]
);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
columns={columns}
sorting={[
{ id: "status", desc: true },
{ id: "road_observeds__id", desc: true },
]}
table_url={GET_FAST_REACT_OPERATOR}
page_name={"fastReactOperator"}
table_name={"fastReactOperatorList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"first"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default OperatorList;

View File

@@ -1,50 +1,50 @@
import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
import { useState } from "react";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import CloseIcon from "@mui/icons-material/Close";
const DescriptionForm = ({ description, title, icon: IconComponent = RemoveRedEyeIcon }) => {
const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
return (
<>
<Tooltip title={title}>
<IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
<IconComponent />
</IconButton>
</Tooltip>
<Dialog
open={openOfficerDescriptionDialog}
onClose={() => setOpenOfficerDescriptionDialog(false)}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
borderRadius: 2,
padding: 1,
},
}}
maxWidth="sm"
fullWidth
dir="rtl"
>
<DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
<Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
{title}
</Typography>
<IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
<CloseIcon />
</IconButton>
</DialogTitle>
<DialogContent>
<Card elevation={0}>
<CardContent>
<Typography variant="body2">{description || "هیچ توضیحی موجود نیست"} </Typography>
</CardContent>
</Card>
</DialogContent>
</Dialog>
</>
);
};
export default DescriptionForm;
import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
import { useState } from "react";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import CloseIcon from "@mui/icons-material/Close";
const DescriptionForm = ({ description, title, icon: IconComponent = RemoveRedEyeIcon }) => {
const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
return (
<>
<Tooltip title={title}>
<IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
<IconComponent />
</IconButton>
</Tooltip>
<Dialog
open={openOfficerDescriptionDialog}
onClose={() => setOpenOfficerDescriptionDialog(false)}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
borderRadius: 2,
padding: 1,
},
}}
maxWidth="sm"
fullWidth
dir="rtl"
>
<DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
<Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
{title}
</Typography>
<IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
<CloseIcon />
</IconButton>
</DialogTitle>
<DialogContent>
<Card elevation={0}>
<CardContent>
<Typography variant="body2">{description || "هیچ توضیحی موجود نیست"} </Typography>
</CardContent>
</Card>
</DialogContent>
</Dialog>
</>
);
};
export default DescriptionForm;

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;

View File

@@ -1,46 +1,46 @@
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ImageFormContent from "./ImageFormContent";
const ImageDialog = ({ image_before, image_after }) => {
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>
<DialogContent>
{openImageDialog && (
<>
<ImageFormContent image={image_before} title={"عکس قبل از اقدام"} />
<ImageFormContent image={image_after} title={"عکس بعد از اقدام"} />
</>
)}
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ImageDialog;
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ImageFormContent from "./ImageFormContent";
const ImageDialog = ({ image_before, image_after }) => {
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>
<DialogContent>
{openImageDialog && (
<>
<ImageFormContent image={image_before} title={"عکس قبل از اقدام"} />
<ImageFormContent image={image_after} title={"عکس بعد از اقدام"} />
</>
)}
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ImageDialog;

View File

@@ -1,30 +1,30 @@
"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 }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={start_lat} start_lng={start_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 }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={start_lat} start_lng={start_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;

View File

@@ -1,36 +1,36 @@
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 }) => {
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>
<LocationFormContent
start_lat={start_lat}
start_lng={start_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 }) => {
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>
<LocationFormContent
start_lat={start_lat}
start_lng={start_lng}
setOpenLocationDialog={setOpenLocationDialog}
/>
</Dialog>
</>
);
};
export default LocationForm;

View File

@@ -1,13 +1,13 @@
import { Box } from "@mui/material";
import EditForm from "../Form/EditForm";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
{row.original.status === 2 && (
<EditForm row={row} rowId={row.getValue("road_observeds__id")} mutate={mutate} />
)}
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import EditForm from "../Form/EditForm";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
{row.original.status === 2 && (
<EditForm row={row} rowId={row.getValue("road_observeds__id")} mutate={mutate} />
)}
</Box>
);
};
export default RowActions;

View File

@@ -1,13 +1,13 @@
import PrintExcel from "./ExcelPrint";
import ComplaintList from "../complaintList";
import { Stack } from "@mui/material";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Stack direction={"row"} spacing={1}>
<PrintExcel table={table} filterData={filterData} />
<ComplaintList mutate={mutate} />
</Stack>
);
};
export default Toolbar;
import PrintExcel from "./ExcelPrint";
import ComplaintList from "../complaintList";
import { Stack } from "@mui/material";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Stack direction={"row"} spacing={1}>
<PrintExcel table={table} filterData={filterData} />
<ComplaintList mutate={mutate} />
</Stack>
);
};
export default Toolbar;

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;

View File

@@ -1,75 +1,75 @@
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 { EXPORT_FAST_REACT_SUPERVISOR_LIST } from "@/core/utils/routes";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
const PrintExcel = ({ table, filterData }) => {
const [loading, setLoading] = useState(false);
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const requestServer = useRequest();
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_FAST_REACT_SUPERVISOR_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;
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 { EXPORT_FAST_REACT_SUPERVISOR_LIST } from "@/core/utils/routes";
import { useTheme } from "@emotion/react";
import DataTableFilterDataStructure from "@/core/utils/DataTableFilterDataStructure";
import isArrayEmpty from "@/core/utils/isArrayEmpty";
const PrintExcel = ({ table, filterData }) => {
const [loading, setLoading] = useState(false);
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
const requestServer = useRequest();
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_FAST_REACT_SUPERVISOR_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;

View File

@@ -1,70 +1,70 @@
import { Button, DialogActions, DialogContent, Stack, TextField } from "@mui/material";
import { useForm } from "react-hook-form";
import useRequest from "@/lib/hooks/useRequest";
import { VERIFY_BY_FAST_REACT_SUPERVISOR } from "@/core/utils/routes";
const ConfirmContent = ({ rowId, mutate, setOpenConfirmDialog }) => {
const requestServer = useRequest({ notificationSuccess: true });
const {
register,
handleSubmit,
formState: { isSubmitting },
} = useForm({
defaultValues: {
description: "",
},
});
const onSubmit = async (data) => {
const formData = new FormData();
data.description !== "" && formData.append("description", data.description);
formData.append("verify", 1);
requestServer(`${VERIFY_BY_FAST_REACT_SUPERVISOR}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenConfirmDialog(false);
})
.catch(() => {});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
{...register("description")}
multiline
rows={8}
label="توضیحات و دلایل تأیید (اختیاری)"
placeholder="لطفاً علت تأیید خود را توضیح دهید"
fullWidth
variant="outlined"
sx={{ mt: 1 }}
InputLabelProps={{ shrink: true }}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenConfirmDialog(false)}
variant="outlined"
color="secondary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
{isSubmitting ? "درحال تایید اقدام..." : "تایید اقدام"}
</Button>
</DialogActions>
</>
);
};
export default ConfirmContent;
import { Button, DialogActions, DialogContent, Stack, TextField } from "@mui/material";
import { useForm } from "react-hook-form";
import useRequest from "@/lib/hooks/useRequest";
import { VERIFY_BY_FAST_REACT_SUPERVISOR } from "@/core/utils/routes";
const ConfirmContent = ({ rowId, mutate, setOpenConfirmDialog }) => {
const requestServer = useRequest({ notificationSuccess: true });
const {
register,
handleSubmit,
formState: { isSubmitting },
} = useForm({
defaultValues: {
description: "",
},
});
const onSubmit = async (data) => {
const formData = new FormData();
data.description !== "" && formData.append("description", data.description);
formData.append("verify", 1);
requestServer(`${VERIFY_BY_FAST_REACT_SUPERVISOR}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenConfirmDialog(false);
})
.catch(() => {});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
{...register("description")}
multiline
rows={8}
label="توضیحات و دلایل تأیید (اختیاری)"
placeholder="لطفاً علت تأیید خود را توضیح دهید"
fullWidth
variant="outlined"
sx={{ mt: 1 }}
InputLabelProps={{ shrink: true }}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenConfirmDialog(false)}
variant="outlined"
color="secondary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
{isSubmitting ? "درحال تایید اقدام..." : "تایید اقدام"}
</Button>
</DialogActions>
</>
);
};
export default ConfirmContent;

View File

@@ -1,29 +1,29 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ConfirmContent from "./ConfirmContent";
import DoneIcon from "@mui/icons-material/Done";
const ConfirmForm = ({ rowId, mutate }) => {
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
return (
<>
<Tooltip title="تایید اقدام">
<IconButton color="primary" onClick={() => setOpenConfirmDialog(true)}>
<DoneIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openConfirmDialog}
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>
<ConfirmContent mutate={mutate} rowId={rowId} setOpenConfirmDialog={setOpenConfirmDialog} />
</Dialog>
</>
);
};
export default ConfirmForm;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ConfirmContent from "./ConfirmContent";
import DoneIcon from "@mui/icons-material/Done";
const ConfirmForm = ({ rowId, mutate }) => {
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
return (
<>
<Tooltip title="تایید اقدام">
<IconButton color="primary" onClick={() => setOpenConfirmDialog(true)}>
<DoneIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openConfirmDialog}
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>
<ConfirmContent mutate={mutate} rowId={rowId} setOpenConfirmDialog={setOpenConfirmDialog} />
</Dialog>
</>
);
};
export default ConfirmForm;

View File

@@ -1,50 +1,50 @@
import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
import { useState } from "react";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import CloseIcon from "@mui/icons-material/Close";
const DescriptionForm = ({ description, title, icon: IconComponent = RemoveRedEyeIcon }) => {
const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
return (
<>
<Tooltip title={title}>
<IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
<IconComponent />
</IconButton>
</Tooltip>
<Dialog
open={openOfficerDescriptionDialog}
onClose={() => setOpenOfficerDescriptionDialog(false)}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
borderRadius: 2,
padding: 1,
},
}}
maxWidth="sm"
fullWidth
dir="rtl"
>
<DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
<Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
{title}
</Typography>
<IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
<CloseIcon />
</IconButton>
</DialogTitle>
<DialogContent>
<Card elevation={0}>
<CardContent>
<Typography variant="body2">{description || "هیچ توضیحی موجود نیست"} </Typography>
</CardContent>
</Card>
</DialogContent>
</Dialog>
</>
);
};
export default DescriptionForm;
import { Dialog, DialogContent, DialogTitle, IconButton, Tooltip, Typography, Card, CardContent } from "@mui/material";
import { useState } from "react";
import RemoveRedEyeIcon from "@mui/icons-material/RemoveRedEye";
import CloseIcon from "@mui/icons-material/Close";
const DescriptionForm = ({ description, title, icon: IconComponent = RemoveRedEyeIcon }) => {
const [openOfficerDescriptionDialog, setOpenOfficerDescriptionDialog] = useState(false);
return (
<>
<Tooltip title={title}>
<IconButton color="primary" onClick={() => setOpenOfficerDescriptionDialog(true)}>
<IconComponent />
</IconButton>
</Tooltip>
<Dialog
open={openOfficerDescriptionDialog}
onClose={() => setOpenOfficerDescriptionDialog(false)}
PaperProps={{
sx: {
transition: "all .3s",
boxShadow: "rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px",
borderRadius: 2,
padding: 1,
},
}}
maxWidth="sm"
fullWidth
dir="rtl"
>
<DialogTitle sx={{ display: "flex", justifyContent: "space-between", padding: "16px 24px" }}>
<Typography variant="body1" sx={{ fontWeight: "bold", fontSize: "large" }}>
{title}
</Typography>
<IconButton onClick={() => setOpenOfficerDescriptionDialog(false)} size="small">
<CloseIcon />
</IconButton>
</DialogTitle>
<DialogContent>
<Card elevation={0}>
<CardContent>
<Typography variant="body2">{description || "هیچ توضیحی موجود نیست"} </Typography>
</CardContent>
</Card>
</DialogContent>
</Dialog>
</>
);
};
export default DescriptionForm;

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;

View File

@@ -1,46 +1,46 @@
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ImageFormContent from "./ImageFormContent";
const ImageDialog = ({ image_before, image_after }) => {
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>
<DialogContent>
{openImageDialog && (
<>
<ImageFormContent image={image_before} title={"عکس قبل از اقدام"} />
<ImageFormContent image={image_after} title={"عکس بعد از اقدام"} />
</>
)}
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ImageDialog;
import PhotoLibraryIcon from "@mui/icons-material/PhotoLibrary";
import { Button, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ImageFormContent from "./ImageFormContent";
const ImageDialog = ({ image_before, image_after }) => {
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>
<DialogContent>
{openImageDialog && (
<>
<ImageFormContent image={image_before} title={"عکس قبل از اقدام"} />
<ImageFormContent image={image_after} title={"عکس بعد از اقدام"} />
</>
)}
</DialogContent>
<DialogActions>
<Button onClick={() => setOpenImageDialog(false)} variant="outlined" color="secondary">
بستن
</Button>
</DialogActions>
</Dialog>
</>
);
};
export default ImageDialog;

View File

@@ -1,30 +1,30 @@
"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 }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={start_lat} start_lng={start_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 }) => {
return (
<>
<DialogContent>
<Box sx={{ width: "400px", height: "400px" }}>
<MapLayer>
<ShowLocationMarker start_lat={start_lat} start_lng={start_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;

View File

@@ -1,36 +1,36 @@
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 }) => {
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>
<LocationFormContent
start_lat={start_lat}
start_lng={start_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 }) => {
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>
<LocationFormContent
start_lat={start_lat}
start_lng={start_lng}
setOpenLocationDialog={setOpenLocationDialog}
/>
</Dialog>
</>
);
};
export default LocationForm;

View File

@@ -1,84 +1,84 @@
import { Button, DialogActions, DialogContent, Stack, TextField } from "@mui/material";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import * as Yup from "yup";
import useRequest from "@/lib/hooks/useRequest";
import { REJECT_BY_FAST_REACT_SUPERVISOR } from "@/core/utils/routes";
const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
const requestServer = useRequest({ notificationSuccess: true });
const validationSchema = Yup.object().shape({
description: Yup.string().required("لطفاً توضیحات را وارد کنید."),
});
const {
register,
handleSubmit,
formState: { errors, isSubmitting },
reset,
} = useForm({
defaultValues: {
description: "",
},
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("description", data.description);
formData.append("verify", 2);
requestServer(`${REJECT_BY_FAST_REACT_SUPERVISOR}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenRejectDialog(false);
})
.catch(() => {})
.finally(() => {
reset();
});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
{...register("description")}
multiline
rows={8}
label="توضیحات و دلایل عدم تأیید"
placeholder="لطفاً علت عدم تأیید خود را توضیح دهید"
error={!!errors.description}
helperText={errors.description?.message}
fullWidth
variant="outlined"
sx={{ mt: 1 }}
InputLabelProps={{ shrink: true }}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenRejectDialog(false)}
variant="outlined"
color="secondary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
{isSubmitting ? "درحال ثبت عدم تایید..." : "ثبت عدم تایید"}
</Button>
</DialogActions>
</>
);
};
export default RejectContent;
import { Button, DialogActions, DialogContent, Stack, TextField } from "@mui/material";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import * as Yup from "yup";
import useRequest from "@/lib/hooks/useRequest";
import { REJECT_BY_FAST_REACT_SUPERVISOR } from "@/core/utils/routes";
const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
const requestServer = useRequest({ notificationSuccess: true });
const validationSchema = Yup.object().shape({
description: Yup.string().required("لطفاً توضیحات را وارد کنید."),
});
const {
register,
handleSubmit,
formState: { errors, isSubmitting },
reset,
} = useForm({
defaultValues: {
description: "",
},
resolver: yupResolver(validationSchema),
mode: "all",
});
const onSubmit = async (data) => {
const formData = new FormData();
formData.append("description", data.description);
formData.append("verify", 2);
requestServer(`${REJECT_BY_FAST_REACT_SUPERVISOR}/${rowId}`, "post", {
data: formData,
hasSidebarUpdate: true,
})
.then(() => {
mutate();
setOpenRejectDialog(false);
})
.catch(() => {})
.finally(() => {
reset();
});
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
{...register("description")}
multiline
rows={8}
label="توضیحات و دلایل عدم تأیید"
placeholder="لطفاً علت عدم تأیید خود را توضیح دهید"
error={!!errors.description}
helperText={errors.description?.message}
fullWidth
variant="outlined"
sx={{ mt: 1 }}
InputLabelProps={{ shrink: true }}
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenRejectDialog(false)}
variant="outlined"
color="secondary"
disabled={isSubmitting}
autoFocus
>
بستن
</Button>
<Button onClick={handleSubmit(onSubmit)} variant="contained" color="primary" disabled={isSubmitting}>
{isSubmitting ? "درحال ثبت عدم تایید..." : "ثبت عدم تایید"}
</Button>
</DialogActions>
</>
);
};
export default RejectContent;

View File

@@ -1,29 +1,29 @@
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ClearIcon from "@mui/icons-material/Clear";
import RejectContent from "./RejectFormContent";
const RejectForm = ({ rowId, mutate }) => {
const [openRejectDialog, setOpenRejectDialog] = useState(false);
return (
<>
<Tooltip title="عدم تایید">
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
<ClearIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openRejectDialog}
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>
<RejectContent mutate={mutate} rowId={rowId} setOpenRejectDialog={setOpenRejectDialog} />
</Dialog>
</>
);
};
export default RejectForm;
import { Dialog, DialogTitle, IconButton, Tooltip } from "@mui/material";
import { useState } from "react";
import ClearIcon from "@mui/icons-material/Clear";
import RejectContent from "./RejectFormContent";
const RejectForm = ({ rowId, mutate }) => {
const [openRejectDialog, setOpenRejectDialog] = useState(false);
return (
<>
<Tooltip title="عدم تایید">
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
<ClearIcon />
</IconButton>
</Tooltip>
<Dialog
fullWidth
open={openRejectDialog}
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>
<RejectContent mutate={mutate} rowId={rowId} setOpenRejectDialog={setOpenRejectDialog} />
</Dialog>
</>
);
};
export default RejectForm;

View File

@@ -1,42 +1,42 @@
import { RESTORE_FAST_REACT } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import { useState } from "react";
const RestoreContent = ({ rowId, mutate, setOpenRestoreDialog }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const handleClick = () => {
setSubmitting(true);
requestServer(`${RESTORE_FAST_REACT}/${rowId}`, "post", { hasSidebarUpdate: true })
.then(() => {
mutate();
setOpenRestoreDialog(false);
setSubmitting(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack alignItems="center" spacing={2}>
<Typography textAlign="center" fontWeight="bold" fontSize="16px" mt={2}>
آیا از بازگردانی فعالیت اطمینان دارید؟
</Typography>
</Stack>
</DialogContent>
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
<Button onClick={() => setOpenRestoreDialog(false)} variant="contained" color="error">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
{submitting ? "درحال ارسال اطلاعات..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default RestoreContent;
import { RESTORE_FAST_REACT } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import { Button, DialogActions, DialogContent, Stack, Typography } from "@mui/material";
import { useState } from "react";
const RestoreContent = ({ rowId, mutate, setOpenRestoreDialog }) => {
const [submitting, setSubmitting] = useState(false);
const requestServer = useRequest({ notificationSuccess: true });
const handleClick = () => {
setSubmitting(true);
requestServer(`${RESTORE_FAST_REACT}/${rowId}`, "post", { hasSidebarUpdate: true })
.then(() => {
mutate();
setOpenRestoreDialog(false);
setSubmitting(false);
})
.catch(() => {
setSubmitting(false);
});
};
return (
<>
<DialogContent>
<Stack alignItems="center" spacing={2}>
<Typography textAlign="center" fontWeight="bold" fontSize="16px" mt={2}>
آیا از بازگردانی فعالیت اطمینان دارید؟
</Typography>
</Stack>
</DialogContent>
<DialogActions sx={{ justifyContent: "center", paddingBottom: 2, width: "100%" }}>
<Button onClick={() => setOpenRestoreDialog(false)} variant="contained" color="error">
خیر !
</Button>
<Button onClick={handleClick} variant="contained" color="primary" disabled={submitting}>
{submitting ? "درحال ارسال اطلاعات..." : "بله اطمینان دارم"}
</Button>
</DialogActions>
</>
);
};
export default RestoreContent;

View File

@@ -1,32 +1,32 @@
import React, { useState } from "react";
import { Tooltip, IconButton, Dialog, DialogTitle } from "@mui/material";
import ReplyIcon from "@mui/icons-material/Reply";
import RestoreContent from "./RestoreContent";
const RestoreForm = ({ rowId, mutate }) => {
const [openRestoreDialog, setOpenRestoreDialog] = useState(false);
return (
<>
<Tooltip title="بازگردانی">
<IconButton color="primary" onClick={() => setOpenRestoreDialog(true)}>
<ReplyIcon />
</IconButton>
</Tooltip>
<Dialog
open={openRestoreDialog}
onClose={() => setOpenRestoreDialog(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>
<RestoreContent rowId={rowId} mutate={mutate} setOpenRestoreDialog={setOpenRestoreDialog} />
</Dialog>
</>
);
};
export default RestoreForm;
import React, { useState } from "react";
import { Tooltip, IconButton, Dialog, DialogTitle } from "@mui/material";
import ReplyIcon from "@mui/icons-material/Reply";
import RestoreContent from "./RestoreContent";
const RestoreForm = ({ rowId, mutate }) => {
const [openRestoreDialog, setOpenRestoreDialog] = useState(false);
return (
<>
<Tooltip title="بازگردانی">
<IconButton color="primary" onClick={() => setOpenRestoreDialog(true)}>
<ReplyIcon />
</IconButton>
</Tooltip>
<Dialog
open={openRestoreDialog}
onClose={() => setOpenRestoreDialog(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>
<RestoreContent rowId={rowId} mutate={mutate} setOpenRestoreDialog={setOpenRestoreDialog} />
</Dialog>
</>
);
};
export default RestoreForm;

View File

@@ -1,20 +1,20 @@
import { Box } from "@mui/material";
import ConfirmForm from "./ConfirmDialog";
import RejectForm from "./RejectDialog";
import { usePermissions } from "@/lib/hooks/usePermissions";
import RestoreForm from "./RestoreForm";
const RowActions = ({ row, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasRestorePermission = userPermissions.includes("restore-fast-react");
return (
<Box sx={{ display: "flex", gap: 1 }}>
{row.original?.status === 0 && <ConfirmForm rowId={row.getValue("road_observeds__id")} mutate={mutate} />}
{row.original?.status === 0 && <RejectForm rowId={row.getValue("road_observeds__id")} mutate={mutate} />}
{hasRestorePermission && row.original?.status !== 0 && (
<RestoreForm rowId={row.getValue("road_observeds__id")} mutate={mutate} />
)}
</Box>
);
};
export default RowActions;
import { Box } from "@mui/material";
import ConfirmForm from "./ConfirmDialog";
import RejectForm from "./RejectDialog";
import { usePermissions } from "@/lib/hooks/usePermissions";
import RestoreForm from "./RestoreForm";
const RowActions = ({ row, mutate }) => {
const { data: userPermissions } = usePermissions();
const hasRestorePermission = userPermissions.includes("restore-fast-react");
return (
<Box sx={{ display: "flex", gap: 1 }}>
{row.original?.status === 0 && <ConfirmForm rowId={row.getValue("road_observeds__id")} mutate={mutate} />}
{row.original?.status === 0 && <RejectForm rowId={row.getValue("road_observeds__id")} mutate={mutate} />}
{hasRestorePermission && row.original?.status !== 0 && (
<RestoreForm rowId={row.getValue("road_observeds__id")} mutate={mutate} />
)}
</Box>
);
};
export default RowActions;

View File

@@ -1,470 +1,470 @@
import { useEffect, useMemo, useState } from "react";
import { Box, Stack, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import moment from "jalali-moment";
import RowActions from "./RowActions";
import { GET_FAST_REACT_SUPERVISOR } from "@/core/utils/routes";
import useProvinces from "@/lib/hooks/useProvince";
import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
import { usePermissions } from "@/lib/hooks/usePermissions";
import { useAuth } from "@/lib/contexts/auth";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import DescriptionForm from "./RowActions/DescriptionDialog";
import LocationForm from "./RowActions/LocationDialog";
import EngineeringIcon from "@mui/icons-material/Engineering";
import ThreePIcon from "@mui/icons-material/ThreeP";
import ImageDialog from "./RowActions/ImageDialog";
import BlinkingCell from "@/core/components/BlinkingCell";
const SupervisorList = () => {
const { data: userPermissions } = usePermissions();
const hasCountryPermission = userPermissions?.includes("show-fast-react");
const { user } = useAuth();
const statusOptions = [
{ value: "", label: "همه وضعیت ها" },
{ value: 0, label: "درحال بررسی" },
{ value: 1, label: "تایید شده" },
{ value: 2, label: "عدم تایید" },
];
const columns = useMemo(() => {
const dynamicColumns = {
header: "استان",
id: "road_observeds__province_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
grow: false,
size: 130,
ColumnSelectComponent: (props) => {
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
const getColumnSelectOptions = useMemo(() => {
if (loadingProvinces) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorProvinces) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل کشور" },
...provinces.map((province) => ({
value: province.id,
label: province.name_fa,
})),
];
}, [provinces, errorProvinces, loadingProvinces]);
return (
<CustomSelectByDependency
{...props}
value={loadingProvinces ? "loading" : props.filterParameters.value}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ row }) => <>{row.original.province_fa}</>,
};
return [
{
accessorKey: "id",
header: "کد یکتا",
id: "road_observeds__id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
Cell: ({ row }) => <BlinkingCell value={row.original.id} visible={row.original.status == 0} />,
},
...(hasCountryPermission ? [dynamicColumns] : []),
{
header: "اداره",
id: "edarate_shahri_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
dependencyId: hasCountryPermission ? "road_observeds__province_id" : null,
grow: false,
size: 120,
ColumnSelectComponent: (props) => {
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const [prevDependency, setPrevDependency] = useState(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const getColumnSelectOptions = useMemo(() => {
if (hasCountryPermission && props.dependencyFieldValue.value === "") {
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
}
if (loadingEdaratList) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorEdaratList) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل ادارات" },
...edaratList.map((edare) => ({
value: edare.id,
label: edare.name_fa,
})),
];
}, [edaratList, loadingEdaratList, errorEdaratList]);
useEffect(() => {
if (hasCountryPermission) return;
if (prevDependency === props.dependencyFieldValue?.value) return;
props.handleChange({ ...props.filterParameters, value: "" });
setPrevDependency(props.dependencyFieldValue?.value);
}, [props.dependencyFieldValue?.value, hasCountryPermission]);
return (
<CustomSelectByDependency
{...props}
value={
props.dependencyFieldValue?.value === ""
? "empty"
: loadingEdaratList
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ renderedCellValue, row }) => <>{row.original.name_fa}</>,
},
{
header: "اطلاعات ثبت‌ شده در سامانه سوانح",
id: "fkInfo",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorKey: "fk_RegisteredEventMessage",
header: "کد سوانح",
id: "fk_RegisteredEventMessage",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Title",
header: "موضوع گزارش",
id: "Title",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "FeatureTypeTitle",
header: "نوع گزارش",
id: "FeatureTypeTitle",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Description",
header: "توضیح گزارش",
id: "Description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm description={renderedCellValue} title={"توضیحات گزارش"} />
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "موقعیت",
id: "location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.lat) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
</Stack>
);
},
},
{
accessorKey: "MobileForSendEventSms",
header: "شماره تماس گیرنده",
id: "MobileForSendEventSms",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
header: "تاریخ ثبت",
id: "StartTime_DateTime",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
header: "اطلاعات اقدام",
id: "rms_register",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorFn: (row) => (row.rms_status == 1 ? "اقدام انجام شد" : "اقدام انجام نشد"),
header: "وضعیت اقدام",
id: "rms_register_status",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
},
{
accessorKey: "rms_description",
header: "توضیح مامور",
id: "rms_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات مامور"}
icon={EngineeringIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "تصاویر",
id: "rms_images",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original?.image_before && !row.original?.image_after) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
{row.original?.image_before && row.original?.image_after && (
<ImageDialog
image_before={row.original?.image_before}
image_after={row.original?.image_after}
/>
)}
</Stack>
);
},
},
{
header: "موقعیت",
id: "rms_location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.rms_start_latlng) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm
start_lat={row.original.rms_start_latlng[0]}
start_lng={row.original.rms_start_latlng[1]}
/>
</Stack>
);
},
},
{
accessorFn: (row) => {
return row.rms_last_activity
? moment(row?.rms_last_activity).locale("fa").format("HH:mm | yyyy/MM/DD")
: "-";
},
header: "تاریخ اقدام",
id: "rms_last_activity",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
accessorKey: "status",
header: "وضعیت نظارت",
id: "status",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
sortDescFirst: true,
grow: false,
size: 100,
columnSelectOption: () => {
return statusOptions.map((status) => ({
value: status.value,
label: status.label,
}));
},
Cell: ({ row }) => <>{row.original.status_fa}</>,
},
{
accessorKey: "supervisor_description",
header: "توضیح ناظر",
id: "supervisor_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات کارشناس"}
icon={ThreePIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
];
}, []);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
columns={columns}
sorting={[
{ id: "status", desc: false },
{ id: "road_observeds__id", desc: true },
]}
table_url={GET_FAST_REACT_SUPERVISOR}
page_name={"fastReactSupervisor"}
table_name={"fastReactSupervisorList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"first"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default SupervisorList;
import { useEffect, useMemo, useState } from "react";
import { Box, Stack, Typography } from "@mui/material";
import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import Toolbar from "./Toolbar";
import moment from "jalali-moment";
import RowActions from "./RowActions";
import { GET_FAST_REACT_SUPERVISOR } from "@/core/utils/routes";
import useProvinces from "@/lib/hooks/useProvince";
import CustomSelectByDependency from "@/core/components/DataTable/filter/fieldsType/CustomSelectByDependency";
import { usePermissions } from "@/lib/hooks/usePermissions";
import { useAuth } from "@/lib/contexts/auth";
import useEdaratLists from "@/lib/hooks/useEdaratLists";
import DescriptionForm from "./RowActions/DescriptionDialog";
import LocationForm from "./RowActions/LocationDialog";
import EngineeringIcon from "@mui/icons-material/Engineering";
import ThreePIcon from "@mui/icons-material/ThreeP";
import ImageDialog from "./RowActions/ImageDialog";
import BlinkingCell from "@/core/components/BlinkingCell";
const SupervisorList = () => {
const { data: userPermissions } = usePermissions();
const hasCountryPermission = userPermissions?.includes("show-fast-react");
const { user } = useAuth();
const statusOptions = [
{ value: "", label: "همه وضعیت ها" },
{ value: 0, label: "درحال بررسی" },
{ value: 1, label: "تایید شده" },
{ value: 2, label: "عدم تایید" },
];
const columns = useMemo(() => {
const dynamicColumns = {
header: "استان",
id: "road_observeds__province_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
grow: false,
size: 130,
ColumnSelectComponent: (props) => {
const { provinces, errorProvinces, loadingProvinces } = useProvinces();
const getColumnSelectOptions = useMemo(() => {
if (loadingProvinces) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorProvinces) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل کشور" },
...provinces.map((province) => ({
value: province.id,
label: province.name_fa,
})),
];
}, [provinces, errorProvinces, loadingProvinces]);
return (
<CustomSelectByDependency
{...props}
value={loadingProvinces ? "loading" : props.filterParameters.value}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ row }) => <>{row.original.province_fa}</>,
};
return [
{
accessorKey: "id",
header: "کد یکتا",
id: "road_observeds__id",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
Cell: ({ row }) => <BlinkingCell value={row.original.id} visible={row.original.status == 0} />,
},
...(hasCountryPermission ? [dynamicColumns] : []),
{
header: "اداره",
id: "edarate_shahri_id",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
dependencyId: hasCountryPermission ? "road_observeds__province_id" : null,
grow: false,
size: 120,
ColumnSelectComponent: (props) => {
const { edaratList, loadingEdaratList, errorEdaratList } = useEdaratLists(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const [prevDependency, setPrevDependency] = useState(
hasCountryPermission ? props.dependencyFieldValue.value : user.province_id
);
const getColumnSelectOptions = useMemo(() => {
if (hasCountryPermission && props.dependencyFieldValue.value === "") {
return [{ value: "empty", label: "ابتدا استان را انتخاب کنید" }];
}
if (loadingEdaratList) {
return [{ value: "loading", label: "در حال بارگذاری..." }];
}
if (errorEdaratList) {
return [{ value: "error", label: "خطا در بارگذاری" }];
}
return [
{ value: "", label: "کل ادارات" },
...edaratList.map((edare) => ({
value: edare.id,
label: edare.name_fa,
})),
];
}, [edaratList, loadingEdaratList, errorEdaratList]);
useEffect(() => {
if (hasCountryPermission) return;
if (prevDependency === props.dependencyFieldValue?.value) return;
props.handleChange({ ...props.filterParameters, value: "" });
setPrevDependency(props.dependencyFieldValue?.value);
}, [props.dependencyFieldValue?.value, hasCountryPermission]);
return (
<CustomSelectByDependency
{...props}
value={
props.dependencyFieldValue?.value === ""
? "empty"
: loadingEdaratList
? "loading"
: props.filterParameters.value
}
columnSelectOption={getColumnSelectOptions}
/>
);
},
Cell: ({ renderedCellValue, row }) => <>{row.original.name_fa}</>,
},
{
header: "اطلاعات ثبت‌ شده در سامانه سوانح",
id: "fkInfo",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorKey: "fk_RegisteredEventMessage",
header: "کد سوانح",
id: "fk_RegisteredEventMessage",
enableColumnFilter: true,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Title",
header: "موضوع گزارش",
id: "Title",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "FeatureTypeTitle",
header: "نوع گزارش",
id: "FeatureTypeTitle",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorKey: "Description",
header: "توضیح گزارش",
id: "Description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm description={renderedCellValue} title={"توضیحات گزارش"} />
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "موقعیت",
id: "location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.lat) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm start_lat={row.original.lat} start_lng={row.original.lng} />
</Stack>
);
},
},
{
accessorKey: "MobileForSendEventSms",
header: "شماره تماس گیرنده",
id: "MobileForSendEventSms",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
},
{
accessorFn: (row) => moment(row.StartTime_DateTime).locale("fa").format("HH:mm | yyyy/MM/DD"),
header: "تاریخ ثبت",
id: "StartTime_DateTime",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
header: "اطلاعات اقدام",
id: "rms_register",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
columns: [
{
accessorFn: (row) => (row.rms_status == 1 ? "اقدام انجام شد" : "اقدام انجام نشد"),
header: "وضعیت اقدام",
id: "rms_register_status",
enableColumnFilter: false,
enableSorting: false,
grow: false,
size: 50,
},
{
accessorKey: "rms_description",
header: "توضیح مامور",
id: "rms_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات مامور"}
icon={EngineeringIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
{
header: "تصاویر",
id: "rms_images",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original?.image_before && !row.original?.image_after) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
{row.original?.image_before && row.original?.image_after && (
<ImageDialog
image_before={row.original?.image_before}
image_after={row.original?.image_after}
/>
)}
</Stack>
);
},
},
{
header: "موقعیت",
id: "rms_location",
enableColumnFilter: false,
enableSorting: false,
datatype: "array",
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ row }) => {
if (!row.original.rms_start_latlng) return <>-</>;
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<LocationForm
start_lat={row.original.rms_start_latlng[0]}
start_lng={row.original.rms_start_latlng[1]}
/>
</Stack>
);
},
},
{
accessorFn: (row) => {
return row.rms_last_activity
? moment(row?.rms_last_activity).locale("fa").format("HH:mm | yyyy/MM/DD")
: "-";
},
header: "تاریخ اقدام",
id: "rms_last_activity",
enableColumnFilter: true,
datatype: "date",
filterMode: "between",
grow: false,
size: 100,
},
],
},
{
accessorKey: "status",
header: "وضعیت نظارت",
id: "status",
enableColumnFilter: true,
datatype: "numeric",
filterMode: "equals",
sortDescFirst: true,
grow: false,
size: 100,
columnSelectOption: () => {
return statusOptions.map((status) => ({
value: status.value,
label: status.label,
}));
},
Cell: ({ row }) => <>{row.original.status_fa}</>,
},
{
accessorKey: "supervisor_description",
header: "توضیح ناظر",
id: "supervisor_description",
enableColumnFilter: false,
datatype: "text",
filterMode: "equals",
sortDescFirst: false,
columnFilterModeOptions: ["equals", "contains"],
grow: false,
size: 100,
muiTableBodyCellProps: {
sx: {
borderLeft: "1px solid #e1e1e1",
py: 0,
"&:first-of-type": {
borderLeft: "unset",
},
},
},
Cell: ({ renderedCellValue }) => {
if (renderedCellValue) {
return (
<Stack alignItems={"center"} justifyContent={"center"}>
<DescriptionForm
description={renderedCellValue}
title={"توضیحات کارشناس"}
icon={ThreePIcon}
/>
</Stack>
);
}
return <Typography variant="body2">-</Typography>;
},
},
];
}, []);
return (
<>
<Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
<DataTableWithAuth
need_filter={true}
columns={columns}
sorting={[
{ id: "status", desc: false },
{ id: "road_observeds__id", desc: true },
]}
table_url={GET_FAST_REACT_SUPERVISOR}
page_name={"fastReactSupervisor"}
table_name={"fastReactSupervisorList"}
TableToolbar={Toolbar}
enableRowActions
positionActionsColumn={"first"}
RowActions={RowActions}
/>
</Box>
</>
);
};
export default SupervisorList;

View File

@@ -1,13 +1,13 @@
import PrintExcel from "./ExcelPrint";
import ComplaintList from "../complaintList";
import { Stack } from "@mui/material";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Stack direction={"row"} spacing={1}>
<PrintExcel table={table} filterData={filterData} />
<ComplaintList mutate={mutate} />
</Stack>
);
};
export default Toolbar;
import PrintExcel from "./ExcelPrint";
import ComplaintList from "../complaintList";
import { Stack } from "@mui/material";
const Toolbar = ({ table, filterData, mutate }) => {
return (
<Stack direction={"row"} spacing={1}>
<PrintExcel table={table} filterData={filterData} />
<ComplaintList mutate={mutate} />
</Stack>
);
};
export default Toolbar;

View File

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