From 4b31247ca1f14326a7e01f100c320061a5c10cdf Mon Sep 17 00:00:00 2001 From: AminGhasempoor Date: Mon, 18 Dec 2023 14:11:07 +0330 Subject: [PATCH] add postal code address and some validation --- package.json | 2 + public/locales/fa/app.json | 12 +- .../navgan/add-request-loan/forms/AddForm.jsx | 122 +++++++------ .../navgan/add-request-loan/index.jsx | 6 +- src/core/MuiDatePicker.jsx | 0 src/core/components/MuiDatePicker.jsx | 85 +++++++++ src/core/components/PlateNumber.jsx | 166 ++++++++---------- src/core/components/SelectBox.jsx | 12 +- src/lib/app/hooks/useCities.jsx | 17 +- 9 files changed, 247 insertions(+), 175 deletions(-) delete mode 100644 src/core/MuiDatePicker.jsx create mode 100644 src/core/components/MuiDatePicker.jsx diff --git a/package.json b/package.json index 05c6f46..9dc8e07 100644 --- a/package.json +++ b/package.json @@ -16,9 +16,11 @@ "@mui/icons-material": "^5.11.16", "@mui/lab": "^5.0.0-alpha.152", "@mui/material": "^5.12.0", + "@mui/x-date-pickers": "^6.18.5", "@witel/webapp-builder": "^1.1.0", "axios": "^1.4.0", "colord": "^2.9.3", + "date-fns-jalali": "^2.13.0-0", "eslint": "8.36.0", "formik": "^2.2.9", "fs-extra": "^11.1.1", diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json index 06dc231..2c0b598 100644 --- a/public/locales/fa/app.json +++ b/public/locales/fa/app.json @@ -1,7 +1,14 @@ { "app_name": "سامانه جامع تسهیلات", "app_short_name": "سامانه تسهیلات", + "birthday": "تاریخ تولد", + "birthday_error": "تاریخ تولد خود را وارد کنید!", "dashboard": "داشبورد", + "text_field_city_id": "شهر", + "text_field_error_fetching_cities": "لطفا شهر خود را وارد کنید!", + "text_field_loading_cities_list": "درحال دریافت اطلاعات شهر ها...", + "text_field_loading": "درحال دریافت اطلاعات", + "text_field_error_fetching": "خطا در دریافت اطلاعات", "first_page": "خوش آمدید", "powered_by_witel": "توسعه یافته توسط وایتل", "login": "ورود", @@ -127,7 +134,7 @@ "no_request_found": "درخواستی یافت نشد" }, "LoanRequest": { - "city_id": "شهر", + "cityList_empty": "ابتدا استان را وارد کنید", "loan_request_page": "ثبت درخواست وام", "personal_info": "اطلاعات شخصی", "national_code_number": "کد ملی می بایست شامل اعداد باشد", @@ -163,8 +170,6 @@ "text_field_enter_your_plate_part3": "بخش سوم پلاک را وارد کنید", "text_field_enter_your_plate_part4": "بخش چهارم پلاک راوارد کنید", "text_field_enter_your_address": "آدرس خود راوارد کنید", - "text_field_loading_cities_list": "درحال دریافت اطلاعات شهر ها...", - "text_field_city_id": "شهر", "text_field_enter_your_name": "نام خود را وارد کنید", "text_field_enter_your_postal_code": "کد پستی خود را وارد کنید", "text_field_vehicle_type": "نوع وسیله نقلیه", @@ -183,7 +188,6 @@ "text_field_enter_your_shenasname_serial": "سریال پشت کارت ملی خود را وارد کنید", "text_field_plate_number": "شماره پلاک", "text_field_enter_your_plate_number": "شماره پلاک خود را وارد کنید", - "text_field_error_fetching_cities": "شهر خود را وارد کنید!", "button_submit": "ثبت درخواست", "error_message_city_id": "لطفا شهر خود را وارد کنید!", "add_loan_request_permission": "اکنون امکان ثبت درخواست جدید برای شما مقدور نیست" diff --git a/src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx b/src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx index 40eed76..8097ee3 100644 --- a/src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx +++ b/src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx @@ -9,7 +9,7 @@ import {useRequest, useUser} from "@witel/webapp-builder"; import useProvince from "@/lib/app/hooks/useProvince"; import useCities from "@/lib/app/hooks/useCities"; import PlateNumber from "@/core/components/PlateNumber"; -import MuiDatePicker from "@/core/MuiDatePicker"; +import MuiDatePicker from "@/core/components/MuiDatePicker"; const AddFormComponent = () => { const t = useTranslations(); @@ -34,6 +34,7 @@ const AddFormComponent = () => { plate_part3 : "", plate_part4 : "", address : "", + date_of_birth : "", }; const validationSchema = Yup.object().shape({ @@ -49,6 +50,9 @@ const AddFormComponent = () => { address: Yup.string().required( t("LoanRequest.error_message_address") ), + date_of_birth: Yup.string().required( + t("LoanRequest.error_message_date_of_birth") + ), postal_code: Yup.mixed() .test("max", `${t("LoanRequest.postal_code_max")}`, (value) => value.toString().length === 10) .required( @@ -101,6 +105,7 @@ const AddFormComponent = () => { formData.append("address", values.address); formData.append("navgan_id", values.navgan_id); formData.append("national_code", values.national_code); + formData.append("date_of_birth", values.date_of_birth); formData.append("shenasname_serial", values.shenasname_serial); requestServer(SEND_LOAN_REQUEST_NAVGAN, "post", {auth : true, notification : true}).then().catch(() => { @@ -115,7 +120,7 @@ const AddFormComponent = () => { <> - { fullWidth /> - + + + + + + + + { helperText={formik.touched.postal_code && formik.errors.postal_code} /> - - - - - - - - - - { helperText={formik.touched.tel_number && formik.errors.tel_number} /> + + { onBlur={formik.handleBlur("navgan_type")} /> + + + @@ -244,7 +258,7 @@ const AddFormComponent = () => { { - formik.setFieldValue('vehicle_type', event.target.value)} + error={formik.touched.vehicle_type && Boolean(formik.errors.vehicle_type)} + helperText={formik.touched.vehicle_type && formik.errors.vehicle_type} + onBlur={formik.handleBlur("vehicle_type")} /> - {/**/} - - - - - + diff --git a/src/components/dashboard/navgan/add-request-loan/index.jsx b/src/components/dashboard/navgan/add-request-loan/index.jsx index d8668ed..395ede7 100644 --- a/src/components/dashboard/navgan/add-request-loan/index.jsx +++ b/src/components/dashboard/navgan/add-request-loan/index.jsx @@ -1,20 +1,16 @@ 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 ( <> diff --git a/src/core/MuiDatePicker.jsx b/src/core/MuiDatePicker.jsx deleted file mode 100644 index e69de29..0000000 diff --git a/src/core/components/MuiDatePicker.jsx b/src/core/components/MuiDatePicker.jsx new file mode 100644 index 0000000..5da1afc --- /dev/null +++ b/src/core/components/MuiDatePicker.jsx @@ -0,0 +1,85 @@ +import * as React from 'react'; +import {useState} from 'react'; +import Button from '@mui/material/Button'; +import {AdapterDateFnsJalali} from "@mui/x-date-pickers/AdapterDateFnsJalali"; +import {LocalizationProvider} from '@mui/x-date-pickers/LocalizationProvider'; +import {DatePicker} from '@mui/x-date-pickers/DatePicker'; +import {useTranslations} from "next-intl"; +import moment from "jalali-moment"; +import {FormControl, FormHelperText} from "@mui/material"; + +function ButtonField(props) { + const t = useTranslations(); + const { + setOpen, + label, + id, + disabled, + InputProps: {ref} = {}, + inputProps: {'aria-label': ariaLabel} = {}, + } = props; + + return ( + + ); +} + +function ButtonDatePicker(props) { + const t = useTranslations(); + const [open, setOpen] = useState(false); + + return ( + setOpen(false)} + onOpen={() => setOpen(true)} + /> + ); +} + +export default function PickerWithButtonField({formik, error, helperText}) { + const [value, setValue] = useState(null); + + return ( + + + { + setValue(newValue) + }} + + /> + {helperText} + + + ); +} \ No newline at end of file diff --git a/src/core/components/PlateNumber.jsx b/src/core/components/PlateNumber.jsx index 57be9fd..292b764 100644 --- a/src/core/components/PlateNumber.jsx +++ b/src/core/components/PlateNumber.jsx @@ -1,4 +1,4 @@ -import {Box, Button, Drawer, FormHelperText, TextField, Typography} from "@mui/material"; +import {Box, Button, Drawer, FormHelperText, InputBase, Stack} from "@mui/material"; import {useTranslations} from "next-intl"; import AccessibleIcon from '@mui/icons-material/Accessible'; import {useState} from "react"; @@ -128,102 +128,80 @@ const PlateNumber = ({formik}) => { return ( <> - - - - ایران - - + event.target.value.length <= 2 ? formik.setFieldValue("plate_part4", event.target.value) : null} + size={'small'} + placeholder={'xx'} sx={{flexGrow: 2}} + inputProps={{sx: {textAlign: 'center'}}}/> + event.target.value.length <= 3 ? formik.setFieldValue("plate_part3", event.target.value) : null} + size={'small'} placeholder={'xxx'} sx={{ + flexGrow: 3, borderLeft: 1, borderRadius: 0, borderColor: 'divider' + }} inputProps={{sx: {textAlign: 'center'}}}/> + + - setPlateDrawer(false)} > - - {plate_words.map((item) => ( - - ))} - - + {selectedWordName} + - - - - + setPlateDrawer(false)} + > + + {plate_words.map((item) => ( + + ))} + + + event.target.value.length <= 2 ? formik.setFieldValue("plate_part1", event.target.value) : null} + size={'small'} + placeholder={'xx'} + sx={{flexGrow: 2}} + inputProps={{sx: {textAlign: 'center'}}}/> + + + + + + {t("error_message_plate_number")} diff --git a/src/core/components/SelectBox.jsx b/src/core/components/SelectBox.jsx index a1c35c7..2ff2dba 100644 --- a/src/core/components/SelectBox.jsx +++ b/src/core/components/SelectBox.jsx @@ -19,28 +19,26 @@ function SelectBox({ return ( {label}