Merge branch 'feature/yasi_add_extra_file' into 'develop'

Feature/yasi add extra file See merge request witel-front-end/loan-facilities/expert!126
2023-12-27 09:54:38 +00:00
parent 51108aa597 f7d3c6a099
commit 00a7ef3ad9
3 changed files with 254 additions and 85 deletions
--- a/public/locales/fa/app.json
+++ b/public/locales/fa/app.json
@@ -217,12 +217,15 @@
    "state_name": "وضعیت درخواست",
    "confirm": "ارجاع به معاون حمل و نقل",
    "upload_file": "صورت جلسه کارگروه را بارگذاری کنید",
-    "upload_file_required": "وارد کردن صورت جلسه کارگروه الزامیست",
+    "upload_file_first_required": "وارد کردن فرم الف الزامیست",
+    "upload_file_second_required": "وارد کردن فرم ب الزامیست",
    "upload_file_unit": "فایل بارگذاری شده باید حداکثر 2Mb باشد",
    "upload_file_format": "فرمت قابل قبول : png,jpg,pdf",
    "print_final_credit_amount": "چاپ صورت جلسه تعیین مبلغ نهایی",
    "max_amount": "حداکثر مبلغ تصویب شده  {value} میلیون ریال می باشد",
-    "excel_report": "گزارش اکسل"
+    "excel_report": "گزارش اکسل",
+    "first_form": "فرم الف را بارگذاری کنید",
+    "second_form": "فرم ب را بارگذاری کنید"
  },
  "RefahiProvinceManager": {
    "name": "نام",
--- a/src/components/dashboard/passenger-boss/Form/ConfirmForm/ConfirmContent.jsx
+++ b/src/components/dashboard/passenger-boss/Form/ConfirmForm/ConfirmContent.jsx
@@ -28,12 +28,17 @@ const vehicle_amount = {
 }
 const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, handleSizeChangeClick}) => {
    const t = useTranslations();
-    const [selectedImage, setSelectedImage] = useState("");
-    const [fileType, setfileType] = useState(null);
-    const [fileName, setfileName] = useState(null);
-    const [showAddIcon, setShowAddIcon] = useState(true);
+    const [selectedImageAForm, setSelectedImageAForm] = useState("");
+    const [selectedImageBForm, setSelectedImageBForm] = useState("");
+    const [fileTypesA, setFileTypesA] = useState(null);
+    const [fileNamesA, setFileNamesA] = useState(null);
+    const [fileTypesB, setFileTypesB] = useState(null);
+    const [fileNamesB, setFileNamesB] = useState(null);
+    const [showAddIconA, setShowAddIconA] = useState(true);
+    const [showAddIconB, setShowAddIconB] = useState(true);
    const requestServer = useRequest({auth: true, notification: false})
    const {update_notification} = useNotification();
+    const [attachmentsData, setAttachmentsData] = useState([]);
    const [accordionStates, setAccordionStates] = useState([]);
    const [hasImageShown, setHasImageShown] = useState(false);
    const [imageLink, setImageLink] = useState(null);
@@ -44,8 +49,14 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
    useEffect(() => {
        requestServer(`${EXPORT_PASSENGER_BOSS_DETAILS}/${rowId}`, 'get')
            .then((response) => {
-                const booleanData = Array.from({length: response.data.data.attachment_files.length}, () => false);
-                setAccordionStates(booleanData);
+                const allAttachments = [];
+                response.data.data.histories.map((history) => {
+                    history.attachments.map((attachment) => {
+                        allAttachments.push(attachment);
+                    });
+                });
+                setDetailsData(response.data);
+                setAttachmentsData(allAttachments);
                setDetailsData(response.data)
            })
            .catch(() => {
@@ -54,6 +65,13 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
        });
    }, []);

+    useEffect(() => {
+        if (attachmentsData.length !== 0) {
+            const booleanData = Array.from({length: attachmentsData.length}, () => false);
+            setAccordionStates(booleanData);
+        }
+    }, [attachmentsData]);
+
    const handleAccordionChange = (index) => {
        const newAccordionStates = accordionStates.map((state, i) => i === index ? !state : false);
        setAccordionStates(newAccordionStates);
@@ -65,7 +83,7 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
        } else {
            handleSizeChangeClick('xl');
            setHasImageShown(true);
-            setImageLink(detailsList.data.attachment_files[index])
+            setImageLink(attachmentsData[index])
            setIsSkeleton(true)
        }
    };
@@ -80,8 +98,17 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
            (value) => value <= vehicle_amount[vehicle_type])
            .test("positive", `${t("ConfirmDialog.approved_amount_positive")}`, (value) => value >= 0)
            .required(t("ConfirmDialog.approved_amount_error")),
-        confirm_img: Yup.mixed()
-            .required(t("PassengerBoss.upload_file_required"))
+        first_img: Yup.mixed()
+            .required(t("PassengerBoss.upload_file_first_required"))
+            .test('fileSize', `${t("PassengerBoss.upload_file_unit")}`, (value) => {
+                return value.size <= 2 * 1024 * 1024;
+            })
+            .test('fileType', `${t("PassengerBoss.upload_file_format")}`, (value) => {
+                const allowedTypes = ['image/jpg', 'image/jpeg', 'image/png', 'application/pdf']; // Define your allowed file types
+                return allowedTypes.includes(value.type);
+            }),
+        second_img: Yup.mixed()
+            .required(t("PassengerBoss.upload_file_second_required"))
            .test('fileSize', `${t("PassengerBoss.upload_file_unit")}`, (value) => {
                return value.size <= 2 * 1024 * 1024;
            })
@@ -95,17 +122,29 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
        initialValues: {
            description: "",
            approved_amount: "",
-            confirm_img: null
+            first_img: null,
+            second_img: null
        }, validationSchema,
        onSubmit: (values, {setSubmitting}) => {
            const formData = new FormData();
-            formData.append("approved_amount", values.approved_amount);
-            if (values.description != "") formData.append("expert_description", values.description);
-            formData.append("attachment", values.confirm_img);

-            requestServer(`${CONFIRM_PASSENGER_BOSS}/${rowId}`, 'post', {
+            formData.append("approved_amount", values.approved_amount);
+
+            if (values.description != "") formData.append("expert_description", values.description);
+
+            const attachments = [
+                { title: 'فرم الف', file: values.first_img },
+                { title: 'فرم ب', file: values.second_img }
+            ];
+
+            attachments.forEach((attachment, index) => {
+                formData.append(`attachment[${index}][title]`, attachment.title);
+                formData.append(`attachment[${index}][file]`, attachment.file);
+            });
+
+            requestServer(`${CONFIRM_PASSENGER_BOSS}/${rowId}`, 'post',{
+                notification: true,
                data: formData,
-                notification: true
            }).then((response) => {
                setOpenConfirmDialog(false)
                mutate()
@@ -121,18 +160,32 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
        formik.setFieldValue("description", event.target.value)
    };

-    const handleUploadChange = (event) => {
+    const handleUploadChangeAForm = (event) => {
        const uploadedFile = event.target?.files?.[0];
        if (uploadedFile) {
            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).then(() => {
-                formik.setFieldTouched("confirm_img", true);
+            setSelectedImageAForm(URL.createObjectURL(uploadedFile));
+            setFileTypesA(fileType);
+            setFileNamesA(fileName);
+            formik.setFieldValue("first_img", uploadedFile).then(() => {
+                formik.setFieldTouched("first_img", true);
            })
-            setShowAddIcon(false);
+            setShowAddIconA(false);
+        }
+    };
+    const handleUploadChangeBForm = (event) => {
+        const uploadedFile = event.target?.files?.[0];
+        if (uploadedFile) {
+            const fileType = event.target?.files?.[0].type;
+            const fileName = event.target?.files?.[0].name;
+            setSelectedImageBForm(URL.createObjectURL(uploadedFile));
+            setFileTypesB(fileType);
+            setFileNamesB(fileName);
+            formik.setFieldValue("second_img", uploadedFile).then(() => {
+                formik.setFieldTouched("second_img", true);
+            })
+            setShowAddIconB(false);
        }
    };
    const handleAmountChange = (event) => {
@@ -144,8 +197,8 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
    };

    const renderCustomAccordions = () => {
-        if (detailsList && detailsList.data && detailsList.data.attachment_files) {
-            return detailsList.data.attachment_files.map((file, index) => (
+        if (attachmentsData) {
+            return attachmentsData.map((file, index) => (
                <CustomAccordion
                    key={index}
                    title={`${file.title}`}
@@ -153,13 +206,12 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
                    hasAccordionOpened={null}
                    handleAccordionChange={() => handleAccordionChange(index)}
                    accordionIndex={index}
-                    downloadFile={file.attachment}
+                    downloadFile={file.file}
                />
            ));
        }
        return null;
    };
-
    return (
        <>
            <DialogContent>
@@ -227,30 +279,60 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type, hand
                                />
                            </Stack>
                            <Stack>
-                                <Typography>{t("PassengerBoss.upload_file")}</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}
-                                    onBlur={() => formik.handleBlur("confirm_img")}
-                                    error={
-                                        formik.touched.confirm_img &&
-                                        Boolean(formik.errors.confirm_img)
-                                    }
-                                />
-                                <FormHelperText
-                                    error={Boolean(formik.errors.confirm_img)}
-                                >
-                                    {formik.touched.confirm_img && formik.errors.confirm_img}
-                                </FormHelperText>
+                                <Grid container spacing={2}>
+                                    <Grid item xs={12} sm={6}>
+                                        <Typography>{t("PassengerBoss.first_form")}</Typography>
+                                        <UploadSystem
+                                            selectedImage={selectedImageAForm}
+                                            handleUploadChange={handleUploadChangeAForm} // Pass the updated function directly
+                                            setselectedImage={setSelectedImageAForm}
+                                            setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
+                                            fieldname="first_img"
+                                            fileType={fileTypesA}
+                                            fileName={fileNamesA}
+                                            imageAlt={t("app_name")}
+                                            imageSize={[250, 150]}
+                                            setShowAddIcon={setShowAddIconA}
+                                            showAddIcon={showAddIconA}
+                                            onBlur={() => formik.handleBlur("first_img")}
+                                            error={
+                                                formik.touched.first_img &&
+                                                Boolean(formik.errors.first_img)
+                                            }
+                                        />
+                                        <FormHelperText
+                                            error={Boolean(formik.errors.first_img)}
+                                        >
+                                            {formik.touched.first_img && formik.errors.first_img}
+                                        </FormHelperText>
+                                    </Grid>
+                                    <Grid item xs={12} sm={6}>
+                                        <Typography>{t("PassengerBoss.second_form")}</Typography>
+                                        <UploadSystem
+                                            selectedImage={selectedImageBForm}
+                                            handleUploadChange={handleUploadChangeBForm} // Pass the updated function directly
+                                            setselectedImage={setSelectedImageBForm}
+                                            setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
+                                            fieldname="second_img"
+                                            fileType={fileTypesB} // Use fileTypes array at index 0 for the first instance
+                                            fileName={fileNamesB}
+                                            imageAlt={t("app_name")}
+                                            imageSize={[250, 150]}
+                                            setShowAddIcon={setShowAddIconB}
+                                            showAddIcon={showAddIconB}
+                                            onBlur={() => formik.handleBlur("second_img")}
+                                            error={
+                                                formik.touched.second_img &&
+                                                Boolean(formik.errors.second_img)
+                                            }
+                                        />
+                                        <FormHelperText
+                                            error={Boolean(formik.errors.second_img)}
+                                        >
+                                            {formik.touched.second_img && formik.errors.second_img}
+                                        </FormHelperText>
+                                    </Grid>
+                                </Grid>
                            </Stack>
                        </Stack>
                    </Grid>
--- a/src/components/dashboard/passenger-boss/Form/RejectForm/RejectContent.jsx
+++ b/src/components/dashboard/passenger-boss/Form/RejectForm/RejectContent.jsx
@@ -1,7 +1,7 @@
 import UploadSystem from "@/core/components/UploadSystem"
 import useNotification from "@/lib/app/hooks/useNotification";
 import useRequest from "@/lib/app/hooks/useRequest";
-import {Button, DialogActions, DialogContent, Stack, TextField, Typography} from "@mui/material"
+import {Button, DialogActions, DialogContent, FormHelperText, Grid, Stack, TextField, Typography} from "@mui/material"
 import {useFormik} from "formik";
 import {useTranslations} from "next-intl";
 import {useState} from "react";
@@ -9,28 +9,62 @@ import * as Yup from "yup";
 import {REJECT_PASSENGER_BOSS} from "@/core/data/apiRoutes";

 const RejectContent = ({rowId, mutate, setOpenRejectDialog}) => {
-    const [selectedImage, setSelectedImage] = useState("");
-    const [fileType, setfileType] = useState(null);
-    const [fileName, setfileName] = useState(null);
-    const [showAddIcon, setShowAddIcon] = useState(true);
+    const [selectedImageAForm, setSelectedImageAForm] = useState("");
+    const [selectedImageBForm, setSelectedImageBForm] = useState("");
+    const [fileTypesA, setFileTypesA] = useState(null);
+    const [fileNamesA, setFileNamesA] = useState(null);
+    const [fileTypesB, setFileTypesB] = useState(null);
+    const [fileNamesB, setFileNamesB] = useState(null);
+    const [showAddIconA, setShowAddIconA] = useState(true);
+    const [showAddIconB, setShowAddIconB] = useState(true);
    const t = useTranslations();
    const requestServer = useRequest({auth: true})
    const {update_notification} = useNotification()

    const validationSchema = Yup.object().shape({
        description: Yup.string().required(t("RejectDialog.description_error")),
+
+        first_reject_img: Yup.mixed()
+            .required(t("PassengerBoss.upload_file_first_required"))
+            .test('fileSize', `${t("PassengerBoss.upload_file_unit")}`, (value) => {
+                return value.size <= 2 * 1024 * 1024;
+            })
+            .test('fileType', `${t("PassengerBoss.upload_file_format")}`, (value) => {
+                const allowedTypes = ['image/jpg', 'image/jpeg', 'image/png', 'application/pdf']; // Define your allowed file types
+                return allowedTypes.includes(value.type);
+            }),
+
+        second_reject_img: Yup.mixed()
+            .required(t("PassengerBoss.upload_file_second_required"))
+            .test('fileSize', `${t("PassengerBoss.upload_file_unit")}`, (value) => {
+                return value.size <= 2 * 1024 * 1024;
+            })
+            .test('fileType', `${t("PassengerBoss.upload_file_format")}`, (value) => {
+                const allowedTypes = ['image/jpg', 'image/jpeg', 'image/png', 'application/pdf']; // Define your allowed file types
+                return allowedTypes.includes(value.type);
+            })
    });

    const formik = useFormik({
        initialValues: {
            description: "",
-            reject_img: null
+            first_reject_img: null,
+            second_reject_img:null
        },
        validationSchema,
        onSubmit: (values, {setSubmitting}) => {
            const formData = new FormData();
            formData.append("expert_description", values.description);
-            if (values.reject_img != null) formData.append("attachment", values.reject_img);
+
+            const attachments = [
+                { title: 'فرم الف', file: values.first_reject_img },
+                { title: 'فرم ب', file: values.second_reject_img }
+            ];
+
+            attachments.forEach((attachment, index) => {
+                formData.append(`attachment[${index}][title]`, attachment.title);
+                formData.append(`attachment[${index}][file]`, attachment.file);
+            });

            requestServer(`${REJECT_PASSENGER_BOSS}/${rowId}`, 'post', {
                data: formData,
@@ -49,22 +83,32 @@ const RejectContent = ({rowId, mutate, setOpenRejectDialog}) => {
        formik.setFieldValue("description", event.target.value);
        formik.handleChange(event);
    };
-    const handleUploadChange = (event) => {
+    const handleUploadChangeAForm = (event) => {
        const uploadedFile = event.target?.files?.[0];
        if (uploadedFile) {
-            const maxFileSize = 2 * 1024 * 1024;
-            if (uploadedFile.size > maxFileSize) {
-                UploadFileNotification(t);
-                event.target.value = "";
-                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("reject_img", uploadedFile);
-            setShowAddIcon(false);
+            setSelectedImageAForm(URL.createObjectURL(uploadedFile));
+            setFileTypesA(fileType);
+            setFileNamesA(fileName);
+            formik.setFieldValue("first_reject_img", uploadedFile).then(() => {
+                formik.setFieldTouched("first_reject_img", true);
+            })
+            setShowAddIconA(false);
+        }
+    };
+    const handleUploadChangeBForm = (event) => {
+        const uploadedFile = event.target?.files?.[0];
+        if (uploadedFile) {
+            const fileType = event.target?.files?.[0].type;
+            const fileName = event.target?.files?.[0].name;
+            setSelectedImageBForm(URL.createObjectURL(uploadedFile));
+            setFileTypesB(fileType);
+            setFileNamesB(fileName);
+            formik.setFieldValue("second_reject_img", uploadedFile).then(() => {
+                formik.setFieldTouched("second_reject_img", true);
+            })
+            setShowAddIconB(false);
        }
    };
    return (
@@ -90,20 +134,60 @@ const RejectContent = ({rowId, mutate, setOpenRejectDialog}) => {
                        />
                    </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}
-                        />
+                        <Grid container spacing={2}>
+                            <Grid item xs={12} sm={6}>
+                                <Typography>{t("PassengerBoss.first_form")}</Typography>
+                                <UploadSystem
+                                    selectedImage={selectedImageAForm}
+                                    handleUploadChange={handleUploadChangeAForm} // Pass the updated function directly
+                                    setselectedImage={setSelectedImageAForm}
+                                    setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
+                                    fieldname="first_reject_img"
+                                    fileType={fileTypesA}
+                                    fileName={fileNamesA}
+                                    imageAlt={t("app_name")}
+                                    imageSize={[250, 150]}
+                                    setShowAddIcon={setShowAddIconA}
+                                    showAddIcon={showAddIconA}
+                                    onBlur={() => formik.handleBlur("first_reject_img")}
+                                    error={
+                                        formik.touched.first_reject_img &&
+                                        Boolean(formik.errors.first_reject_img)
+                                    }
+                                />
+                                <FormHelperText
+                                    error={Boolean(formik.errors.first_reject_img)}
+                                >
+                                    {formik.touched.first_reject_img && formik.errors.first_reject_img}
+                                </FormHelperText>
+                            </Grid>
+                            <Grid item xs={12} sm={6}>
+                                <Typography>{t("PassengerBoss.second_form")}</Typography>
+                                <UploadSystem
+                                    selectedImage={selectedImageBForm}
+                                    handleUploadChange={handleUploadChangeBForm} // Pass the updated function directly
+                                    setselectedImage={setSelectedImageBForm}
+                                    setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
+                                    fieldname="second_reject_img"
+                                    fileType={fileTypesB} // Use fileTypes array at index 0 for the first instance
+                                    fileName={fileNamesB}
+                                    imageAlt={t("app_name")}
+                                    imageSize={[250, 150]}
+                                    setShowAddIcon={setShowAddIconB}
+                                    showAddIcon={showAddIconB}
+                                    onBlur={() => formik.handleBlur("second_reject_img")}
+                                    error={
+                                        formik.touched.second_reject_img &&
+                                        Boolean(formik.errors.second_reject_img)
+                                    }
+                                />
+                                <FormHelperText
+                                    error={Boolean(formik.errors.second_reject_img)}
+                                >
+                                    {formik.touched.second_reject_img && formik.errors.second_reject_img}
+                                </FormHelperText>
+                            </Grid>
+                        </Grid>
                    </Stack>
                </Stack>
            </DialogContent>