import React, { useState, useEffect } from "react"; import { connect } from "react-redux"; import { useNavigate, useLocation } from "react-router-dom"; import { publicApi, userAddress, dialog, user } from "../../redux/actions"; import onInput from "../../utils/onInput"; import location from "../../utils/location"; import Input from "../../components/Input"; import Select from "../../components/Select"; import Button from "../../components/Button"; import ReverseMap from "../../components/ReverseMap"; import Loading from "../../components/Loading"; import Radio from "../../components/Radio"; //assets import dropdownIcon from "../../assets/icons/white-dropdown.svg"; import lightGreenArrow from "../../assets/icons/light-green-arrow.svg"; import arrowBlueIcon from "../../assets/icons/arrow-right-blue.svg"; import arrowWhiteIcon from "../../assets/icons/arrow-left-white.svg"; export const Address = ({ city, province, getCity, getProvince, provinces, cities, createAddress, loading, setPhase, cityLoading, isMobile, isDark, setDialog, profilePage, editPage, setProfileFields, profileFields, setProfile, user, setHeaderOptions, headerOptions, getAddress, addressInfo, updateAddress, }) => { const [addressFields, setAddressFields] = useState({}); const [mapAddress, setMapAddress] = useState(null); const navigation = useNavigate(); const location = useLocation(); console.log({ provinces }); useEffect(() => { setHeaderOptions(headerOptions); if (province.length <= 1) { getProvince(); } if (isMobile) { if (editPage || profilePage) { setHeaderOptions(headerOptions); } else { setHeaderOptions({ shown: true, back: true, title: "آدرس", }); } } if (editPage) { getAddress({ id: location.getId() }); } }, []); useEffect(() => { if (editPage && addressInfo) { const { firstName, lastName, cellphone, phone, provinceId, address, cityId, postalCode, } = addressInfo; setAddressFields({ firstName, lastName, cellphone, phone, provinceId, cityId, postalCode, }); setMapAddress(address); } }, [addressInfo]); useEffect(() => { if (addressFields?.provinceId) { console.log({ addressFields }); getCity({ provinceId: addressFields?.provinceId, }); } }, [addressFields]); useEffect(() => { if (profileFields?.provinceId) { getCity({ provinceId: profileFields?.provinceId, }); } }, [profileFields]); const onChange = (name, value) => { console.log({ name, value }); setAddressFields({ ...addressFields, [name]: value }); }; const submitProfile = () => { if (user.cellphone && user.cellphone.length < 11) { setDialog({ text: "شماره موبایل خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } const postalCode = profileFields?.postalCode || user.postalCode; if (postalCode && postalCode.length < 10) { setDialog({ text: "شماره کد پستی خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } const data = { firstName: profileFields?.firstName || user.firstName, lastName: profileFields?.lastName || user.lastName, username: profileFields?.username || user.username, cellphone: user.cellphone, password: profileFields?.password || user.password, postalCode, address: profileFields?.address || user.address, email: profileFields?.email || user.email, phone: profileFields?.phone || user.phone, nationalId: profileFields?.nationalId || user.nationalId, picFileId: profileFields?.picFileId || user.picFileId, gender: profileFields?.gender || user.gender, birthDate: profileFields?.birthDate || user.birthDate, schools: profileFields?.schools || user.schools, gradeIds: profileFields?.gradeIds || user.gradeIds, provinceId: profileFields?.provinceId || user.provinceId, cityId: profileFields?.cityId || user.cityId, docFileIds: profileFields?.docFileIds || user.docFileIds, }; setProfile(data); }; const [activeCheckbox, setActiveCheckbox] = useState(true); const submit = () => { const { firstName, lastName, cellphone, phone, address, provinceId, cityId, postalCode, } = addressFields; if (!activeCheckbox && !firstName) { setDialog({ text: "نام خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!activeCheckbox && !lastName) { setDialog({ text: "نام خانوادگی خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!activeCheckbox && (!cellphone || cellphone.length < 11)) { setDialog({ text: "شماره موبایل خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!activeCheckbox && !phone) { setDialog({ text: "شماره تلفن خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!provinceId) { setDialog({ text: "نام استان خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!cityId) { setDialog({ text: "نام شهرستان خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!postalCode || postalCode.length < 10) { setDialog({ text: "کد پستی خود را وارد کنید.", type: "alert", accept: () => {}, open: true, }); return; } if (!mapAddress) { setDialog({ text: "آدرس خود را از روی نقشه انتخاب کن", type: "alert", accept: () => {}, open: true, }); return; } if (editPage) { updateAddress({ id: addressInfo.id, firstName, lastName, cellphone, phone, address: mapAddress, provinceId, cityId, postalCode, location: null, }); } else { createAddress({ firstName, lastName, cellphone, phone, address: mapAddress, provinceId, cityId, postalCode, location: null, }); } if (editPage) { navigation(-1); } else { setPhase("deliveryForm"); } }; const Header = ({ title, text }) => { return (
{text}
برای خودم
گیرنده فرد دیگری است