Files
expert-front/src/components/dashboard/navgan/bank-management/Form/Edit/EditContent.jsx

134 lines
5.7 KiB
JavaScript

import useNotification from "@/lib/app/hooks/useNotification";
import useRequest from "@/lib/app/hooks/useRequest";
import { Button, DialogActions, DialogContent, Stack } from "@mui/material";
import { useFormik } from "formik";
import { useTranslations } from "next-intl";
import { EDIT_APPROVED_AMOUNT } from "@/core/data/apiRoutes";
import * as Yup from "yup";
import PriceField from "@/core/components/PriceField";
const vehicle_amount = {
اتوبوس: parseInt(process.env.NEXT_PUBLIC_BUS_AMOUNT),
"مینی بوس": parseInt(process.env.NEXT_PUBLIC_MINIBUS_AMOUNT),
};
const EditContent = ({ rowId, row, mutate, setOpenEditDialog, vehicle_type }) => {
const t = useTranslations();
const requestServer = useRequest({ auth: true, notification: false });
const { update_notification } = useNotification();
const validationSchema = Yup.object().shape({
approved_amount: Yup.mixed()
.test("is-number", `${t("EditDialog.approved_amount_number")}`, (value) => !isNaN(value))
.test("max-amount", function (value) {
const maxAmount =
vehicle_type === "اتوبوس"
? value > parseInt(process.env.NEXT_PUBLIC_BUS_AMOUNT)
? parseInt(vehicle_amount[vehicle_type]) / 1000
: parseInt(vehicle_amount[vehicle_type])
: parseInt(vehicle_amount[vehicle_type]);
// Check the condition to set the message dynamically
const message =
vehicle_type === "اتوبوس"
? value > parseInt(process.env.NEXT_PUBLIC_BUS_AMOUNT) &&
`${t("EditDialog.max_amount", {
value: maxAmount.toLocaleString("en"),
amount: "میلیارد",
})}`
: value > parseInt(process.env.NEXT_PUBLIC_MINIBUS_AMOUNT) &&
`${t("EditDialog.max_amount", {
value: maxAmount.toLocaleString("en"),
amount: "میلیارد",
})}`;
// Return either `true` (pass the validation) or `this.createError` with the message
return value <= maxAmount || this.createError({ message });
})
.test("positive", `${t("EditDialog.approved_amount_positive")}`, (value) => value >= 0)
.required(t("EditDialog.edit_approved_amount_required")),
});
const formik = useFormik({
initialValues: {
approved_amount: String(row.original.approved_amount / 1000000),
},
validationSchema,
onSubmit: (values, { setSubmitting }) => {
requestServer(`${EDIT_APPROVED_AMOUNT}/${rowId}`, "post", {
data: {
approved_amount: values.approved_amount,
},
notification: true,
})
.then(() => {
setOpenEditDialog(false);
mutate();
update_notification();
})
.catch(() => {})
.finally(() => {
setSubmitting(false);
});
},
});
const handleAmountChange = (event) => {
if (!isNaN(event.target.value)) {
formik.setFieldValue("approved_amount", event.target.value);
} else {
formik.setFieldValue("approved_amount", formik.values.approved_amount);
}
};
return (
<>
<DialogContent>
<Stack spacing={2}>
<Stack>
<PriceField
name="approved_amount"
label={
<>
<span>{t("EditDialog.edit_approved_amount")}</span>
<small>{t("EditDialog.unit")}</small>
</>
}
type="text"
inputProps={{
inputMode: "number",
min: 0,
pattern: "[0-9]*",
}}
variant="outlined"
value={formik.values.approved_amount}
onChange={handleAmountChange}
onBlur={formik.handleBlur("approved_amount")}
error={formik.touched.approved_amount && Boolean(formik.errors.approved_amount)}
helperText={formik.touched.approved_amount && formik.errors.approved_amount}
sx={{ mt: 1 }}
fullWidth
/>
</Stack>
</Stack>
</DialogContent>
<DialogActions>
<Button
onClick={() => setOpenEditDialog(false)}
variant="outlined"
color="secondary"
disabled={formik.isSubmitting}
autoFocus
>
{t("EditDialog.button-cancel")}
</Button>
<Button
onClick={formik.handleSubmit}
variant="contained"
color="primary"
disabled={formik.isSubmitting || !formik.isValid || !formik.dirty}
>
{t("EditDialog.button-edit")}
</Button>
</DialogActions>
</>
);
};
export default EditContent;