choose file

public/locales/fa/app.json

@@ -131,7 +131,9 @@
     "button-confirm": "تایید",
     "button-cancel": "بستن",
     "amount_error": "وارد کردن مقدار پیشنهادی الزامیست",
-    "description_error": "وارد کردن توضیحات الزامی است!"
+    "description_error": "وارد کردن توضیحات الزامی است!",
+    "description": "توضیحات",
+    "choose_file": "انتخاب فایل"
   },
   "RejectDialog": {
     "reject": "عدم تایید",

src/components/dashboard/passenger-office/Form/ConfirmForm.jsx

@@ -7,14 +7,18 @@ import {
   DialogActions,
   Button,
   TextField,
+  FormHelperText,
+  Input,
 } from "@mui/material";
 import { useFormik } from "formik";
 import { useTranslations } from "next-intl";
 import { useState } from "react";
+const MAX_FILE_SIZE_IN_BYTES = 2 * 1024 * 1024;
 
 const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
   const t = useTranslations();
   const [description, setDescription] = useState("");
+  const [fileData, setFileData] = useState(null);
 
   const formik = useFormik({
     initialValues: {
@@ -25,7 +29,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
       const formData = new FormData();
       if (description !== "")
         formData.append("expert_description", description);
-      // if (fileData !== null) formData.append("file", fileData);
+      if (fileData !== null) formData.append("file", fileData);
       handleClose();
       confirmData(CONFIRM_PASSENGER_OFFICE, rowId, formData);
     },
@@ -40,6 +44,26 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
     handleClose();
     confirmData(CONFIRM_PASSENGER_OFFICE, rowId);
   };
+
+  const handleFileChange = (e) => {
+    console.log("hiiii");
+    const selectedFile = e.target.files[0];
+    if (selectedFile) {
+      const fileSizeInBytes = selectedFile.size;
+      if (fileSizeInBytes > MAX_FILE_SIZE_IN_BYTES) {
+        formik.setFieldError(
+          "fileData",
+          `File size exceeds the limit (${MAX_FILE_SIZE_IN_BYTES / 1000000} MB)`
+        );
+        e.target.value = null;
+      } else {
+        setFileData(selectedFile);
+        formik.setFieldValue("fileData", selectedFile);
+        formik.setFieldError("fileData", "");
+      }
+    }
+  };
+
   return (
     <Dialog open={open} onClose={handleClose}>
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
@@ -49,7 +73,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
           name="description"
           multiline
           rows={8}
-          placeholder={t("RejectDialog.description")}
+          placeholder={t("ConfirmDialog.description")}
           value={description}
           onChange={handleDescriptionChange}
           onBlur={formik.handleBlur("description")}
@@ -57,6 +81,43 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
           variant="outlined"
           sx={{ mt: 1 }}
         />
+        <div>
+          <input
+            id="fileData"
+            name="fileData"
+            type="file"
+            accept=".pdf, image/*"
+            onChange={handleFileChange}
+            style={{ display: "none" }}
+          />
+          <label htmlFor="fileData">
+            <Button
+              id="fileData"
+              name="fileData"
+              variant="outlined"
+              color="primary"
+              component="span"
+              sx={{ mt: 1, width: "100%" }}
+            >
+              {t("ConfirmDialog.choose_file")}
+            </Button>
+          </label>
+          {/* <label htmlFor="fileData">
+            <Button
+              component="span"
+              variant="outlined"
+              color="primary"
+              sx={{ mt: 1, width: "100%", border: "dashed", color: "black " }}
+            >
+              {t("ConfirmDialog.choose_file")}
+            </Button>
+          </label> */}
+        </div>
+        <FormHelperText error={Boolean(formik.errors.fileData)}>
+          {formik.errors.fileData && formik.errors.fileData}
+          {formik.values.fileData &&
+            `Selected file: ${formik.values.fileData.name}`}
+        </FormHelperText>
       </DialogContent>
       <DialogActions>
         <Button onClick={handleConfirm} color="primary">