Merge branch 'feature/debug_forms' into 'develop'
Feature/debug forms See merge request witel3/loan-facilities-expert!66
This commit is contained in:
AmirHossein Mahmoodi
11
package-lock.json
generated
11
package-lock.json
generated
@@ -15,6 +15,7 @@
|
||||
"@mui/material": "^5.12.0",
|
||||
"@mui/x-date-pickers": "^6.9.2",
|
||||
"axios": "^1.4.0",
|
||||
"colord": "^2.9.3",
|
||||
"date-fns-jalali": "^2.13.0-0",
|
||||
"dayjs": "^1.11.9",
|
||||
"eslint": "8.36.0",
|
||||
@@ -1824,6 +1825,11 @@
|
||||
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
|
||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
|
||||
},
|
||||
"node_modules/colord": {
|
||||
"version": "2.9.3",
|
||||
"resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz",
|
||||
"integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw=="
|
||||
},
|
||||
"node_modules/combined-stream": {
|
||||
"version": "1.0.8",
|
||||
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
|
||||
@@ -6685,6 +6691,11 @@
|
||||
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
|
||||
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
|
||||
},
|
||||
"colord": {
|
||||
"version": "2.9.3",
|
||||
"resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz",
|
||||
"integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw=="
|
||||
},
|
||||
"combined-stream": {
|
||||
"version": "1.0.8",
|
||||
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
|
||||
|
||||
@@ -178,7 +178,6 @@
|
||||
"context": "آیا از تایید این آیتم اطمینان دارید؟",
|
||||
"button-cancel": "بستن",
|
||||
"button-confirm": "تایید",
|
||||
"amount_error": "وارد کردن مقدار پیشنهادی الزامیست",
|
||||
"description_error": "وارد کردن توضیحات الزامی است!",
|
||||
"optional": " (اختیاری)",
|
||||
"unit": " (ریال)",
|
||||
@@ -186,7 +185,10 @@
|
||||
"choose_file": "انتخاب فایل",
|
||||
"approved_amount": "مبلغ تصویب شده",
|
||||
"approved_amount_error": "وارد کردن مبلغ تصویب شده الزامیست",
|
||||
"proposed_amount": "مقدار پیشنهادی"
|
||||
"approved_amount_positive": "مبلغ تصویب شده باید مثبت باشد",
|
||||
"proposed_amount_error": "وارد کردن مقدار پیشنهادی الزامیست",
|
||||
"proposed_amount": "مقدار پیشنهادی",
|
||||
"proposed_amount_positive": "مقدار پیشنهادی باید مثبت باشد"
|
||||
},
|
||||
"RejectDialog": {
|
||||
"reject": "عدم تایید",
|
||||
|
||||
@@ -1,60 +1,75 @@
|
||||
import {CONFIRM_MACHINARY_OFFICE} from "@/core/data/apiRoutes";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {useFormik} from "formik";
|
||||
import * as Yup from "yup";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {useFormik} from "formik";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import {CONFIRM_MACHINARY_OFFICE} from "@/core/data/apiRoutes";
|
||||
import * as Yup from "yup";
|
||||
|
||||
const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
const Confirm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [proposedAmount, setProposedAmount] = useState("");
|
||||
const [description, setDescription] = useState("");
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
|
||||
//formik
|
||||
const validationSchema = Yup.object().shape({
|
||||
proposed_amount: Yup.string().required(t("ConfirmDialog.amount_error")),
|
||||
});
|
||||
proposed_amount: Yup.number().positive(t("ConfirmDialog.proposed_amount_positive")).required(t("ConfirmDialog.proposed_amount_error")),
|
||||
})
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
proposed_amount: "",
|
||||
description: "",
|
||||
proposed_amount: "",
|
||||
confirm_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("proposed_amount", proposedAmount);
|
||||
if (description != "") formData.append("expert_description", description);
|
||||
handleClose();
|
||||
confirmData(CONFIRM_MACHINARY_OFFICE, rowId, formData);
|
||||
formData.append("proposed_amount", values.proposed_amount);
|
||||
if (values.description != "") formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${CONFIRM_MACHINARY_OFFICE}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value)
|
||||
};
|
||||
const handleAmountChange = (event) => {
|
||||
if (/^\d*$/.test(event.target.value)) {
|
||||
setProposedAmount(event.target.value);
|
||||
}
|
||||
formik.handleChange(event);
|
||||
formik.setFieldValue("proposed_amount", event.target.value);
|
||||
};
|
||||
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
if (uploadedFile) {
|
||||
@@ -64,6 +79,7 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
event.target.value = "";
|
||||
return;
|
||||
}
|
||||
|
||||
const fileType = event.target?.files?.[0].type;
|
||||
const fileName = event.target?.files?.[0].name;
|
||||
setSelectedImage(URL.createObjectURL(uploadedFile));
|
||||
@@ -74,78 +90,91 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
}
|
||||
};
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="proposed_amount"
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.proposed_amount")}</span><small>{t("ConfirmDialog.unit")}</small></>}
|
||||
type="number"
|
||||
inputProps={{
|
||||
min: 0,
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
variant="outlined"
|
||||
value={formik.values.proposed_amount}
|
||||
onChange={handleAmountChange}
|
||||
onBlur={formik.handleBlur("proposed_amount")}
|
||||
error={
|
||||
formik.touched.proposed_amount &&
|
||||
Boolean(formik.errors.proposed_amount)
|
||||
}
|
||||
helperText={
|
||||
formik.touched.proposed_amount && formik.errors.proposed_amount
|
||||
}
|
||||
sx={{mt: 1}}
|
||||
fullWidth
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="proposed_amount"
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.proposed_amount")}</span><small>{t("ConfirmDialog.unit")}</small></>}
|
||||
type="number"
|
||||
inputProps={{
|
||||
min: 0,
|
||||
inputMode: "numeric",
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
variant="outlined"
|
||||
value={proposedAmount}
|
||||
onChange={handleAmountChange}
|
||||
onBlur={formik.handleBlur("proposed_amount")}
|
||||
error={
|
||||
formik.touched.proposed_amount &&
|
||||
Boolean(formik.errors.proposed_amount)
|
||||
}
|
||||
helperText={
|
||||
formik.touched.proposed_amount && formik.errors.proposed_amount
|
||||
}
|
||||
sx={{mt: 1}}
|
||||
fullWidth
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ConfirmForm;
|
||||
export default Confirm;
|
||||
@@ -4,10 +4,12 @@ import {
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useFormik} from "formik";
|
||||
@@ -16,15 +18,20 @@ import {useState} from "react";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import axios from "axios";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
|
||||
const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const t = useTranslations();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const Reject = ({rowId, fetchUrl, mutate}) => {
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
description: Yup.string().required(t("RejectDialog.description_error")),
|
||||
@@ -33,21 +40,33 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
reject_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
rejectData(REJECT_MACHINARY_OFFICE, rowId, formData);
|
||||
formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${REJECT_MACHINARY_OFFICE}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value);
|
||||
formik.handleChange(event);
|
||||
};
|
||||
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
if (uploadedFile) {
|
||||
@@ -66,59 +85,66 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</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>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenRejectDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default RejectForm;
|
||||
export default Reject;
|
||||
@@ -1,94 +1,23 @@
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import {Box, IconButton, Tooltip} from "@mui/material";
|
||||
import ConfirmForm from "./Form/ConfirmForm";
|
||||
import RejectForm from "./Form/RejectForm";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useCallback, useState} from "react";
|
||||
import axios from "axios";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import {Box} from "@mui/material";
|
||||
import ConfirmForm from "./Form/ConfirmForm"
|
||||
import RejectForm from "./Form/RejectForm"
|
||||
|
||||
const TableRowActions = ({row, mutate, fetchUrl}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
|
||||
// Confirm
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const handleCloseConfirmDialog = () => {
|
||||
setOpenConfirmDialog(false);
|
||||
};
|
||||
const confirmData = useCallback((url, rowID, values) => {
|
||||
Notifications(t, undefined)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Confirm
|
||||
|
||||
// Reject
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
const handleCloseRejectDialog = () => {
|
||||
setOpenRejectDialog(false);
|
||||
};
|
||||
|
||||
const rejectData = useCallback((url, rowID, values) => {
|
||||
Notifications(t)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Reject
|
||||
const TableRow = ({row, mutate, fetchUrl}) => {
|
||||
|
||||
return (
|
||||
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<ConfirmForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openConfirmDialog}
|
||||
handleClose={handleCloseConfirmDialog}
|
||||
confirmData={confirmData}
|
||||
mutate={mutate}
|
||||
fetchUrl={fetchUrl}
|
||||
/>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<RejectForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openRejectDialog}
|
||||
handleClose={handleCloseRejectDialog}
|
||||
rejectData={rejectData}
|
||||
fetchUrl={fetchUrl}
|
||||
mutate={mutate}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableRowActions;
|
||||
export default TableRow;
|
||||
|
||||
@@ -1,61 +1,74 @@
|
||||
import {CONFIRM_PASSENGER_BOSS} from "@/core/data/apiRoutes";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {useFormik} from "formik";
|
||||
import * as Yup from "yup";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {useFormik} from "formik";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import {CONFIRM_PASSENGER_BOSS} from "@/core/data/apiRoutes";
|
||||
import * as Yup from "yup";
|
||||
|
||||
const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
const Confirm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [approvedAmount, setApprovedAmount] = useState("");
|
||||
const [description, setDescription] = useState("");
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
|
||||
//formik
|
||||
const validationSchema = Yup.object().shape({
|
||||
approved_amount: Yup.string().required(
|
||||
t("ConfirmDialog.approved_amount_error")
|
||||
),
|
||||
approved_amount: Yup.number().positive(t("ConfirmDialog.approved_amount_positive")).required(t("ConfirmDialog.approved_amount_error"))
|
||||
});
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
approved_amount: "",
|
||||
description: "",
|
||||
approved_amount: "",
|
||||
confirm_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("approved_amount", approvedAmount);
|
||||
if (description != "") formData.append("expert_description", description);
|
||||
handleClose();
|
||||
confirmData(CONFIRM_PASSENGER_BOSS, rowId, formData);
|
||||
formData.append("approved_amount", values.approved_amount);
|
||||
if (values.description != "") formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${CONFIRM_PASSENGER_BOSS}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value)
|
||||
};
|
||||
const handleAmountChange = (event) => {
|
||||
if (/^\d*$/.test(event.target.value)) {
|
||||
setApprovedAmount(event.target.value);
|
||||
}
|
||||
formik.handleChange(event);
|
||||
formik.setFieldValue("approved_amount", event.target.value);
|
||||
};
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
@@ -66,6 +79,7 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
event.target.value = "";
|
||||
return;
|
||||
}
|
||||
|
||||
const fileType = event.target?.files?.[0].type;
|
||||
const fileName = event.target?.files?.[0].name;
|
||||
setSelectedImage(URL.createObjectURL(uploadedFile));
|
||||
@@ -75,80 +89,92 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="approved_amount"
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.approved_amount")}</span><small>{t("ConfirmDialog.unit")}</small></>}
|
||||
type="number"
|
||||
inputProps={{
|
||||
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>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="approved_amount"
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.approved_amount")}</span><small>{t("ConfirmDialog.unit")}</small></>}
|
||||
type="number"
|
||||
inputProps={{
|
||||
min: 0,
|
||||
inputMode: "numeric",
|
||||
pattern: "[0-9]*",
|
||||
}}
|
||||
variant="outlined"
|
||||
value={approvedAmount}
|
||||
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>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ConfirmForm;
|
||||
export default Confirm;
|
||||
@@ -4,10 +4,12 @@ import {
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useFormik} from "formik";
|
||||
@@ -16,15 +18,20 @@ import {useState} from "react";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import axios from "axios";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
|
||||
const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const t = useTranslations();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const Reject = ({rowId, fetchUrl, mutate}) => {
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
description: Yup.string().required(t("RejectDialog.description_error")),
|
||||
@@ -33,21 +40,33 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
reject_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
rejectData(REJECT_PASSENGER_BOSS, rowId, formData);
|
||||
formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${REJECT_PASSENGER_BOSS}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value);
|
||||
formik.handleChange(event);
|
||||
};
|
||||
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
if (uploadedFile) {
|
||||
@@ -66,59 +85,66 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</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>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenRejectDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default RejectForm;
|
||||
export default Reject;
|
||||
@@ -1,94 +1,23 @@
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import {Box, IconButton, Tooltip} from "@mui/material";
|
||||
import {useCallback, useState} from "react";
|
||||
import ConfirmForm from "./Form/ConfirmForm";
|
||||
import RejectForm from "./Form/RejectForm";
|
||||
import {useTranslations} from "next-intl";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {Box} from "@mui/material";
|
||||
import ConfirmForm from "./Form/ConfirmForm"
|
||||
import RejectForm from "./Form/RejectForm"
|
||||
|
||||
const TableRowActions = ({row, mutate, fetchUrl}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
|
||||
// Confirm
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const handleCloseConfirmDialog = () => {
|
||||
setOpenConfirmDialog(false);
|
||||
};
|
||||
const confirmData = useCallback((url, rowID, values) => {
|
||||
Notifications(t, undefined)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Confirm
|
||||
|
||||
// Reject
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
const handleCloseRejectDialog = () => {
|
||||
setOpenRejectDialog(false);
|
||||
};
|
||||
|
||||
const rejectData = useCallback((url, rowID, values) => {
|
||||
Notifications(t)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Reject
|
||||
const TableRow = ({row, mutate, fetchUrl}) => {
|
||||
|
||||
return (
|
||||
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<ConfirmForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openConfirmDialog}
|
||||
handleClose={handleCloseConfirmDialog}
|
||||
confirmData={confirmData}
|
||||
mutate={mutate}
|
||||
fetchUrl={fetchUrl}
|
||||
/>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<RejectForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openRejectDialog}
|
||||
handleClose={handleCloseRejectDialog}
|
||||
rejectData={rejectData}
|
||||
fetchUrl={fetchUrl}
|
||||
mutate={mutate}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableRowActions;
|
||||
export default TableRow;
|
||||
|
||||
@@ -1,48 +1,65 @@
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import {CONFIRM_PASSENGER_OFFICE} from "@/core/data/apiRoutes";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "@mui/material";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {useFormik} from "formik";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import {CONFIRM_PASSENGER_OFFICE} from "@/core/data/apiRoutes";
|
||||
|
||||
const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
const Confirm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
confirm_img: ""
|
||||
},
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
if (description !== "")
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
confirmData(CONFIRM_PASSENGER_OFFICE, rowId, formData);
|
||||
if (values.description != "") formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${CONFIRM_PASSENGER_OFFICE}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.handleChange(event);
|
||||
formik.setFieldValue("description", event.target.value)
|
||||
};
|
||||
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
if (uploadedFile) {
|
||||
@@ -52,6 +69,7 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
event.target.value = "";
|
||||
return;
|
||||
}
|
||||
|
||||
const fileType = event.target?.files?.[0].type;
|
||||
const fileName = event.target?.files?.[0].name;
|
||||
setSelectedImage(URL.createObjectURL(uploadedFile));
|
||||
@@ -61,56 +79,67 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ConfirmForm;
|
||||
export default Confirm;
|
||||
@@ -4,10 +4,12 @@ import {
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useFormik} from "formik";
|
||||
@@ -16,15 +18,20 @@ import {useState} from "react";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import axios from "axios";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
|
||||
const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const t = useTranslations();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const Reject = ({rowId, fetchUrl, mutate}) => {
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
description: Yup.string().required(t("RejectDialog.description_error")),
|
||||
@@ -33,18 +40,31 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
reject_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
rejectData(REJECT_PASSENGER_OFFICE, rowId, formData);
|
||||
formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${REJECT_PASSENGER_OFFICE}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value);
|
||||
formik.handleChange(event);
|
||||
};
|
||||
const handleUploadChange = (event) => {
|
||||
@@ -66,57 +86,65 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
}
|
||||
};
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</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>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenRejectDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default RejectForm;
|
||||
export default Reject;
|
||||
@@ -1,94 +1,23 @@
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import {Box, IconButton, Tooltip} from "@mui/material";
|
||||
import {useCallback, useState} from "react";
|
||||
import ConfirmForm from "./Form/ConfirmForm";
|
||||
import RejectForm from "./Form/RejectForm";
|
||||
import {useTranslations} from "next-intl";
|
||||
import axios from "axios";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import {Box} from "@mui/material";
|
||||
import ConfirmForm from "./Form/ConfirmForm"
|
||||
import RejectForm from "./Form/RejectForm"
|
||||
|
||||
const TableRowActions = ({row, mutate, fetchUrl}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
|
||||
// Confirm
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const handleCloseConfirmDialog = () => {
|
||||
setOpenConfirmDialog(false);
|
||||
};
|
||||
const confirmData = useCallback((url, rowID, values) => {
|
||||
Notifications(t, undefined)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Confirm
|
||||
|
||||
// Reject
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
const handleCloseRejectDialog = () => {
|
||||
setOpenRejectDialog(false);
|
||||
};
|
||||
|
||||
const rejectData = useCallback((url, rowID, values) => {
|
||||
Notifications(t)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Reject
|
||||
const TableRow = ({row, mutate, fetchUrl}) => {
|
||||
|
||||
return (
|
||||
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<ConfirmForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openConfirmDialog}
|
||||
handleClose={handleCloseConfirmDialog}
|
||||
confirmData={confirmData}
|
||||
mutate={mutate}
|
||||
fetchUrl={fetchUrl}
|
||||
/>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<RejectForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openRejectDialog}
|
||||
handleClose={handleCloseRejectDialog}
|
||||
rejectData={rejectData}
|
||||
fetchUrl={fetchUrl}
|
||||
mutate={mutate}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableRowActions;
|
||||
export default TableRow;
|
||||
|
||||
@@ -1,48 +1,65 @@
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import {CONFIRM_PROVINCE_MANAGER} from "@/core/data/apiRoutes";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "@mui/material";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {useFormik} from "formik";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import {CONFIRM_PROVINCE_MANAGER} from "@/core/data/apiRoutes";
|
||||
|
||||
const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
const Confirm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
confirm_img: ""
|
||||
},
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
if (description !== "")
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
confirmData(CONFIRM_PROVINCE_MANAGER, rowId, formData);
|
||||
if (values.description != "") formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${CONFIRM_PROVINCE_MANAGER}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.handleChange(event);
|
||||
formik.setFieldValue("description", event.target.value)
|
||||
};
|
||||
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
if (uploadedFile) {
|
||||
@@ -52,6 +69,7 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
event.target.value = "";
|
||||
return;
|
||||
}
|
||||
|
||||
const fileType = event.target?.files?.[0].type;
|
||||
const fileName = event.target?.files?.[0].name;
|
||||
setSelectedImage(URL.createObjectURL(uploadedFile));
|
||||
@@ -61,56 +79,67 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ConfirmForm;
|
||||
export default Confirm;
|
||||
@@ -4,10 +4,12 @@ import {
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useFormik} from "formik";
|
||||
@@ -16,15 +18,20 @@ import {useState} from "react";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import axios from "axios";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
|
||||
const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const t = useTranslations();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const Reject = ({rowId, fetchUrl, mutate}) => {
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
description: Yup.string().required(t("RejectDialog.description_error")),
|
||||
@@ -33,18 +40,31 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
reject_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
rejectData(REJECT_PROVINCE_MANAGER, rowId, formData);
|
||||
formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${REJECT_PROVINCE_MANAGER}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value);
|
||||
formik.handleChange(event);
|
||||
};
|
||||
const handleUploadChange = (event) => {
|
||||
@@ -65,59 +85,66 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</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>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenRejectDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default RejectForm;
|
||||
export default Reject;
|
||||
@@ -1,94 +1,23 @@
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import {Box, IconButton, Tooltip} from "@mui/material";
|
||||
import {useCallback, useState} from "react";
|
||||
import ConfirmForm from "./Form/ConfirmForm";
|
||||
import RejectForm from "./Form/RejectForm";
|
||||
import {useTranslations} from "next-intl";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {Box} from "@mui/material";
|
||||
import ConfirmForm from "./Form/ConfirmForm"
|
||||
import RejectForm from "./Form/RejectForm"
|
||||
|
||||
const TableRowActions = ({row, mutate, fetchUrl}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
|
||||
// Confirm
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const handleCloseConfirmDialog = () => {
|
||||
setOpenConfirmDialog(false);
|
||||
};
|
||||
const confirmData = useCallback((url, rowID, values) => {
|
||||
Notifications(t, undefined)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Confirm
|
||||
|
||||
// Reject
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
const handleCloseRejectDialog = () => {
|
||||
setOpenRejectDialog(false);
|
||||
};
|
||||
|
||||
const rejectData = useCallback((url, rowID, values) => {
|
||||
Notifications(t)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Reject
|
||||
const TableRow = ({row, mutate, fetchUrl}) => {
|
||||
|
||||
return (
|
||||
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<ConfirmForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openConfirmDialog}
|
||||
handleClose={handleCloseConfirmDialog}
|
||||
confirmData={confirmData}
|
||||
mutate={mutate}
|
||||
fetchUrl={fetchUrl}
|
||||
/>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<RejectForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openRejectDialog}
|
||||
handleClose={handleCloseRejectDialog}
|
||||
rejectData={rejectData}
|
||||
fetchUrl={fetchUrl}
|
||||
mutate={mutate}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableRowActions;
|
||||
export default TableRow;
|
||||
|
||||
@@ -1,44 +1,64 @@
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import {CONFIRM_TRANSPORTATION_ASSISTANCE} from "@/core/data/apiRoutes";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography
|
||||
} from "@mui/material";
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {useFormik} from "formik";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import {CONFIRM_TRANSPORTATION_ASSISTANCE} from "@/core/data/apiRoutes";
|
||||
|
||||
const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
const Confirm = ({rowId, fetchUrl, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [description, setDescription] = useState("");
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
confirm_img: ""
|
||||
},
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
if (description != "") formData.append("expert_description", description);
|
||||
handleClose();
|
||||
confirmData(CONFIRM_TRANSPORTATION_ASSISTANCE, rowId, formData);
|
||||
if (values.description != "") formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${CONFIRM_TRANSPORTATION_ASSISTANCE}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value)
|
||||
};
|
||||
const handleUploadChange = (event) => {
|
||||
const uploadedFile = event.target?.files?.[0];
|
||||
@@ -60,52 +80,66 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => {
|
||||
}
|
||||
};
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</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>{t("ConfirmDialog.confirm")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("ConfirmDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("ConfirmDialog.button-confirm")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default ConfirmForm;
|
||||
export default Confirm;
|
||||
@@ -4,10 +4,12 @@ import {
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
IconButton,
|
||||
Stack,
|
||||
TextField, Typography,
|
||||
TextField,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useFormik} from "formik";
|
||||
@@ -16,15 +18,20 @@ import {useState} from "react";
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import axios from "axios";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
|
||||
const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const [description, setDescription] = useState("");
|
||||
const Reject = ({rowId, fetchUrl, mutate}) => {
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
description: Yup.string().required(t("RejectDialog.description_error")),
|
||||
@@ -33,18 +40,31 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
reject_img: ""
|
||||
},
|
||||
validationSchema,
|
||||
onSubmit: () => {
|
||||
onSubmit: (values) => {
|
||||
const formData = new FormData();
|
||||
formData.append("expert_description", description);
|
||||
handleClose();
|
||||
rejectData(REJECT_TRANSPORTATION_ASSISTANCE, rowId, formData);
|
||||
formData.append("expert_description", values.description);
|
||||
Notifications(directionApp, t, undefined)
|
||||
axios
|
||||
.post(`${REJECT_TRANSPORTATION_ASSISTANCE}/${rowId}`, formData, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(directionApp, t, response);
|
||||
mutate(fetchUrl)
|
||||
formik.setSubmitting(false)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(directionApp, t, error.response);
|
||||
formik.setSubmitting(false)
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
const handleDescriptionChange = (event) => {
|
||||
setDescription(event.target.value);
|
||||
formik.setFieldValue("description", event.target.value);
|
||||
formik.handleChange(event);
|
||||
};
|
||||
const handleUploadChange = (event) => {
|
||||
@@ -66,56 +86,65 @@ const RejectForm = ({open, handleClose, rowId, rejectData}) => {
|
||||
}
|
||||
};
|
||||
return (
|
||||
<Dialog fullWidth open={open}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
<DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
<>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</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>{t("RejectDialog.reject")}</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={t("RejectDialog.description")}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
onBlur={formik.handleBlur("description")}
|
||||
error={
|
||||
formik.touched.description && Boolean(formik.errors.description)
|
||||
}
|
||||
helperText={formik.touched.description && formik.errors.description}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="reject_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250 /*width*/, 150 /*height*/]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
/>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} variant="outlined" color="secondary" autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary">
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenRejectDialog(false)} variant="outlined" color="secondary"
|
||||
disabled={formik.isSubmitting} autoFocus>
|
||||
{t("RejectDialog.button-cancel")}
|
||||
</Button>
|
||||
<Button onClick={formik.handleSubmit} variant="contained" color="primary"
|
||||
disabled={formik.isSubmitting}>
|
||||
{t("RejectDialog.button-reject")}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default RejectForm;
|
||||
export default Reject;
|
||||
@@ -1,94 +1,23 @@
|
||||
import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
|
||||
import ThumbDownIcon from "@mui/icons-material/ThumbDown";
|
||||
import {Box, IconButton, Tooltip} from "@mui/material";
|
||||
import {useCallback, useState} from "react";
|
||||
import ConfirmForm from "./Form/ConfirmForm";
|
||||
import RejectForm from "./Form/RejectForm";
|
||||
import {useTranslations} from "next-intl";
|
||||
import Notifications from "@/core/components/notifications";
|
||||
import useUser from "@/lib/app/hooks/useUser";
|
||||
import useDirection from "@/lib/app/hooks/useDirection";
|
||||
import axios from "axios";
|
||||
import {Box} from "@mui/material";
|
||||
import ConfirmForm from "./Form/ConfirmForm"
|
||||
import RejectForm from "./Form/RejectForm"
|
||||
|
||||
const TableRowActions = ({row, mutate, fetchUrl}) => {
|
||||
const t = useTranslations();
|
||||
const {token} = useUser();
|
||||
const {directionApp} = useDirection();
|
||||
|
||||
// Confirm
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const handleCloseConfirmDialog = () => {
|
||||
setOpenConfirmDialog(false);
|
||||
};
|
||||
const confirmData = useCallback((url, rowID, values) => {
|
||||
Notifications(t, undefined)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Confirm
|
||||
|
||||
// Reject
|
||||
const [openRejectDialog, setOpenRejectDialog] = useState(false);
|
||||
const handleCloseRejectDialog = () => {
|
||||
setOpenRejectDialog(false);
|
||||
};
|
||||
|
||||
const rejectData = useCallback((url, rowID, values) => {
|
||||
Notifications(t)
|
||||
axios
|
||||
.post(`${url}/${rowID}`, values, {
|
||||
headers: {authorization: `Bearer ${token}`},
|
||||
})
|
||||
.then((response) => {
|
||||
Notifications(t, response);
|
||||
mutate(fetchUrl)
|
||||
})
|
||||
.catch((error) => {
|
||||
Notifications(t, error.response);
|
||||
});
|
||||
}, []);
|
||||
// End Reject
|
||||
const TableRow = ({row, mutate, fetchUrl}) => {
|
||||
|
||||
return (
|
||||
<Box sx={{display: "flex", flexWrap: "nowrap", gap: "8px"}}>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
setOpenConfirmDialog(true)
|
||||
}}
|
||||
>
|
||||
<ThumbUpAltIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<ConfirmForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openConfirmDialog}
|
||||
handleClose={handleCloseConfirmDialog}
|
||||
confirmData={confirmData}
|
||||
mutate={mutate}
|
||||
fetchUrl={fetchUrl}
|
||||
/>
|
||||
<Tooltip title={t("RejectDialog.reject")}>
|
||||
<IconButton color="primary" onClick={() => setOpenRejectDialog(true)}>
|
||||
<ThumbDownIcon/>
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<RejectForm
|
||||
rowId={row.getValue("id")}
|
||||
open={openRejectDialog}
|
||||
handleClose={handleCloseRejectDialog}
|
||||
rejectData={rejectData}
|
||||
fetchUrl={fetchUrl}
|
||||
mutate={mutate}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default TableRowActions;
|
||||
export default TableRow;
|
||||
|
||||
@@ -225,7 +225,7 @@ function DashboardTransportationAssistanceComponent() {
|
||||
enableHiding={true}
|
||||
enableFullScreenToggle={false}
|
||||
enableGlobalFilter={false}
|
||||
enableColumnResizing={false} // if you want true this you shold change renderRowActions props ** see https://www.material-react-table.com/docs/guides/row-actions
|
||||
enableColumnResizing={false} // if you want true this you should change renderRowActions props ** see https://www.material-react-table.com/docs/guides/row-actions
|
||||
enableRowActions={true}
|
||||
TableRowAction={TableRowActions}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user