loan/user-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update packages and bring some of fields to show loan page

Browse Source
This commit is contained in:
Mohammad Jalali
2023-12-19 10:25:10 +03:30
parent 80f9ebb03f
commit 79152b690b
12 changed files with 507 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/dashboard/navgan/add-request-loan/index.jsx
View File

@@ -1,29 +1,25 @@
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/navgan/add-request-loan/forms/AddForm";
import {CenterLayout, useUser} from "@witel/webapp-builder";
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>
<CenterLayout>
<Box sx={{width: "80%", my: 2}}>
<Divider>
<Chip
label={`${t("LoanRequest.loan_request_page")} | ${
user.type_name
}`}
/>
</Divider>
</Box>
<AddFormComponent/>
</CenterLayout>
);
};

233
src/components/dashboard/navgan/show/form/index.jsx
View File

@@ -5,9 +5,16 @@ import {useTranslations} from "next-intl";
import EditIcon from '@mui/icons-material/Edit';
import * as Yup from "yup";
import SelectBox from "@/core/components/SelectBox";
import useProvince from "@/lib/app/hooks/useProvince";
import useCities from "@/lib/app/hooks/useCities";
import {useEffect} from "react";
import PlateNumber from "@/core/components/PlateNumber";
import MuiDatePicker from "@/core/components/MuiDatePicker";
const ShowLoanForm = () => {
const t = useTranslations();
const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
const {cityList, cityTextField, setProvinceID, isLoadingCityList} = useCities();
// initial values
const initialValues = {
@@ -16,18 +23,38 @@ const ShowLoanForm = () => {
national_card_serial_num: "0312288875",
address: "تهران - ثنایی - مطهری ساختمان مهتاب",
birth_date: "10/25/44",
navgan_id: "14575"
navgan_id: "14575",
province_id: "9",
city_id: "33",
owner_full_name: "حسن قلی ابدوالابادی",
navgan_type: "2",
vehicle_type: "1",
fixed_number: "02637317735",
plate_part1: "22",
plate_part2: "ب",
plate_part3: "333",
plate_part4: "12",
};
// end initial values
useEffect(() => {
setProvinceID(initialValues.province_id);
}, [initialValues.province_id]);
// validation
const validationSchema = Yup.object().shape({
national_code: Yup.string().required(t("showLoan.error_message_national_code")),
postal_code: Yup.string().required(t("showLoan.error_message_postal_code")),
national_card_serial_num: Yup.string().required(t("showLoan.error_message_national_card_serial_num")),
address: Yup.string().required(t("showLoan.error_message_address")),
birth_date: Yup.string().required(t("showLoan.error_message_birth_date")),
navgan_id: Yup.string().required(t("showLoan.error_message_navgan_id")),
national_code: Yup.string().required(t("ShowLoan.error_message_national_code")),
postal_code: Yup.string().required(t("ShowLoan.error_message_postal_code")),
national_card_serial_num: Yup.string().required(t("ShowLoan.error_message_national_card_serial_num")),
address: Yup.string().required(t("ShowLoan.error_message_address")),
birth_date: Yup.string().required(t("ShowLoan.error_message_birth_date")),
navgan_id: Yup.string().required(t("ShowLoan.error_message_navgan_id")),
province_id: Yup.string().required(t("ShowLoan.error_message_province_id")),
city_id: Yup.string().required(t("ShowLoan.error_message_city_id")),
owner_full_name: Yup.string().required(t("ShowLoan.error_message_owner_full_name")),
navgan_type: Yup.string().required(t("ShowLoan.error_message_navgan_type")),
vehicle_type: Yup.string().required(t("ShowLoan.error_message_vehicle_type")),
fixed_number: Yup.string().required(t("ShowLoan.error_message_fixed_number")),
});
// end validation
@@ -40,6 +67,12 @@ const ShowLoanForm = () => {
formData.append("address", values.address);
formData.append("birth_date", values.birth_date);
formData.append("navgan_id", values.navgan_id);
formData.append("province_id", values.province_id);
formData.append("city_id", values.city_id);
formData.append("owner_full_name", values.owner_full_name);
formData.append("navgan_type", values.navgan_type);
formData.append("vehicle_type", values.vehicle_type);
formData.append("fixed_number", values.fixed_number);
};
// end submit
@@ -82,8 +115,8 @@ const ShowLoanForm = () => {
disabled
variant="standard"
size="small"
label={t("showLoan.text_field_national_code")}
placeholder={t("showLoan.text_field_enter_your_national_code")}
label={t("ShowLoan.text_field_national_code")}
placeholder={t("ShowLoan.text_field_enter_your_national_code")}
type={"text"}
error={!!(props.touched.national_code && props.errors.national_code)}
fullWidth
@@ -104,9 +137,9 @@ const ShowLoanForm = () => {
disabled
variant="standard"
size="small"
label={t("showLoan.text_field_birth_date")}
label={t("ShowLoan.text_field_birth_date")}
placeholder={t(
"showLoan.text_field_enter_your_birth_date"
"ShowLoan.text_field_enter_your_birth_date"
)}
type={"text"}
error={!!(props.touched.birth_date && props.errors.birth_date)}
@@ -117,6 +150,12 @@ const ShowLoanForm = () => {
: null
}
/>
<MuiDatePicker
formik={props}
error={props.touched.birthday && Boolean(props.errors.birthday)}
helperText={props.touched.birthday && props.errors.birthday}
onBlur={props.handleBlur("birthday")}
/>
</Box>
<Box
sx={{
@@ -132,9 +171,9 @@ const ShowLoanForm = () => {
disabled
variant="standard"
size="small"
label={t("showLoan.text_field_national_card_serial_num")}
label={t("ShowLoan.text_field_national_card_serial_num")}
placeholder={t(
"showLoan.text_field_enter_your_national_card_serial_num"
"ShowLoan.text_field_enter_your_national_card_serial_num"
)}
type={"text"}
error={!!(props.touched.national_card_serial_num && props.errors.national_card_serial_num)}
@@ -147,6 +186,115 @@ const ShowLoanForm = () => {
/>
</Box>
</Box>
<Box
sx={{
display: "flex",
flexDirection: {xs: "column", sm: "row"},
alignItems: "start",
justifyContent: "center",
width: "100%",
}}
>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<Field
as={TextField}
sx={{width: "100%"}}
name="owner_full_name"
disabled
variant="standard"
size="small"
label={t("ShowLoan.text_field_owner_full_name")}
placeholder={t(
"ShowLoan.text_field_enter_your_owner_full_name"
)}
type={"text"}
error={!!(props.touched.owner_full_name && props.errors.owner_full_name)}
fullWidth
helperText={
props.touched.owner_full_name
? props.errors.owner_full_name
: null
}
/>
</Box>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<SelectBox
name="vehicle_type"
label={t("ShowLoan.text_field_vehicle_type")}
size="small"
disabled
variant="standard"
selectType="vehicle_type"
selectors={[{id: 0, value: 0, name: "اتوبوس"},
{id: 1, value: 1, name: "مینی بوس"}]}
select={props.values.vehicle_type}
handleChange={(event) => props.setFieldValue('vehicle_type', event.target.value)}
error={props.touched.vehicle_type && Boolean(props.errors.vehicle_type)}
helperText={props.touched.vehicle_type && props.errors.vehicle_type}
onBlur={props.handleBlur("vehicle_type")}
/>
</Box>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<SelectBox
name="navgan_type"
label={t("ShowLoan.text_field_navgan_type")}
size="small"
disabled
variant="standard"
selectType="navgan_type"
selectors={[{id: 1, value: 1, name: "مسافری"}, {id: 2, value: 2, name: "عمومی"}, {
id: 3,
value: 3,
name: "روستایی"
}]}
select={props.values.navgan_type}
handleChange={(event) => {
props.setFieldValue('navgan_type', event.target.value)
}}
setFieldTouched={props.setFieldTouched}
error={props.touched.navgan_type && Boolean(props.errors.navgan_type)}
helperText={props.touched.navgan_type && props.errors.navgan_type}
onBlur={props.handleBlur("navgan_type")}
/>
</Box>
</Box>
<Box
sx={{
display: "flex",
flexDirection: {xs: "column", sm: "row"},
alignItems: "start",
justifyContent: "center",
width: "100%",
}}
>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<PlateNumber formik={props} disabled={true}/>
</Box>
</Box>
<Box
sx={{
display: "flex",
@@ -169,8 +317,8 @@ const ShowLoanForm = () => {
name="address"
variant="outlined"
size="small"
label={t("showLoan.text_field_address")}
placeholder={t("showLoan.text_field_enter_your_address")}
label={t("ShowLoan.text_field_address")}
placeholder={t("ShowLoan.text_field_enter_your_address")}
type={"text"}
error={!!(props.touched.address && props.errors.address)}
fullWidth
@@ -190,9 +338,9 @@ const ShowLoanForm = () => {
name="postal_code"
variant="outlined"
size="small"
label={t("showLoan.text_field_postal_code")}
label={t("ShowLoan.text_field_postal_code")}
placeholder={t(
"showLoan.text_field_enter_your_postal_code"
"ShowLoan.text_field_enter_your_postal_code"
)}
type={"text"}
error={!!(props.touched.postal_code && props.errors.postal_code)}
@@ -217,9 +365,9 @@ const ShowLoanForm = () => {
name="navgan_id"
variant="outlined"
size="small"
label={t("showLoan.text_field_navgan_id")}
label={t("ShowLoan.text_field_navgan_id")}
placeholder={t(
"showLoan.text_field_enter_your_navgan_id"
"ShowLoan.text_field_enter_your_navgan_id"
)}
type={"text"}
error={!!(props.touched.navgan_id && props.errors.navgan_id)}
@@ -248,22 +396,47 @@ const ShowLoanForm = () => {
width: "100%",
}}
>
<Field
<SelectBox
name="province_id"
label={t("LoanRequest.text_field_province_id")} // t("LoanRequest.text_field_enter_your_province")
label={t("ShowLoan.text_field_province_id")}
size="small"
selectType="province_id"
component={SelectBox}
isLoading={isLoadingProvinceList}
errorEcured={errorProvinceList}
selectors={provinceList}
select={props.values.province_id}
setFieldValue={props.setFieldValue}
handleChange={(event) => {
props.setFieldValue('province_id', event.target.value);
setProvinceID(event.target.value)
props.setFieldTouched("city_id", false, false);
props.setFieldValue("city_id", "")
}}
setFieldTouched={props.setFieldTouched}
error={
!!(props.touched.province_id && props.errors.province_id)
}
helperText={
props.touched.province_id ? props.errors.province_id : null
}
error={props.touched.province_id && Boolean(props.errors.province_id)}
helperText={props.touched.province_id && props.errors.province_id}
onBlur={props.handleBlur("province_id")}
/>
</Box>
<Box
sx={{
mx: {xs: 0, sm: 2},
my: 2,
width: "100%",
}}
>
<SelectBox
name="city_id"
label={cityList.length === 0 ? `${t("ShowLoan.cityList_empty")}` : cityTextField}
size="small"
selectType="city_id"
disabled={cityList.length === 0}
selectors={cityList}
select={props.values.city_id}
handleChange={(event) => props.setFieldValue('city_id', event.target.value)}
setFieldTouched={props.setFieldTouched}
error={props.touched.city_id && Boolean(props.errors.city_id)}
helperText={props.touched.city_id && props.errors.city_id}
onBlur={props.handleBlur("city_id")}
/>
</Box>
</Box>
@@ -287,7 +460,7 @@ const ShowLoanForm = () => {
endIcon={<EditIcon/>}
disabled={props.isSubmitting}
>
{t("showLoan.button_submit")}
{t("ShowLoan.button_submit")}
</Button>
</Box>
</StyledForm>

4
src/components/dashboard/navgan/show/index.jsx
View File

@@ -12,9 +12,7 @@ const ShowLoan = () => {
<Box sx={{width: "80%", my: 2}}>
<Divider>
<Chip
label={`${t("showLoan.show_loan_page")} | ${
user.type_name
}`}
label={t("ShowLoan.show_loan_page")}
/>
</Divider>
</Box>