Merge branch 'feature/refer_fast_react_#86c2a6aru' into 'develop'

Resolve #86c2a6aru "Feature/refer fast react "

See merge request witel-front-end/rms!77
This commit is contained in:
AmirHossein Mahmoodi
2025-02-27 10:54:43 +00:00
9 changed files with 243 additions and 4 deletions

View File

@@ -134,7 +134,7 @@ const ComplaintListTable = ({ open, setOpen, mutate }) => {
/>
);
},
Cell: ({ row }) => <>{row.original.city_fa}</>,
Cell: ({ row }) => <>{row.original.edarate_shahri_name_fa}</>,
},
{
accessorKey: "Title",

View File

@@ -0,0 +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;

View File

@@ -0,0 +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;

View File

@@ -0,0 +1,101 @@
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 = ({ rowId, 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: "",
edarat_shahri_id: "",
description: "",
},
resolver: yupResolver(validationSchema),
mode: "onBlur",
});
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}/${rowId}`, "post", {
data: formData,
})
.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

@@ -0,0 +1,33 @@
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 = ({ rowId, 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} rowId={rowId} setOpenReferDialog={setOpenReferDialog} />
)}
</Dialog>
</>
);
};
export default Refer;

View File

@@ -1,9 +1,11 @@
import { Box } from "@mui/material";
import ReferList from "./ReferList";
import Refer from "./Refer";
const RowActions = ({ row, mutate }) => {
return (
<Box sx={{ display: "flex", gap: 1 }}>
<Refer rowId={row.getValue("id")} mutate={mutate} />
<ReferList rowId={row.getValue("id")} />
</Box>
);

View File

@@ -1,13 +1,12 @@
"use client";
import PageTitle from "@/core/components/PageTitle";
import { Stack } from "@mui/material";
import SupervisorList from "./OperatorList";
import OperatorList from "./OperatorList";
const OperatorPage = () => {
return (
<Stack spacing={1}>
<PageTitle title={"ارزیابی"} />
<PageTitle title={"عملیات"} />
<OperatorList />
</Stack>
);

View File

@@ -29,7 +29,7 @@ const RejectContent = ({ rowId, mutate, setOpenRejectDialog }) => {
const formData = new FormData();
formData.append("description", data.description);
formData.append("verify", 2);
requestServer(`${REJECT_BY_SUPERVISOR}/${rowId}`, "post", {
await requestServer(`${REJECT_BY_SUPERVISOR}/${rowId}`, "post", {
data: formData,
})
.then(() => {

View File

@@ -118,3 +118,4 @@ export const VERIFY_BY_FAST_REACT_SUPERVISOR = api + "/api/v3/road_observations/
export const REJECT_BY_FAST_REACT_SUPERVISOR = api + "/api/v3/road_observations/verify";
export const GET_FAST_REACT_OPERATOR = api + "/api/v3/road_observations/operator_index";
export const GET_FAST_REACT_REFER_LIST = api + "/api/v3/road_observations/refer_list";
export const REFER_FAST_REACT = api + "/api/v3/road_observations/refer";