add loan request/change structure and documentary/ making middle ware for user type/update breadcrumb

This commit is contained in:
2023-08-19 13:38:51 +03:30
parent dd239ac46c
commit fd1a6bcf2e
18 changed files with 382 additions and 156 deletions

View File

@@ -13,7 +13,7 @@ import {useTranslations} from "next-intl";
import {useEffect, useState} from "react";
import * as Yup from "yup";
const NavyFormComponent = () => {
const AddFormComponent = () => {
const t = useTranslations();
const {directionApp} = useDirection();
const {token} = useUser();
@@ -486,4 +486,4 @@ const NavyFormComponent = () => {
);
};
export default NavyFormComponent;
export default AddFormComponent;

View File

@@ -1,10 +1,9 @@
import CenterLayout from "@/layouts/CenterLayout";
import DashboardLayouts from "@/layouts/dashboardLayouts";
import useUser from "@/lib/app/hooks/useUser";
import NavyFormComponent from "./NavyForm";
import WelfareServicesFormComponent from "./WelfareServicesForm";
import {Box, Chip, Divider} from "@mui/material";
import {useTranslations} from "next-intl";
import AddFormComponent from "@/components/dashboard/navgan/add-request-loan/forms/AddForm";
const LoanRequestComponent = () => {
const t = useTranslations();
@@ -22,7 +21,7 @@ const LoanRequestComponent = () => {
/>
</Divider>
</Box>
{user.type_id == 1 ? <NavyFormComponent/> : <WelfareServicesFormComponent/>}
<AddFormComponent/>
</CenterLayout>
</DashboardLayouts>
);

View File

@@ -1,7 +1,6 @@
import Notifications from "@/core/components/notifications";
import StyledForm from "@/core/components/StyledForm";
import UploadSystem from "@/core/components/UploadSystem";
import {SEND_LOAN_REQUEST_WELFARE} from "@/core/data/apiRoutes";
import {GET_PROVINCE_LIST, SEND_LOAN_REQUEST_WELFARE} from "@/core/data/apiRoutes";
import useDirection from "@/lib/app/hooks/useDirection";
import useUser from "@/lib/app/hooks/useUser";
import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
@@ -9,13 +8,32 @@ import {Box, Button, Stack, TextField} from "@mui/material";
import axios from "axios";
import {Field, Formik} from "formik";
import {useTranslations} from "next-intl";
import {useState} from "react";
import {useEffect, useState} from "react";
import * as Yup from "yup";
import SelectBox from "@/core/components/SelectBox";
import useRequest from "@/lib/app/hooks/useRequest";
const WelfareServicesFormComponent = () => {
const AddFormComponent = () => {
const t = useTranslations();
const {directionApp} = useDirection();
const {token} = useUser();
const requestServer = useRequest()
// get province list
const [provinceList, setProvinceList] = useState([]);
useEffect(() => {
requestServer(GET_PROVINCE_LIST, "get", {auth: true, notification: false})
.then(function ({data}) {
const formattedData = data.map((province, index) => ({
id: index,
name: province.name,
value: province.id,
}));
setProvinceList(formattedData);
}).catch(() => {
})
}, []);
// end get province list
// upload files
const [selectedImageShenasname, setSelectedImageShenasname] = useState(
@@ -57,8 +75,6 @@ const WelfareServicesFormComponent = () => {
const initialValues = {
name: "",
phone_number: "",
vehicle_type: "",
plate_number: "",
province: "",
national_code: "",
shenasname_id: "",
@@ -71,12 +87,6 @@ const WelfareServicesFormComponent = () => {
phone_number: Yup.string().required(
t("LoanRequest.error_message_phone_number")
),
vehicle_type: Yup.string().required(
t("LoanRequest.error_message_vehicle_type")
),
plate_number: Yup.string().required(
t("LoanRequest.error_message_plate_number")
),
province: Yup.string().required(t("LoanRequest.error_message_province")),
national_code: Yup.string().required(
t("LoanRequest.error_message_national_code")
@@ -87,34 +97,23 @@ const WelfareServicesFormComponent = () => {
});
const handleSubmit = async (values, props) => {
Notifications(t, undefined);
const formData = new FormData();
formData.append("name", values.name);
formData.append("phone_number", values.phone_number);
formData.append("vehicle_type", values.vehicle_type);
formData.append("plate_number", values.plate_number);
formData.append("province_id", values.province);
formData.append("national_code", values.national_code);
formData.append("national_id", values.national_code);
formData.append("shenasname_id", values.shenasname_id);
if (values.shenasname_img != null)
formData.append("shenasname_image", values.shenasname_img);
if (values.national_card_img != null)
formData.append("national_card_image", values.national_card_img);
await axios
.post(SEND_LOAN_REQUEST_WELFARE, formData, {
headers: {
Authorization: `Bearer ${token}`,
"Content-Type": "multipart/form-data",
},
})
requestServer(SEND_LOAN_REQUEST_WELFARE, "post", {auth: true, data: formData})
.then(function (response) {
Notifications(t, response);
})
.catch(function (error) {
Notifications(t, error.response);
props.setSubmitting(false);
});
}).catch(function (error) {
props.setSubmitting(false);
});
};
// end initial values, validation and request action of form
@@ -158,7 +157,7 @@ const WelfareServicesFormComponent = () => {
label={t("LoanRequest.text_field_name")}
placeholder={t("LoanRequest.text_field_enter_your_name")}
type={"text"}
error={props.touched.name && props.errors.name ? true : false}
error={!!(props.touched.name && props.errors.name)}
fullWidth
helperText={props.touched.name ? props.errors.name : null}
/>
@@ -182,9 +181,7 @@ const WelfareServicesFormComponent = () => {
)}
type={"text"}
error={
props.touched.phone_number && props.errors.phone_number
? true
: false
!!(props.touched.phone_number && props.errors.phone_number)
}
fullWidth
helperText={
@@ -194,16 +191,6 @@ const WelfareServicesFormComponent = () => {
}
/>
</Box>
</Box>
<Box
sx={{
display: "flex",
flexDirection: {xs: "column", sm: "row"},
alignItems: "start",
justifyContent: "center",
width: "100%",
}}
>
<Box
sx={{
mx: {xs: 0, sm: 2},
@@ -212,82 +199,18 @@ const WelfareServicesFormComponent = () => {
}}
>
<Field
as={TextField}
sx={{width: "100%"}}
name="vehicle_type"
variant="outlined"
size="small"
label={t("LoanRequest.text_field_vehicle_type")}
placeholder={t(
"LoanRequest.text_field_enter_your_vehicle_type"
)}
type={"text"}
error={
props.touched.vehicle_type && props.errors.vehicle_type
? true
: false
}
fullWidth
helperText={
props.touched.vehicle_type
? props.errors.vehicle_type
: null
}
/>
</Box>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<Field
as={TextField}
sx={{width: "100%"}}
name="plate_number"
variant="outlined"
size="small"
label={t("LoanRequest.text_field_plate_number")}
placeholder={t(
"LoanRequest.text_field_enter_your_plate_number"
)}
type={"text"}
error={
props.touched.plate_number && props.errors.plate_number
? true
: false
}
fullWidth
helperText={
props.touched.plate_number
? props.errors.plate_number
: null
}
/>
</Box>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<Field
as={TextField}
sx={{width: "100%"}}
name="province"
variant="outlined"
label={t("LoanRequest.text_field_province")} // t("LoanRequest.text_field_enter_your_province")
size="small"
label={t("LoanRequest.text_field_province")}
placeholder={t("LoanRequest.text_field_enter_your_province")}
type={"text"}
selectType="province"
component={SelectBox}
selectors={provinceList}
select={props.values.province}
setFieldValue={props.setFieldValue}
setFieldTouched={props.setFieldTouched}
error={
props.touched.province && props.errors.province
? true
: false
!!(props.touched.province && props.errors.province)
}
fullWidth
helperText={
props.touched.province ? props.errors.province : null
}
@@ -322,9 +245,7 @@ const WelfareServicesFormComponent = () => {
)}
type={"text"}
error={
props.touched.national_code && props.errors.national_code
? true
: false
!!(props.touched.national_code && props.errors.national_code)
}
fullWidth
helperText={
@@ -353,9 +274,7 @@ const WelfareServicesFormComponent = () => {
)}
type={"text"}
error={
props.touched.shenasname_id && props.errors.shenasname_id
? true
: false
!!(props.touched.shenasname_id && props.errors.shenasname_id)
}
fullWidth
helperText={
@@ -421,7 +340,7 @@ const WelfareServicesFormComponent = () => {
size="large"
sx={{mt: 2}}
endIcon={<DataSaverOnIcon/>}
disabled={props.isSubmitting ? true : false}
disabled={props.isSubmitting}
>
{t("LoanRequest.button_submit")}
</Button>
@@ -433,4 +352,4 @@ const WelfareServicesFormComponent = () => {
);
};
export default WelfareServicesFormComponent;
export default AddFormComponent;

View File

@@ -0,0 +1,30 @@
import CenterLayout from "@/layouts/CenterLayout";
import DashboardLayouts from "@/layouts/dashboardLayouts";
import useUser from "@/lib/app/hooks/useUser";
import {Box, Chip, Divider} from "@mui/material";
import {useTranslations} from "next-intl";
import AddFormComponent from "@/components/dashboard/refahi/add-request-loan/forms/AddForm";
const LoanRequestComponent = () => {
const t = useTranslations();
const {user} = useUser();
return (
<DashboardLayouts>
<CenterLayout>
<Box sx={{width: "80%", my: 2}}>
<Divider>
<Chip
label={`${t("LoanRequest.loan_request_page")} | ${
user.type_name
}`}
/>
</Divider>
</Box>
<AddFormComponent/>
</CenterLayout>
</DashboardLayouts>
);
};
export default LoanRequestComponent;

View File

@@ -0,0 +1,123 @@
import DashboardLayouts from "@/layouts/dashboardLayouts";
import useUser from "@/lib/app/hooks/useUser";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import {
Avatar,
Card,
CardActions,
CardContent,
CardHeader,
Collapse,
Grid,
IconButton,
Stack,
Typography
} from "@mui/material";
import {styled} from "@mui/material/styles";
import {useTranslations} from "next-intl";
import {useState} from "react";
const ExpandMore = styled((props) => {
const {expand, ...other} = props;
return <IconButton {...other} />;
})(({theme, expand}) => ({
transform: !expand ? "rotate(0deg)" : "rotate(180deg)",
marginLeft: "auto",
transition: theme.transitions.create("transform", {
duration: theme.transitions.duration.shortest,
}),
}));
const data = [
{
name: "جان دو",
date: "۱۳۹۹/۰۴/۲۵",
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.",
},
{
name: "جین اسمیت",
date: "۱۳۹۹/۰۴/۲۶",
description: "نُلا ویته الیت لیبرو آ، آ فارِترا آوگوه.",
},
{
name: "مایک جانسون",
date: "۱۳۹۹/۰۴/۲۷",
description:
"دوئیس مولیس، است نُن کُمُدو لُکتوس، نیسی ارات پورتیتور لیگولا.",
},
];
const LoanFollowUpComponent = () => {
const t = useTranslations();
const {token} = useUser();
const [expanded, setExpanded] = useState([]);
const handleExpandClick = (index) => {
setExpanded((prevExpanded) => {
const newExpanded = [...prevExpanded];
newExpanded[index] = !newExpanded[index];
return newExpanded;
});
};
return (
<DashboardLayouts>
<Stack
spacing={2}
sx={{
p: 4,
width: "100%",
}}
>
<Grid
container
columnSpacing={2}
rowSpacing={2}
sx={{alignItems: "start", justifyContent: "center"}}
>
{data.map((item, index) => (
<Grid item xs={12} md={6} lg={4} key={index}>
<Card sx={{width: "100%"}}>
<CardHeader
avatar={
<Avatar
sx={{bgcolor: "primary.main"}}
aria-label="recipe"
></Avatar>
}
title={item.name}
subheader={item.date}
/>
<CardContent>
<Typography variant="body2" color="text.secondary">
متن تست
</Typography>
</CardContent>
<CardActions disableSpacing>
<ExpandMore
expand={expanded[index]}
onClick={() => handleExpandClick(index)}
aria-expanded={expanded[index]}
aria-label="show more"
>
<ExpandMoreIcon/>
</ExpandMore>
</CardActions>
<Collapse in={expanded[index]} timeout="auto" unmountOnExit>
<CardContent>
<Typography paragraph>اطلاعات تکمیلی:</Typography>
<Typography paragraph>{item.description}</Typography>
</CardContent>
</Collapse>
</Card>
</Grid>
))}
</Grid>
</Stack>
</DashboardLayouts>
);
};
export default LoanFollowUpComponent;