upload file

This commit is contained in:
Yasiu1376
2023-07-22 17:26:19 +03:30
parent 6ab080c26b
commit 8866cbc52f
13 changed files with 155 additions and 20 deletions

View File

@@ -13,9 +13,12 @@ import { useState } from "react";
import { useFormik } from "formik";
import * as Yup from "yup";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const t = useTranslations();
const { directionApp } = useDirection();
const [proposedAmount, setProposedAmount] = useState("");
const [description, setDescription] = useState("");
const [selectedImage, setSelectedImage] = useState("");
@@ -55,6 +58,11 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -13,9 +13,12 @@ import { useFormik } from "formik";
import * as Yup from "yup";
import { useState } from "react";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const t = useTranslations();
const { directionApp } = useDirection();
const [description, setDescription] = useState("");
const [selectedImage, setSelectedImage] = useState("");
const [fileType, setfileType] = useState(null);
@@ -47,6 +50,11 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -13,9 +13,12 @@ import { useState } from "react";
import { useFormik } from "formik";
import * as Yup from "yup";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const t = useTranslations();
const { directionApp } = useDirection();
const [proposedAmount, setProposedAmount] = useState("");
const [description, setDescription] = useState("");
const [selectedImage, setSelectedImage] = useState("");
@@ -56,6 +59,11 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -13,9 +13,12 @@ import { useFormik } from "formik";
import * as Yup from "yup";
import { useState } from "react";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const t = useTranslations();
const { directionApp } = useDirection();
const [description, setDescription] = useState("");
const [selectedImage, setSelectedImage] = useState("");
const [fileType, setfileType] = useState(null);
@@ -43,10 +46,15 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
setDescription(event.target.value);
formik.handleChange(event);
};
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -1,5 +1,7 @@
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 {
Dialog,
DialogTitle,
@@ -8,39 +10,33 @@ import {
DialogActions,
Button,
TextField,
FormHelperText,
} from "@mui/material";
import { useFormik } from "formik";
import { useTranslations } from "next-intl";
import { useRef, useState } from "react";
const MAX_FILE_SIZE_IN_BYTES = 2 * 1024 * 1024;
const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const t = useTranslations();
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 formik = useFormik({
initialValues: {
description: "",
fileData: null,
},
onSubmit: () => {
const formData = new FormData();
if (description !== "")
formData.append("expert_description", description);
if (fileData !== null) formData.append("file", fileData);
handleClose();
confirmData(CONFIRM_PASSENGER_OFFICE, rowId, formData);
},
});
const handleDescriptionChange = (event) => {
setDescription(event.target.value);
formik.handleChange(event);
@@ -49,6 +45,11 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -13,15 +13,18 @@ import { useFormik } from "formik";
import * as Yup from "yup";
import { useState } from "react";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const t = useTranslations();
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 validationSchema = Yup.object().shape({
description: Yup.string().required(t("RejectDialog.description_error")),
});
@@ -46,6 +49,11 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -1,5 +1,7 @@
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 {
Dialog,
DialogTitle,
@@ -8,15 +10,14 @@ import {
DialogActions,
Button,
TextField,
FormHelperText,
} from "@mui/material";
import { useFormik } from "formik";
import { useTranslations } from "next-intl";
import { useRef, useState } from "react";
const MAX_FILE_SIZE_IN_BYTES = 2 * 1024 * 1024;
const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const t = useTranslations();
const { directionApp } = useDirection();
const [description, setDescription] = useState("");
const [selectedImage, setSelectedImage] = useState("");
const [fileType, setfileType] = useState(null);
@@ -26,13 +27,11 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const formik = useFormik({
initialValues: {
description: "",
fileData: null,
},
onSubmit: () => {
const formData = new FormData();
if (description !== "")
formData.append("expert_description", description);
if (fileData !== null) formData.append("file", fileData);
handleClose();
confirmData(CONFIRM_PROVINCE_MANAGER, rowId, formData);
},
@@ -46,6 +45,11 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));
@@ -86,7 +90,6 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
setShowAddIcon={setShowAddIcon}
showAddIcon={showAddIcon}
/>
</DialogContent>
<DialogActions>
<Button onClick={handleClose} color="secondary" autoFocus>

View File

@@ -13,9 +13,12 @@ import { useFormik } from "formik";
import * as Yup from "yup";
import { useState } from "react";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const t = useTranslations();
const { directionApp } = useDirection();
const [description, setDescription] = useState("");
const [selectedImage, setSelectedImage] = useState("");
const [fileType, setfileType] = useState(null);
@@ -46,6 +49,11 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));

View File

@@ -1,4 +1,6 @@
import UploadSystem from "@/core/components/UploadSystem";
import { CONFIRM_TRANSPORTATION_ASSISTANCE } from "@/core/data/apiRoutes";
import useDirection from "@/lib/app/hooks/useDirection";
import {
Dialog,
DialogTitle,
@@ -11,10 +13,16 @@ import {
import { useFormik } from "formik";
import { useTranslations } from "next-intl";
import { useState } from "react";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const t = useTranslations();
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 formik = useFormik({
initialValues: {
@@ -31,7 +39,24 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
const handleDescriptionChange = (event) => {
setDescription(event.target.value);
};
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));
setfileType(fileType);
setfileName(fileName);
formik.setFieldValue("confirm_img", uploadedFile);
setShowAddIcon(false);
}
};
return (
<Dialog open={open}>
<DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
@@ -48,6 +73,19 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
variant="outlined"
sx={{ mt: 1 }}
/>
<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}
/>
</DialogContent>
<DialogActions>
<Button onClick={handleClose} color="secondary" autoFocus>

View File

@@ -13,6 +13,8 @@ import { useFormik } from "formik";
import * as Yup from "yup";
import { useState } from "react";
import UploadSystem from "@/core/components/UploadSystem";
import UploadFileNotification from "@/core/components/notifications/UploadFileNotification";
import useDirection from "@/lib/app/hooks/useDirection";
const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const [description, setDescription] = useState("");
@@ -21,6 +23,7 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const [fileName, setfileName] = useState(null);
const [showAddIcon, setShowAddIcon] = useState(true);
const t = useTranslations();
const { directionApp } = useDirection();
const validationSchema = Yup.object().shape({
description: Yup.string().required(t("RejectDialog.description_error")),
@@ -46,6 +49,11 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
const handleUploadChange = (event) => {
const uploadedFile = event.target?.files?.[0];
if (uploadedFile) {
const maxFileSize = 2 * 1024 * 1024;
if (uploadedFile.size > maxFileSize) {
UploadFileNotification(directionApp, t);
return;
}
const fileType = event.target?.files?.[0].type;
const fileName = event.target?.files?.[0].name;
setSelectedImage(URL.createObjectURL(uploadedFile));