diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json index d4ac905..bef7b52 100644 --- a/public/locales/fa/app.json +++ b/public/locales/fa/app.json @@ -134,7 +134,10 @@ "no_request_found": "درخواستی یافت نشد" }, "LoanRequest": { + "finish_loan_request": "درخواست شما با موفقیت ثبت شد", + "back_to_dashboard": "بازگشت به صفحه اصلی", "cityList_empty": "ابتدا استان را وارد کنید", + "cityList_loading": "درحال دریافت لیست شهر ها ...", "loan_request_page": "ثبت درخواست وام", "personal_info": "اطلاعات شخصی", "national_code_number": "کد ملی می بایست شامل اعداد باشد", @@ -146,6 +149,8 @@ "uploading_documents": "اسناد", "error_message_name": "لطفا نام خود را وارد کنید!", "error_message_plate_number": "لطفا شماره پلاک را به درستی وارد کنید!", + "error_message_occupation_id": "لطفا کد شغل (با توجه به مستندات ارائه شده) را به درستی وارد کنید!", + "error_message_education_id": "لطفا تحصیلات (با توجه به مستندات ارائه شده) را به درستی وارد کنید!", "error_message_tel_number": "لطفا شماره ثابت (با پیش شماره استان) خود را وارد کنید!", "error_message_vehicle_type": "لطفا نوع وسیله نقلیه خود را وارد کنید!", "error_message_navgan_id": "لطفا کد هوشمند ناوگان خود را وارد کنید!", @@ -158,6 +163,8 @@ "error_message_navgan_type": "لطفا نوع ناوگان خود را وارد کنید!", "error_message_address": "لطفا آدرس خود را وارد کنید!", "text_field_tel_number": "شماره ثابت (با پیش شماره استان)", + "text_field_education_id": "تحصیلات", + "text_field_occupation_id": "شغل", "text_field_enter_your_tel_number": "شماره ثابت (با پیش شماره استان) خود را وارد کنید", "text_field_name": "نام", "text_field_plate_part4": "بخش چهارم", 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 9bce099..9fb8f08 100644 --- a/src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx +++ b/src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx @@ -1,36 +1,37 @@ import SelectBox from "@/core/components/SelectBox"; import {SEND_LOAN_REQUEST_NAVGAN} from "@/core/data/apiRoutes"; import DataSaverOnIcon from "@mui/icons-material/DataSaverOn"; -import {Box, Button, Grid, TextField} from "@mui/material"; +import {Box, Button, Grid, Stack, TextField, Typography} from "@mui/material"; import {useFormik} from "formik"; import {useTranslations} from "next-intl"; import * as Yup from "yup"; -import {useRequest, useUser} from "@witel/webapp-builder"; +import {CenterLayout, LinkRouting, useRequest} 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/components/MuiDatePicker"; import UseEducations from "@/lib/app/hooks/useEducations"; import useOccupations from "@/lib/app/hooks/useOccupations"; +import {useState} from "react"; +import DoneIcon from '@mui/icons-material/Done'; const AddFormComponent = () => { const t = useTranslations(); - const {token} = useUser(); + const [finishLoanRequest, setFinishLoanRequest] = useState(false) const requestServer = useRequest() const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince() - const {cityTextField, cityList, setProvinceID} = useCities() + const {cityTextField, cityList, setProvinceID, isLoadingCityList} = useCities() const {educationsList, isLoadingEducationsList, errorEducationsList} = UseEducations() const {occupationsList, isLoadingOccupationsList, errorOccupationsList} = useOccupations() const initialValues = { telephone_number: "", vehicle_type: "", - plate_number: "", province_id: "", city_id: "", navgan_id: "", national_id: "", - shenasname_serial: "", + national_serial_number: "", postal_code: "", navgan_type: "", plate_part1: "", @@ -45,7 +46,10 @@ const AddFormComponent = () => { const validationSchema = Yup.object().shape({ telephone_number: Yup.mixed() - .test("max", `${t("LoanRequest.tel_number_max")}`, (value) => value.toString().length === 11) + .test("max", `${t("LoanRequest.tel_number_max")}`, (value) => { + const stringValue = String(value); + return stringValue.length === 11 + }) .required(t("LoanRequest.error_message_tel_number")), vehicle_type: Yup.string().required( t("LoanRequest.error_message_vehicle_type") @@ -95,7 +99,7 @@ const AddFormComponent = () => { .test("positive", `${t("LoanRequest.national_code_positive")}`, (value) => value >= 0) .test("max", `${t("LoanRequest.national_code_max")}`, (value) => value.toString().length === 10) .required(t("LoanRequest.error_message_national_id")), - shenasname_serial: Yup.mixed() + national_serial_number: Yup.mixed() .test("max", `${t("LoanRequest.shenasname_serial_max")}`, (value) => value.toString().length === 10) .required(t("LoanRequest.error_message_shenasname_serial") ), @@ -108,18 +112,43 @@ const AddFormComponent = () => { formData.append("navgan_type", values.navgan_type); formData.append("postal_code", values.postal_code); formData.append("vehicle_type", values.vehicle_type); - formData.append("plate_number", values.plate_number); + formData.append("plate_part1", values.plate_part1); + formData.append("plate_part2", values.plate_part2); + formData.append("plate_part3", values.plate_part3); + formData.append("plate_part4", values.plate_part4); formData.append("province_id", values.province_id); formData.append("city_id", values.city_id); formData.append("address", values.address); formData.append("navgan_id", values.navgan_id); formData.append("national_id", values.national_id); formData.append("birthday", values.birthday); - formData.append("shenasname_serial", values.shenasname_serial); + formData.append("national_serial_number", values.national_serial_number); formData.append("education_id", values.education_id); formData.append("occupation_id", values.occupation_id); - requestServer(SEND_LOAN_REQUEST_NAVGAN, "post", {auth: true, notification: true}).then().catch(() => { + requestServer(SEND_LOAN_REQUEST_NAVGAN, "post", { + auth: true, notification: true, data: { + telephone_number: values.telephone_number, + vehicle_type: values.vehicle_type, + province_id: values.province_id, + city_id: values.city_id, + navgan_id: values.navgan_id, + national_id: values.national_id, + national_serial_number: values.national_serial_number, + postal_code: values.postal_code, + navgan_type: values.navgan_type, + plate_part1: values.plate_part1, + plate_part2: values.plate_part2, + plate_part3: values.plate_part3, + plate_part4: values.plate_part4, + address: values.address, + birthday: values.birthday, + education_id: values.education_id, + occupation_id: values.occupation_id, + } + }).then(() => { + setFinishLoanRequest(true) + }).catch(() => { props.setSubmitting(false) }) }; @@ -129,265 +158,299 @@ const AddFormComponent = () => { }) return ( <> - - - - - - - - - - - - - - - - - - - - - - { - formik.setFieldValue('navgan_type', event.target.value) - }} - setFieldTouched={formik.setFieldTouched} - error={formik.touched.navgan_type && Boolean(formik.errors.navgan_type)} - helperText={formik.touched.navgan_type && formik.errors.navgan_type} - onBlur={formik.handleBlur("navgan_type")} - /> - - - - - - - - { - formik.setFieldValue('province_id', event.target.value); - setProvinceID(event.target.value) - formik.setFieldTouched("city_id", false, false); - formik.setFieldValue("city_id", "") - }} - setFieldTouched={formik.setFieldTouched} - error={formik.touched.province_id && Boolean(formik.errors.province_id)} - helperText={formik.touched.province_id && formik.errors.province_id} - onBlur={formik.handleBlur("province_id")} - /> - - - formik.setFieldValue('city_id', event.target.value)} - setFieldTouched={formik.setFieldTouched} - error={formik.touched.city_id && Boolean(formik.errors.city_id)} - helperText={formik.touched.city_id && formik.errors.city_id} - onBlur={formik.handleBlur("city_id")} - /> - - - - - 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")} - /> - - - - - - - - { - formik.setFieldValue('education_id', event.target.value) - }} - setFieldTouched={formik.setFieldTouched} - error={formik.touched.education_id && Boolean(formik.errors.education_id)} - helperText={formik.touched.education_id && formik.errors.education_id} - onBlur={formik.handleBlur("education_id")} - /> - - - { - formik.setFieldValue('occupation_id', event.target.value) - }} - setFieldTouched={formik.setFieldTouched} - error={formik.touched.occupation_id && Boolean(formik.errors.occupation_id)} - helperText={formik.touched.occupation_id && formik.errors.occupation_id} - onBlur={formik.handleBlur("occupation_id")} - /> - - - - - - - - - - + {finishLoanRequest ? + ( + + + {t("LoanRequest.finish_loan_request")} + + + + {t("LoanRequest.back_to_dashboard")} + + + ) : ( + <> + + + + + + + + + + + + + + + + + { + const inputValue = event.target.value; + + // Check if the input value is numeric + if (isNaN(Number(inputValue))) { + return; // Exit the function without making any changes + } + + // If the input value is numeric, update the formik field + formik.handleChange({ + target: { + name: "telephone_number", + value: inputValue, + }, + }); + }} + label={t("LoanRequest.text_field_tel_number")} + placeholder={t( + "LoanRequest.text_field_enter_your_tel_number" + )} + fullWidth + onBlur={formik.handleBlur("telephone_number")} + error={formik.touched.telephone_number && Boolean(formik.errors.telephone_number)} + helperText={formik.touched.telephone_number && formik.errors.telephone_number} + /> + + + + + { + formik.setFieldValue('navgan_type', event.target.value) + }} + setFieldTouched={formik.setFieldTouched} + error={formik.touched.navgan_type && Boolean(formik.errors.navgan_type)} + helperText={formik.touched.navgan_type && formik.errors.navgan_type} + onBlur={formik.handleBlur("navgan_type")} + /> + + + + + + + + { + formik.setFieldValue('province_id', event.target.value); + setProvinceID(event.target.value) + formik.setFieldTouched("city_id", false, false); + formik.setFieldValue("city_id", "") + }} + setFieldTouched={formik.setFieldTouched} + error={formik.touched.province_id && Boolean(formik.errors.province_id)} + helperText={formik.touched.province_id && formik.errors.province_id} + onBlur={formik.handleBlur("province_id")} + /> + + + formik.setFieldValue('city_id', event.target.value)} + setFieldTouched={formik.setFieldTouched} + error={formik.touched.city_id && Boolean(formik.errors.city_id)} + helperText={formik.touched.city_id && formik.errors.city_id} + onBlur={formik.handleBlur("city_id")} + /> + + + + + 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")} + /> + + + + + + + + { + formik.setFieldValue('education_id', event.target.value) + }} + setFieldTouched={formik.setFieldTouched} + error={formik.touched.education_id && Boolean(formik.errors.education_id)} + helperText={formik.touched.education_id && formik.errors.education_id} + onBlur={formik.handleBlur("education_id")} + /> + + + { + formik.setFieldValue('occupation_id', event.target.value) + }} + setFieldTouched={formik.setFieldTouched} + error={formik.touched.occupation_id && Boolean(formik.errors.occupation_id)} + helperText={formik.touched.occupation_id && formik.errors.occupation_id} + onBlur={formik.handleBlur("occupation_id")} + /> + + + + + + + + + + + + ) + } + ); }; diff --git a/src/core/components/MuiDatePicker.jsx b/src/core/components/MuiDatePicker.jsx index 60dfd16..f6863e9 100644 --- a/src/core/components/MuiDatePicker.jsx +++ b/src/core/components/MuiDatePicker.jsx @@ -58,7 +58,7 @@ function ButtonDatePicker(props) { ); } -export default function PickerWithButtonField({formik, error, helperText}) { +export default function PickerWithButtonField({formik}) { const [value, setValue] = useState(null); return ( { - formik.setFieldValue("birthday", newValue) + const formattedBirthday = moment(newValue).locale("fa").format("YYYY-MM-DD") + formik.setFieldValue("birthday", formattedBirthday) setValue(newValue) + console.log(formattedBirthday) }} /> diff --git a/src/core/components/PlateNumber.jsx b/src/core/components/PlateNumber.jsx index cbe0e7b..b2b365e 100644 --- a/src/core/components/PlateNumber.jsx +++ b/src/core/components/PlateNumber.jsx @@ -123,14 +123,15 @@ const plate_words = [ const PlateNumber = ({formik}) => { const t = useTranslations(); const [plateDrawer, setPlateDrawer] = useState(false); - const isValidPlate = Boolean(formik.errors.plate_part1 || formik.errors.plate_part3 || formik.errors.plate_part4) + const isErrorPlate = Boolean(formik.errors.plate_part1 || formik.errors.plate_part3 || formik.errors.plate_part4) + const isTouched = (formik.touched.plate_part1 || formik.touched.plate_part3 || formik.touched.plate_part4) return ( <> { {isValidPlate ? `${t("LoanRequest.error_message_plate_number")}` : null} + error={(isTouched && isErrorPlate)}>{(isTouched && isErrorPlate) ? `${t("LoanRequest.error_message_plate_number")}` : null} ) diff --git a/src/core/components/SelectBox.jsx b/src/core/components/SelectBox.jsx index 2ff2dba..faa0cb8 100644 --- a/src/core/components/SelectBox.jsx +++ b/src/core/components/SelectBox.jsx @@ -42,8 +42,8 @@ function SelectBox({ ) : ( selectors.map((selector) => ( - - {selector.name} + + {selector.name || selector.title} )) )} diff --git a/src/lib/app/hooks/useCities.jsx b/src/lib/app/hooks/useCities.jsx index 647ffc0..bc01e0f 100644 --- a/src/lib/app/hooks/useCities.jsx +++ b/src/lib/app/hooks/useCities.jsx @@ -8,10 +8,12 @@ const useCities = () => { const [provinceID, setProvinceID] = useState(null) const [cityList, setCityList] = useState([]); const [cityTextField, setCityTextField] = useState(t("text_field_city_id")); + const [isLoadingCityList, setIsLoadingCityList] = useState(false) const requestServer = useRequest({auth: true, notification: false}) useEffect(() => { if (provinceID === null) return + setIsLoadingCityList(true) setCityTextField(t("text_field_loading_cities_list")) requestServer(`${GET_CITIES_LIST}?province_id=${provinceID}`, "get", {auth: true, notification: false}) .then(({data}) => { @@ -22,13 +24,15 @@ const useCities = () => { value: city.id, })); setCityList(formattedData); + setIsLoadingCityList(false) setCityTextField(t("text_field_city_id")) }).catch(() => { + setIsLoadingCityList(false) setCityTextField(t("text_field_error_fetching_cities")) }); }, [provinceID]) - return {cityTextField, cityList, setProvinceID} + return {cityTextField, cityList, setProvinceID, isLoadingCityList} } export default useCities \ No newline at end of file diff --git a/src/lib/app/hooks/useEducations.jsx b/src/lib/app/hooks/useEducations.jsx index 1431f38..16bcfe4 100644 --- a/src/lib/app/hooks/useEducations.jsx +++ b/src/lib/app/hooks/useEducations.jsx @@ -11,13 +11,8 @@ const useEducations = () => { useEffect(() => { setIsLoadingEducationsList(true) requestServer(GET_EDUCATIONS_LIST, 'get', {auth: true, notification: false}).then(({data}) => { - const formattedData = data.map((province, index) => ({ - id: index, - name: province.name, - value: province.id, - })); setIsLoadingEducationsList(false) - setEducationsList(formattedData); + setEducationsList(data.data); }).catch(() => { setIsLoadingEducationsList(false) setErrorEducationsList(true) diff --git a/src/lib/app/hooks/useOccupations.jsx b/src/lib/app/hooks/useOccupations.jsx index acf8c14..4a2080a 100644 --- a/src/lib/app/hooks/useOccupations.jsx +++ b/src/lib/app/hooks/useOccupations.jsx @@ -11,13 +11,8 @@ const useOccupations = () => { useEffect(() => { setIsLoadingOccupationsList(true) requestServer(GET_OCCUPATIONS_LIST, 'get', {auth: true, notification: false}).then(({data}) => { - const formattedData = data.map((province, index) => ({ - id: index, - name: province.name, - value: province.id, - })); setIsLoadingOccupationsList(false) - setOccupationsList(formattedData); + setOccupationsList(data.data); }).catch(() => { setIsLoadingOccupationsList(false) setErrorOccupationsList(true)