import { View, Text, SafeAreaView, ScrollView, StyleSheet, StatusBar, Platform, Dimensions, Appearance, KeyboardAvoidingView, TextInput, TouchableWithoutFeedback, } from "react-native"; import React, { useEffect, useState } from "react"; import { connect } from "react-redux"; import { publicApi, user, userAddress } from "../../redux/actions"; import onInput from "../../utils/onInput"; import { useNavigation } from "@react-navigation/native"; import { asyncAwesomeAlert } from "../../utils/AsyncWrappers"; //components import Navbar from "../../components/Navbar"; import CustomPressable from "../../components/Pressable"; import CustomTextInput from "../../components/CustomTextInput"; import Select from "../../components/Select"; import MapSelector from "../../components/MapSelector"; //style import tw from "tailwind-rn"; import Colors from "../../constants/Colors"; import fontSize from "../../constants/fontSize"; //variables const ios = Platform.OS === "ios"; const { height } = Dimensions.get("window"); const Address = ({ user, route, city, province, getCity, getProvince, provinces, cities, createAddress, profileFields, setProfileFields, setProfile, loading, setPhase, cityLoading, mobile, theme, }) => { const [addressFields, setAddressFields] = useState({}); const [mapAddress, setMapAddress] = useState(null); const colorScheme = Appearance.getColorScheme(); const navigation = useNavigation(); const profilePage = React.useMemo(() => { return route.params?.type === "profile"; }); useEffect(() => { getProvince(); setProfileFields({ file: user?.picFileId, picFileId: user?.picFileId, docFileIds: user?.docFileIds, cellphone: user?.cellphone, firstName: user?.firstName, lastName: user?.lastName, password: user?.password, username: user?.username, address: user?.address, email: user?.email, birthDate: user?.birthDate, gender: user?.gender, status: user?.status, nationalId: user?.nationalId, phone: user?.phone, schools: user?.schools, zoneId: user?.zoneId, schoolId: user?.schoolId, postalCode: user?.postalCode, gradeIds: user?.gradeIds, provinceId: user?.provinceId, cityId: user?.cityId, }); }, []); useEffect(() => { StatusBar.setBarStyle( `${theme === "light" ? "dark" : "light"}-content`, true ); }, [theme]); useEffect(() => { if (addressFields?.provinceId) { getCity({ provinceId: provinces.filter( (province) => province.name === addressFields?.provinceId )[0].id, }); } }, [addressFields]); const onChange = (name, value) => { setAddressFields({ ...addressFields, [name]: value }); }; const submit = () => { const { firstName, lastName, cellphone, phone, address, provinceId, cityId, postalCode, } = addressFields; if (!firstName) { return asyncAwesomeAlert("خطا", "نام خود را وارد کنید.", { showCancelButton: false, confirmText: "باشه", }); } if (!lastName) { return asyncAwesomeAlert("خطا", "نام خانوادگی خود را وارد کنید", { showCancelButton: false, confirmText: "باشه", }); } if (!cellphone) { return asyncAwesomeAlert("خطا", "شماره موبایل خود را وارد کنید.", { showCancelButton: false, confirmText: "باشه", }); } else { if (cellphone.slice(0, 2) !== "09") { return asyncAwesomeAlert( "خطا", "فرمت شماره موبایل وارد شده اشتباه است.", { showCancellphoneButton: false, confirmText: "باشه", } ); } if (cellphone.length !== 11) { return asyncAwesomeAlert( "خطا", "شماره موبایل میبایست یازده رقم باشد.", { showCancelButton: false, confirmText: "باشه", } ); } } if (!phone) { return asyncAwesomeAlert("خطا", "شماره تلفن خود را وارد کنید.", { showCancelButton: false, confirmText: "باشه", }); } else { if (phone.slice(0, 1) !== "0") { return asyncAwesomeAlert( "خطا", "فرمت شماره تلفن وارد شده اشتباه است.", { showCancelButton: false, confirmText: "باشه", } ); } if (phone.length !== 11) { return asyncAwesomeAlert("خطا", "شماره تلفن میبایست یازده رقم باشد.", { showCancelButton: false, confirmText: "باشه", }); } } if (!provinceId) { return asyncAwesomeAlert("خطا", "نام استان خود را وارد کنید.", { showCancelButton: false, confirmText: "باشه", }); } if (!cityId) { return asyncAwesomeAlert("خطا", "نام شهرستان خود را وارد کنید.", { showCancelButton: false, confirmText: "باشه", }); } if (!postalCode) { return asyncAwesomeAlert("خطا", "کد پستی خود را وارد کنید.", { showCancelButton: false, confirmText: "باشه", }); } else { if (postalCode.length !== 10) { return asyncAwesomeAlert("خطا", "کد ملی میبایست ده رقم باشد.", { showCancelButton: false, confirmText: "باشه", }); } } if (!mapAddress) { return asyncAwesomeAlert("خطا", "آدرس خود را از روی نقشه انتخاب کن", { showCancelButton: false, confirmText: "باشه", }); } createAddress({ firstName, lastName, cellphone, phone, address: mapAddress, provinceId: provinces.filter( (province) => province.name === provinceId )[0].id, cityId: cities.filter((city) => city.name === cityId)[0]?.id, postalCode, location: null, }); navigation.goBack(); }; const submitProfile = () => { const { firstName, lastName, username, password, postalCode, address, email, phone, picFileId, gender, nationalId, birthDate, schools, gradeIds, status, provinceId, cityId, docFileIds, } = profileFields; if (phone) { if (phone.slice(0, 1) !== "0") { return asyncAwesomeAlert( "خطا", "فرمت شماره تلفن وارد شده اشتباه است.", { showCancelButton: false, confirmText: "باشه", } ); } if (phone.length !== 11) { return asyncAwesomeAlert("خطا", "شماره تلفن میبایست یازده رقم باشد.", { showCancelButton: false, confirmText: "باشه", }); } } const data = { firstName: firstName, lastName: lastName, username: username, cellphone: user.cellphone, password: password, postalCode: postalCode, address: address, email: email, phone: phone, nationalId: nationalId, picFileId: picFileId, gender: gender, birthDate: birthDate, schools: schools, gradeIds: gradeIds, status: status, provinceId: provinceId, cityId: cityId, docFileIds: docFileIds, }; setProfile(data); navigation.goBack(); }; const Header = ({ title, text }) => { return ( {title} {text} ); }; return (
profilePage ? setProfileFields({ ...profileFields, firstName: value }) : onChange(name, value) } autoFocus={false} regex={(val) => val} /> profilePage ? setProfileFields({ ...profileFields, lastName: value }) : onChange(name, value) } autoFocus={false} regex={(val) => val} /> {profilePage ? ( setProfileFields({ ...profileFields, nationalId: value }) } autoFocus={false} regex={(text) => onInput.numberOnly(text)} /> ) : null}
profilePage ? setProfileFields({ ...profileFields, cellphone: value }) : onChange(name, value) } autoFocus={false} regex={(text) => onInput.numberOnly(text)} /> profilePage ? setProfileFields({ ...profileFields, phone: value }) : onChange(name, value) } autoFocus={false} regex={(text) => onInput.numberOnly(text)} />
city.id === profileFields.cityId )[0]?.name || city[0] : city[0] } onChange={(name, value) => value === "شهرستان" ? {} : onChange(name, value) } options={city} width={"100%"} name="cityId" /> {!profilePage ? ( setMapAddress(text)} placeholderTextColor={ theme === "light" ? Colors.theme1.gray2077 : Colors.theme1.white + "aa" } /> ) : null} profilePage ? setProfileFields({ ...profileFields, postalCode: value, }) : onChange(name, value) } autoFocus={false} regex={(text) => onInput.numberOnly(text)} /> (profilePage ? submitProfile() : submit())} /> ); }; const styles = StyleSheet.create({ contentContainerStyle: { paddingBottom: 0, }, container: { flexDirection: "column", paddingVertical: 5, paddingHorizontal: 16, flex: 1, }, }); const mapStateToProps = (state) => ({ provinces: state.publicApi.provinces, province: state.publicApi.province, cities: state.publicApi.cities, city: state.publicApi.city, loading: state.userAddress.loading, cityLoading: state.publicApi.loading, user: state.user.status, profileFields: state.user.profileFields, mobile: state.publicApi.mobile, theme: state.publicApi.theme, }); const mapDispatchToProps = { getProvince: publicApi.getProvince, getCity: publicApi.getCity, createAddress: userAddress.add, setProfileFields: user.setProfileFields, setProfile: user.setProfile, }; export default connect(mapStateToProps, mapDispatchToProps)(Address);