diff --git a/src/components/dashboard/machinary-office/Form/ConfirmForm.jsx b/src/components/dashboard/machinary-office/Form/ConfirmForm.jsx index b77f1a0..4ba49e2 100644 --- a/src/components/dashboard/machinary-office/Form/ConfirmForm.jsx +++ b/src/components/dashboard/machinary-office/Form/ConfirmForm.jsx @@ -1,60 +1,77 @@ -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")), - }); + }) 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.setFieldValue("proposed_amount", event.target.value); } - formik.handleChange(event); }; - const handleUploadChange = (event) => { const uploadedFile = event.target?.files?.[0]; if (uploadedFile) { @@ -64,6 +81,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 +92,92 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => { } }; return ( - - {t("ConfirmDialog.confirm")} - - - - - {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} - value={description} - onChange={handleDescriptionChange} - fullWidth - variant="outlined" - sx={{mt: 1}} - /> + <> + + { + setOpenConfirmDialog(true) + }} + > + + + + + {t("ConfirmDialog.confirm")} + + + + + {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} + value={formik.values.description} + onChange={handleDescriptionChange} + fullWidth + variant="outlined" + sx={{mt: 1}} + /> + + + + {t("ConfirmDialog.proposed_amount")}{t("ConfirmDialog.unit")}} + type="number" + inputProps={{ + min: 0, + inputMode: "numeric", + 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 + /> + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - - {t("ConfirmDialog.proposed_amount")}{t("ConfirmDialog.unit")}} - 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 - /> - - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; -export default ConfirmForm; \ No newline at end of file +export default Confirm; \ No newline at end of file diff --git a/src/components/dashboard/machinary-office/Form/RejectForm.jsx b/src/components/dashboard/machinary-office/Form/RejectForm.jsx index 4c7a8c2..2105a44 100644 --- a/src/components/dashboard/machinary-office/Form/RejectForm.jsx +++ b/src/components/dashboard/machinary-office/Form/RejectForm.jsx @@ -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 ( - - {t("RejectDialog.reject")} - - - - + <> + + setOpenRejectDialog(true)}> + + + + + {t("RejectDialog.reject")} + + + + + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; - -export default RejectForm; \ No newline at end of file +export default Reject; \ No newline at end of file diff --git a/src/components/dashboard/machinary-office/TableRowActions.jsx b/src/components/dashboard/machinary-office/TableRowActions.jsx index 303fd0c..601240f 100644 --- a/src/components/dashboard/machinary-office/TableRowActions.jsx +++ b/src/components/dashboard/machinary-office/TableRowActions.jsx @@ -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(directionApp, t, undefined) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Confirm - - // Reject - const [openRejectDialog, setOpenRejectDialog] = useState(false); - const handleCloseRejectDialog = () => { - setOpenRejectDialog(false); - }; - - const rejectData = useCallback((url, rowID, values) => { - Notifications(directionApp, t) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Reject +const TableRow = ({row, mutate, fetchUrl}) => { return ( - - { - setOpenConfirmDialog(true) - }} - > - - - - - setOpenRejectDialog(true)}> - - - ); }; -export default TableRowActions; +export default TableRow; diff --git a/src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx b/src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx index d560507..8ca872d 100644 --- a/src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx +++ b/src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx @@ -1,33 +1,38 @@ -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") @@ -35,27 +40,39 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => { }); 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.setFieldValue("approved_amount", event.target.value); } - formik.handleChange(event); }; const handleUploadChange = (event) => { const uploadedFile = event.target?.files?.[0]; @@ -66,6 +83,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 +93,93 @@ const ConfirmForm = ({open, handleClose, rowId, confirmData}) => { setShowAddIcon(false); } }; - return ( - - {t("ConfirmDialog.confirm")} - - - - - {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} - value={description} - onChange={handleDescriptionChange} - fullWidth - variant="outlined" - sx={{mt: 1}} - /> + <> + + { + setOpenConfirmDialog(true) + }} + > + + + + + {t("ConfirmDialog.confirm")} + + + + + {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} + value={formik.values.description} + onChange={handleDescriptionChange} + fullWidth + variant="outlined" + sx={{mt: 1}} + /> + + + + {t("ConfirmDialog.approved_amount")}{t("ConfirmDialog.unit")}} + type="number" + inputProps={{ + min: 0, + inputMode: "numeric", + 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 + /> + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - - {t("ConfirmDialog.approved_amount")}{t("ConfirmDialog.unit")}} - 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 - /> - - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; -export default ConfirmForm; \ No newline at end of file +export default Confirm; \ No newline at end of file diff --git a/src/components/dashboard/passenger-boss/Form/RejectForm.jsx b/src/components/dashboard/passenger-boss/Form/RejectForm.jsx index acac864..7377777 100644 --- a/src/components/dashboard/passenger-boss/Form/RejectForm.jsx +++ b/src/components/dashboard/passenger-boss/Form/RejectForm.jsx @@ -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 ( - - {t("RejectDialog.reject")} - - - - + <> + + setOpenRejectDialog(true)}> + + + + + {t("RejectDialog.reject")} + + + + + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; - -export default RejectForm; \ No newline at end of file +export default Reject; \ No newline at end of file diff --git a/src/components/dashboard/passenger-boss/TableRowActions.jsx b/src/components/dashboard/passenger-boss/TableRowActions.jsx index 4071b91..601240f 100644 --- a/src/components/dashboard/passenger-boss/TableRowActions.jsx +++ b/src/components/dashboard/passenger-boss/TableRowActions.jsx @@ -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(directionApp, t, undefined) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Confirm - - // Reject - const [openRejectDialog, setOpenRejectDialog] = useState(false); - const handleCloseRejectDialog = () => { - setOpenRejectDialog(false); - }; - - const rejectData = useCallback((url, rowID, values) => { - Notifications(directionApp, t) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Reject +const TableRow = ({row, mutate, fetchUrl}) => { return ( - - { - setOpenConfirmDialog(true) - }} - > - - - - - setOpenRejectDialog(true)}> - - - ); }; -export default TableRowActions; +export default TableRow; diff --git a/src/components/dashboard/passenger-office/Form/ConfirmForm.jsx b/src/components/dashboard/passenger-office/Form/ConfirmForm.jsx index 1f5170b..493db2c 100644 --- a/src/components/dashboard/passenger-office/Form/ConfirmForm.jsx +++ b/src/components/dashboard/passenger-office/Form/ConfirmForm.jsx @@ -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 ( - - {t("ConfirmDialog.confirm")} - - - - - - {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} - value={description} - onChange={handleDescriptionChange} - onBlur={formik.handleBlur("description")} - fullWidth - variant="outlined" - sx={{mt: 1}} - /> + <> + + { + setOpenConfirmDialog(true) + }} + > + + + + + {t("ConfirmDialog.confirm")} + + + + + {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} + value={formik.values.description} + onChange={handleDescriptionChange} + fullWidth + variant="outlined" + sx={{mt: 1}} + /> + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; -export default ConfirmForm; \ No newline at end of file +export default Confirm; \ No newline at end of file diff --git a/src/components/dashboard/passenger-office/Form/RejectForm.jsx b/src/components/dashboard/passenger-office/Form/RejectForm.jsx index 43c7dd4..7e37c9b 100644 --- a/src/components/dashboard/passenger-office/Form/RejectForm.jsx +++ b/src/components/dashboard/passenger-office/Form/RejectForm.jsx @@ -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 ( - - {t("RejectDialog.reject")} - - - - + <> + + setOpenRejectDialog(true)}> + + + + + {t("RejectDialog.reject")} + + + + + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; - -export default RejectForm; \ No newline at end of file +export default Reject; \ No newline at end of file diff --git a/src/components/dashboard/passenger-office/TableRowActions.jsx b/src/components/dashboard/passenger-office/TableRowActions.jsx index fea0ad3..601240f 100644 --- a/src/components/dashboard/passenger-office/TableRowActions.jsx +++ b/src/components/dashboard/passenger-office/TableRowActions.jsx @@ -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(directionApp, t, undefined) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Confirm - - // Reject - const [openRejectDialog, setOpenRejectDialog] = useState(false); - const handleCloseRejectDialog = () => { - setOpenRejectDialog(false); - }; - - const rejectData = useCallback((url, rowID, values) => { - Notifications(directionApp, t) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Reject +const TableRow = ({row, mutate, fetchUrl}) => { return ( - - { - setOpenConfirmDialog(true) - }} - > - - - - - setOpenRejectDialog(true)}> - - - ); }; -export default TableRowActions; +export default TableRow; diff --git a/src/components/dashboard/province-manager/Form/ConfirmForm.jsx b/src/components/dashboard/province-manager/Form/ConfirmForm.jsx index 0d4b435..23e946f 100644 --- a/src/components/dashboard/province-manager/Form/ConfirmForm.jsx +++ b/src/components/dashboard/province-manager/Form/ConfirmForm.jsx @@ -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 ( - - {t("ConfirmDialog.confirm")} - - - - - - {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} - value={description} - onChange={handleDescriptionChange} - onBlur={formik.handleBlur("description")} - fullWidth - variant="outlined" - sx={{mt: 1}} - /> + <> + + { + setOpenConfirmDialog(true) + }} + > + + + + + {t("ConfirmDialog.confirm")} + + + + + {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} + value={formik.values.description} + onChange={handleDescriptionChange} + fullWidth + variant="outlined" + sx={{mt: 1}} + /> + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; -export default ConfirmForm; \ No newline at end of file +export default Confirm; \ No newline at end of file diff --git a/src/components/dashboard/province-manager/Form/RejectForm.jsx b/src/components/dashboard/province-manager/Form/RejectForm.jsx index 7e9ece6..5c085d8 100644 --- a/src/components/dashboard/province-manager/Form/RejectForm.jsx +++ b/src/components/dashboard/province-manager/Form/RejectForm.jsx @@ -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 ( - - {t("RejectDialog.reject")} - - - - + <> + + setOpenRejectDialog(true)}> + + + + + {t("RejectDialog.reject")} + + + + + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; - -export default RejectForm; \ No newline at end of file +export default Reject; \ No newline at end of file diff --git a/src/components/dashboard/province-manager/TableRowActions.jsx b/src/components/dashboard/province-manager/TableRowActions.jsx index 4071b91..601240f 100644 --- a/src/components/dashboard/province-manager/TableRowActions.jsx +++ b/src/components/dashboard/province-manager/TableRowActions.jsx @@ -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(directionApp, t, undefined) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Confirm - - // Reject - const [openRejectDialog, setOpenRejectDialog] = useState(false); - const handleCloseRejectDialog = () => { - setOpenRejectDialog(false); - }; - - const rejectData = useCallback((url, rowID, values) => { - Notifications(directionApp, t) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Reject +const TableRow = ({row, mutate, fetchUrl}) => { return ( - - { - setOpenConfirmDialog(true) - }} - > - - - - - setOpenRejectDialog(true)}> - - - ); }; -export default TableRowActions; +export default TableRow; diff --git a/src/components/dashboard/transportation-assistance/Form/ConfirmForm.jsx b/src/components/dashboard/transportation-assistance/Form/ConfirmForm.jsx index 2c2ab5c..a5902e0 100644 --- a/src/components/dashboard/transportation-assistance/Form/ConfirmForm.jsx +++ b/src/components/dashboard/transportation-assistance/Form/ConfirmForm.jsx @@ -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 ( - - {t("ConfirmDialog.confirm")} - - - - - {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} - value={description} - onChange={handleDescriptionChange} - fullWidth - variant="outlined" - sx={{mt: 1}} - /> + <> + + { + setOpenConfirmDialog(true) + }} + > + + + + + {t("ConfirmDialog.confirm")} + + + + + {t("ConfirmDialog.description")}{t("ConfirmDialog.optional")}} + value={formik.values.description} + onChange={handleDescriptionChange} + fullWidth + variant="outlined" + sx={{mt: 1}} + /> + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; -export default ConfirmForm; \ No newline at end of file +export default Confirm; \ No newline at end of file diff --git a/src/components/dashboard/transportation-assistance/Form/RejectForm.jsx b/src/components/dashboard/transportation-assistance/Form/RejectForm.jsx index a88e795..c9b76c8 100644 --- a/src/components/dashboard/transportation-assistance/Form/RejectForm.jsx +++ b/src/components/dashboard/transportation-assistance/Form/RejectForm.jsx @@ -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 ( - - {t("RejectDialog.reject")} - - - - + <> + + setOpenRejectDialog(true)}> + + + + + {t("RejectDialog.reject")} + + + + + + + {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} + + - - {t("UploadSystem.upload_file")}{t("UploadSystem.optional")} - - - - - - - - - + + + + + + + ); }; -export default RejectForm; \ No newline at end of file +export default Reject; \ No newline at end of file diff --git a/src/components/dashboard/transportation-assistance/TableRowActions.jsx b/src/components/dashboard/transportation-assistance/TableRowActions.jsx index 4071b91..601240f 100644 --- a/src/components/dashboard/transportation-assistance/TableRowActions.jsx +++ b/src/components/dashboard/transportation-assistance/TableRowActions.jsx @@ -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(directionApp, t, undefined) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Confirm - - // Reject - const [openRejectDialog, setOpenRejectDialog] = useState(false); - const handleCloseRejectDialog = () => { - setOpenRejectDialog(false); - }; - - const rejectData = useCallback((url, rowID, values) => { - Notifications(directionApp, t) - axios - .post(`${url}/${rowID}`, values, { - headers: {authorization: `Bearer ${token}`}, - }) - .then((response) => { - Notifications(directionApp, t, response); - mutate(fetchUrl) - }) - .catch((error) => { - Notifications(directionApp, t, error.response); - }); - }, []); - // End Reject +const TableRow = ({row, mutate, fetchUrl}) => { return ( - - { - setOpenConfirmDialog(true) - }} - > - - - - - setOpenRejectDialog(true)}> - - - ); }; -export default TableRowActions; +export default TableRow; diff --git a/src/components/dashboard/transportation-assistance/index.jsx b/src/components/dashboard/transportation-assistance/index.jsx index f776118..efcf348 100644 --- a/src/components/dashboard/transportation-assistance/index.jsx +++ b/src/components/dashboard/transportation-assistance/index.jsx @@ -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} />