LFFE-33 Merge branch 'feature/LFFE-33_navgan_province_manager' into 'develop'
This commit is contained in:
@@ -33,7 +33,7 @@ const Confirm = ({rowId, mutate, vehicle_type}) => {
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Dialog fullWidth open={openConfirmDialog}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}} maxWidth={dialogSize}>
|
||||
PaperProps={{sx: {transition: 'all .3s' , boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}} maxWidth={dialogSize}>
|
||||
<DialogTitle>{t("MachinaryOffice.confirm")}</DialogTitle>
|
||||
<ConfirmContent mutate={mutate} rowId={rowId} setOpenConfirmDialog={setOpenConfirmDialog} handleSizeChangeClick={handleSizeChangeClick}
|
||||
vehicle_type={vehicle_type}/>
|
||||
|
||||
@@ -1,21 +1,43 @@
|
||||
import UploadSystem from "@/core/components/UploadSystem";
|
||||
import useNotification from "@/lib/app/hooks/useNotification";
|
||||
import useRequest from "@/lib/app/hooks/useRequest";
|
||||
import {Button, DialogActions, DialogContent, FormHelperText, Stack, TextField, Typography} from "@mui/material"
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
FormHelperText,
|
||||
Grid,
|
||||
LinearProgress,
|
||||
Stack,
|
||||
TextField,
|
||||
Typography
|
||||
} from "@mui/material"
|
||||
import {useFormik} from "formik";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {CONFIRM_NAVGAN_PROVINCE_MANAGER} from "@/core/data/apiRoutes";
|
||||
import {useState} from "react";
|
||||
import {
|
||||
CONFIRM_NAVGAN_PROVINCE_MANAGER,
|
||||
CONFIRM_PROVINCE_MANAGER_DETAILS
|
||||
} from "@/core/data/apiRoutes";
|
||||
import {useEffect, useState} from "react";
|
||||
import * as Yup from "yup";
|
||||
import CustomAccordion from "@/core/components/CustomAccordion";
|
||||
import ImageContent from "@/core/components/ImageContent";
|
||||
|
||||
const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog}) => {
|
||||
const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, handleSizeChangeClick}) => {
|
||||
const t = useTranslations();
|
||||
const [selectedImage, setSelectedImage] = useState("");
|
||||
const [fileType, setfileType] = useState(null);
|
||||
const [fileName, setfileName] = useState(null);
|
||||
const [showAddIcon, setShowAddIcon] = useState(true);
|
||||
const requestServer = useRequest({auth: true})
|
||||
const requestServer = useRequest({auth: true , notification: false})
|
||||
const {update_notification} = useNotification()
|
||||
const [accordionStates, setAccordionStates] = useState([]);
|
||||
const [hasImageShown, setHasImageShown] = useState(false);
|
||||
const [imageLink, setImageLink] = useState(null);
|
||||
const [detailsList, setDetailsData] = useState(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [isSkeleton, setIsSkeleton] = useState(false);
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
confirm_img: Yup.mixed().notRequired(t("ConfirmDialog.approved_amount_error"))
|
||||
@@ -30,6 +52,37 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog}) => {
|
||||
})
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
requestServer(`${CONFIRM_PROVINCE_MANAGER_DETAILS}/${rowId}`, 'get')
|
||||
.then((response) => {
|
||||
const booleanData = Array.from({ length: response.data.data.attachment_files.length }, () => false);
|
||||
setAccordionStates(booleanData);
|
||||
setDetailsData(response.data)
|
||||
})
|
||||
.catch(() => {
|
||||
}).finally(() => {
|
||||
setLoading(false);
|
||||
});
|
||||
}, []);
|
||||
|
||||
const handleAccordionChange = (index) => {
|
||||
const newAccordionStates = accordionStates.map((state, i) => i === index ? !state : false);
|
||||
setAccordionStates(newAccordionStates);
|
||||
|
||||
if (!newAccordionStates[index])
|
||||
{
|
||||
handleSizeChangeClick('sm');
|
||||
setHasImageShown(false);
|
||||
setIsSkeleton(false)
|
||||
}
|
||||
else {
|
||||
handleSizeChangeClick('xl');
|
||||
setHasImageShown(true);
|
||||
setImageLink(detailsList.data.attachment_files[index])
|
||||
setIsSkeleton(true)
|
||||
}
|
||||
};
|
||||
|
||||
const formik = useFormik({
|
||||
initialValues: {
|
||||
description: "",
|
||||
@@ -71,51 +124,109 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog}) => {
|
||||
setShowAddIcon(false);
|
||||
}
|
||||
};
|
||||
|
||||
const renderCustomAccordions = () => {
|
||||
if (detailsList && detailsList.data && detailsList.data.attachment_files) {
|
||||
return detailsList.data.attachment_files.map((file, index) => (
|
||||
<CustomAccordion
|
||||
key={index}
|
||||
title={`${file.title}`}
|
||||
hasOpened={accordionStates[index]}
|
||||
hasAccordionOpened={null}
|
||||
handleAccordionChange={() => handleAccordionChange(index)}
|
||||
accordionIndex={index}
|
||||
downloadFile={file.attachment}
|
||||
/>
|
||||
));
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
const numberShowBox = () => {
|
||||
return (
|
||||
<>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("sidebar.machinery-expert")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.proposed_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.proposed_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("secondary.passenger-boss")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.approved_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.approved_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<DialogContent>
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
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>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={hasImageShown ? 6 : 12}>
|
||||
{loading ? <LinearProgress /> :
|
||||
<>
|
||||
{numberShowBox()}
|
||||
{renderCustomAccordions()}
|
||||
</>
|
||||
}
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
name="description"
|
||||
multiline
|
||||
rows={8}
|
||||
label={<>
|
||||
<span>{t("ConfirmDialog.description")}</span><small>{t("ConfirmDialog.optional")}</small></>}
|
||||
value={formik.values.description}
|
||||
onChange={handleDescriptionChange}
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
sx={{mt: 1}}
|
||||
/>
|
||||
</Stack>
|
||||
<Stack>
|
||||
<Typography>{t("UploadSystem.upload_file")}{t("UploadSystem.optional")}</Typography>
|
||||
<UploadSystem
|
||||
selectedImage={selectedImage}
|
||||
handleUploadChange={handleUploadChange} // Pass the updated function directly
|
||||
setselectedImage={setSelectedImage}
|
||||
setFieldValue={formik.setFieldValue} // Remove props.setFieldValue, use formik.setFieldValue
|
||||
fieldname="confirm_img"
|
||||
fileType={fileType}
|
||||
fileName={fileName}
|
||||
imageAlt={t("app_name")}
|
||||
imageSize={[250, 150]}
|
||||
setShowAddIcon={setShowAddIcon}
|
||||
showAddIcon={showAddIcon}
|
||||
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>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Stack sx={{ display: hasImageShown ? 'flex' : 'none', alignItems: 'center', gap: 0.5 , justifyContent:'center'}}>
|
||||
<ImageContent imageLink={imageLink} isSkeleton={isSkeleton} setIsSkeleton={setIsSkeleton}/>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={() => setOpenConfirmDialog(false)} variant="outlined" color="secondary"
|
||||
|
||||
@@ -1,11 +1,22 @@
|
||||
import {Dialog, DialogTitle, IconButton, Tooltip} from "@mui/material";
|
||||
import {useTranslations} from "next-intl";
|
||||
import {useState} from "react";
|
||||
import {useEffect, useState} from "react";
|
||||
import ConfirmContent from "./ConfirmContent";
|
||||
import CallMadeIcon from '@mui/icons-material/CallMade';
|
||||
const Confirm = ({rowId, mutate}) => {
|
||||
const t = useTranslations();
|
||||
const [openConfirmDialog, setOpenConfirmDialog] = useState(false);
|
||||
const [dialogSize, setDialogSize] = useState('sm');
|
||||
|
||||
useEffect(() => {
|
||||
if (!openConfirmDialog) {
|
||||
setDialogSize('sm');
|
||||
}
|
||||
}, [openConfirmDialog]);
|
||||
|
||||
const handleSizeChangeClick = (size) => {
|
||||
setDialogSize(size);
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<Tooltip title={t("ConfirmDialog.confirm")}>
|
||||
@@ -19,9 +30,9 @@ const Confirm = ({rowId, mutate}) => {
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Dialog fullWidth open={openConfirmDialog}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}}>
|
||||
PaperProps={{sx: {transition: 'all .3s', boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}} maxWidth={dialogSize}>
|
||||
<DialogTitle>{t("NavganProvinceManager.confirm")}</DialogTitle>
|
||||
<ConfirmContent mutate={mutate} rowId={rowId} setOpenConfirmDialog={setOpenConfirmDialog}/>
|
||||
<ConfirmContent mutate={mutate} rowId={rowId} setOpenConfirmDialog={setOpenConfirmDialog} handleSizeChangeClick={handleSizeChangeClick}/>
|
||||
</Dialog>
|
||||
</>
|
||||
)
|
||||
|
||||
@@ -163,22 +163,33 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog, vehicle_type , han
|
||||
}
|
||||
return null;
|
||||
};
|
||||
const numberShowBox = () => {
|
||||
return (
|
||||
<>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("sidebar.machinery-expert")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.proposed_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.proposed_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<DialogContent>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={hasImageShown ? 6 : 12}>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("sidebar.machinery-expert")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.proposed_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.proposed_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
{loading ? <LinearProgress /> : renderCustomAccordions()}
|
||||
{loading ? <LinearProgress /> :
|
||||
<>
|
||||
{numberShowBox()}
|
||||
{renderCustomAccordions()}
|
||||
</>
|
||||
}
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
|
||||
@@ -32,7 +32,7 @@ const Confirm = ({rowId, mutate, vehicle_type}) => {
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Dialog fullWidth open={openConfirmDialog}
|
||||
PaperProps={{sx: {boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}} maxWidth={dialogSize}>
|
||||
PaperProps={{sx: {transition: 'all .3s' , boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'}}} maxWidth={dialogSize}>
|
||||
<DialogTitle>{t("PassengerBoss.confirm")}</DialogTitle>
|
||||
<ConfirmContent mutate={mutate} rowId={rowId} setOpenConfirmDialog={setOpenConfirmDialog} handleSizeChangeClick={handleSizeChangeClick}
|
||||
vehicle_type={vehicle_type}/>
|
||||
|
||||
@@ -141,31 +141,41 @@ const ConfirmContent = ({rowId, mutate, setOpenConfirmDialog ,handleSizeChangeCl
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
const numberShowBox = () => {
|
||||
return (
|
||||
<>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("sidebar.machinery-expert")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.proposed_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.proposed_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("secondary.passenger-boss")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.approved_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.approved_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
</>
|
||||
);
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<DialogContent>
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={hasImageShown ? 6 : 12}>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("sidebar.machinery-expert")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.proposed_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.proposed_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
<Box sx={{ border: '1px solid #ccc' ,p:2 , mb:2 , borderRadius: '8px'}}>
|
||||
<Typography sx={{color: "primary.main" , fontWeight: 500}}>{t("ConfirmDialog.approved_amount")} {t("secondary.passenger-boss")}</Typography>
|
||||
<Typography pt={1}>
|
||||
{isNaN((detailsList?.data?.approved_amount) / 10)
|
||||
? ""
|
||||
: ((detailsList?.data?.approved_amount) / 10).toLocaleString()}{" "}
|
||||
{t("ConfirmDialog.unit")}
|
||||
</Typography>
|
||||
</Box>
|
||||
{loading ? <LinearProgress /> : renderCustomAccordions()}
|
||||
{loading ? <LinearProgress /> :
|
||||
<>
|
||||
{numberShowBox()}
|
||||
{renderCustomAccordions()}
|
||||
</>
|
||||
}
|
||||
<Stack spacing={2}>
|
||||
<Stack>
|
||||
<TextField
|
||||
|
||||
@@ -95,6 +95,9 @@ export const REJECT_NAVGAN_PROVINCE_MANAGER =
|
||||
BASE_URL + "/dashboard/province_manager/reject";
|
||||
export const EXPORT_NAVGAN_PROVINCE_MANAGER =
|
||||
BASE_URL + "/dashboard/province_manager/export";
|
||||
|
||||
export const CONFIRM_PROVINCE_MANAGER_DETAILS =
|
||||
BASE_URL + "/dashboard/province_manager";
|
||||
//navgan province manager
|
||||
|
||||
// refahi province manager
|
||||
|
||||
Reference in New Issue
Block a user