Files
expert-front/src/components/dashboard/navgan-loan-management/Form/UpdateForm/UpdateContent.jsx

138 lines
5.4 KiB
JavaScript

import { UPDATE_LOAN_MANAGEMENT_NAVGAN } from "@/core/data/apiRoutes";
import useNotification from "@/lib/app/hooks/useNotification";
import useRequest from "@/lib/app/hooks/useRequest";
import useLoanStateNavgan from "@/lib/prefetchDataTable/hooks/useLoanStateNavgan";
import {
Button,
DialogActions,
DialogContent,
FormControl,
FormHelperText,
InputLabel,
MenuItem,
Select,
Stack,
TextField,
} from "@mui/material";
import { useFormik } from "formik";
import { useTranslations } from "next-intl";
import * as Yup from "yup";
const UpdateContent = ({ rowId, mutate, setOpenConfirmDialog }) => {
const t = useTranslations();
const { loan_state_navgan } = useLoanStateNavgan();
const requestServer = useRequest({ auth: true });
const { update_notification } = useNotification();
const validationSchema = Yup.object().shape({
description: Yup.string().required(t("UpdateDialog.description_error")),
next_state_id: Yup.number().required(t("UpdateDialog.next-state-id-error")),
});
const formik = useFormik({
initialValues: {
description: "",
next_state_id: "",
},
validationSchema,
onSubmit: (values, { setSubmitting }) => {
const formData = new FormData();
formData.append("expert_description", values.description);
formData.append("next_state_id", values.next_state_id);
requestServer(`${UPDATE_LOAN_MANAGEMENT_NAVGAN}/${rowId}`, "post", {
data: formData,
})
.then((response) => {
setOpenConfirmDialog(false);
mutate();
update_notification();
})
.catch(() => {})
.finally(() => {
setSubmitting(false);
});
},
});
const handleDescriptionChange = (event) => {
formik.setFieldValue("description", event.target.value);
};
const handleNextStateIDChange = (event) => {
formik.setFieldValue("next_state_id", event.target.value);
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<TextField
name="description"
multiline
rows={8}
label={t("UpdateDialog.description")}
value={formik.values.description}
onChange={handleDescriptionChange}
fullWidth
variant="outlined"
sx={{ mt: 1 }}
onBlur={formik.handleBlur("description")}
error={formik.touched.description && Boolean(formik.errors.description)}
helperText={formik.touched.description && formik.errors.description}
/>
</Stack>
<Stack>
<FormControl
error={formik.touched.next_state_id && Boolean(formik.errors.next_state_id)}
fullWidth
>
<InputLabel>{t("UpdateDialog.next-state-id")}</InputLabel>
<Select
labelId="next_state_id"
id="next_state_id"
value={formik.values.next_state_id}
label={t("UpdateDialog.next-state-id")}
onChange={handleNextStateIDChange}
onBlur={formik.handleBlur("next_state_id")}
>
{loan_state_navgan
? loan_state_navgan.map((item) => {
return (
<MenuItem key={item.id} value={item.id}>
{item.name}
</MenuItem>
);
})
: null}
</Select>
<FormHelperText>
{formik.touched.next_state_id && formik.errors.next_state_id}
</FormHelperText>
</FormControl>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenConfirmDialog(false)}
variant="outlined"
color="secondary"
disabled={formik.isSubmitting}
autoFocus
>
{t("UpdateDialog.button-cancel")}
</Button>
<Button
onClick={formik.handleSubmit}
variant="contained"
color="primary"
disabled={formik.isSubmitting || !formik.dirty || !formik.isValid}
>
{t("UpdateDialog.button-update")}
</Button>
</DialogActions>
</>
);
};
export default UpdateContent;