reza added profile form

master
Reza_ashrafi 3 years ago
parent bde3d2224e
commit 26f18dc08e
  1. 44
      navigation/index.js
  2. 8
      src/components/CustomTextInput.js
  3. 23
      src/redux/actions/user.js
  4. 8
      src/redux/reducers/user.js
  5. 189
      src/screens/Address/index.js

@ -49,15 +49,15 @@ const BottomTabNavigator = () => {
screenOptions={{
tabBarHideOnKeyboard: true,
headerShown: false,
tabBarActiveTintColor: "#06BACE",
tabBarActiveTintColor: Colors.theme1[colorScheme].green79,
tabBarInactiveTintColor: "grey",
tabBarStyle: {
backgroundColor: Colors.theme1[colorScheme].greenFF1,
height: 70,
},
tabBarLabelStyle: {
fontSize: fontSize.xs,
fontFamily: "regular",
fontSize: fontSize.sm,
fontFamily: "bold",
transform: [{ translateY: -7 }],
},
tabBarShowLabel: true,
@ -76,7 +76,7 @@ const BottomTabNavigator = () => {
width={31.192}
height={31.192}
>
<G fill="#06bace">
<G fill={Colors.theme1[colorScheme].green79}>
<Path d="M15.803 14.127a2.363 2.363 0 0 0-.429 0 5.777 5.777 0 1 1 .429 0Z" />
<Path
data-name="Vector"
@ -92,7 +92,7 @@ const BottomTabNavigator = () => {
>
<G
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -121,7 +121,7 @@ const BottomTabNavigator = () => {
>
<Path
d="M20.852 29.624h-8.381c-6.984 0-9.778-2.693-9.778-9.426v-8.079c0-6.733 2.794-9.426 9.778-9.426h8.381c6.984 0 9.778 2.693 9.778 9.426v8.079c-.001 6.733-2.794 9.426-9.778 9.426Z"
fill="#06bace"
fill={Colors.theme1[colorScheme].green79}
/>
<Path
data-name="Vector"
@ -142,7 +142,7 @@ const BottomTabNavigator = () => {
<Path
d="M16.002 11.957H8.933"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -151,7 +151,7 @@ const BottomTabNavigator = () => {
data-name="Vector"
d="m21.063 11.951.9 1.01 2.684-3.03M16.002 21.383H8.933M21.063 21.377l.9 1.01 2.684-3.03"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -160,7 +160,7 @@ const BottomTabNavigator = () => {
data-name="Vector"
d="M20.852 29.624h-8.381c-6.984 0-9.778-2.693-9.778-9.426v-8.079c0-6.733 2.794-9.426 9.778-9.426h8.381c6.984 0 9.778 2.693 9.778 9.426v8.079c-.001 6.733-2.794 9.426-9.778 9.426Z"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -180,14 +180,14 @@ const BottomTabNavigator = () => {
focused ? (
<Svg
xmlns="http://www.w3.org/2000/svg"
width={34.395}
height={29.991}
width={35}
height={31.100}
>
<G data-name="Group 2000">
<Path
d="M25.421 29.241H8.974C4.04 29.241.75 26.392.75 19.744V10.25c0-6.651 3.29-9.5 8.224-9.5h16.447c4.935 0 8.229 2.849 8.229 9.5v9.5c0 6.642-3.294 9.491-8.229 9.491Z"
fill="#06bace"
stroke="#fff"
fill={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -207,14 +207,14 @@ const BottomTabNavigator = () => {
) : (
<Svg
xmlns="http://www.w3.org/2000/svg"
width={34.395}
height={31.5}
width={35}
height={32}
>
<G data-name="Group 1999">
<Path
d="M25.421 29.241H8.974C4.04 29.241.75 26.392.75 19.744V10.25c0-6.651 3.29-9.5 8.224-9.5h16.447c4.935 0 8.229 2.849 8.229 9.5v9.5c0 6.642-3.294 9.491-8.229 9.491Z"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -224,7 +224,7 @@ const BottomTabNavigator = () => {
data-name="Vector"
d="M12.427 14.995v-2.083c0-2.673 1.892-3.766 4.2-2.43l1.805 1.042 1.806 1.041c2.308 1.336 2.308 3.523 0 4.86l-1.806 1.041-1.805 1.046c-2.308 1.332-4.2.239-4.2-2.434v-2.083Z"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -248,7 +248,7 @@ const BottomTabNavigator = () => {
>
<Path
d="M32.207 24.227V6.798a2.869 2.869 0 0 0-3.179-2.875h-.088a27.857 27.857 0 0 0-10.35 3.422l-.249.159a1.641 1.641 0 0 1-1.552 0l-.361-.216A27.72 27.72 0 0 0 6.09 3.909a2.864 2.864 0 0 0-3.162 2.874v17.444a2.981 2.981 0 0 0 2.547 2.859l.425.058a37.976 37.976 0 0 1 10.892 3.524l.059.029a1.6 1.6 0 0 0 1.405 0 37.631 37.631 0 0 1 10.921-3.552l.483-.058a2.981 2.981 0 0 0 2.547-2.86Z"
fill="#06bace"
fill={Colors.theme1[colorScheme].green79}
/>
<Path
data-name="Vector"
@ -268,7 +268,7 @@ const BottomTabNavigator = () => {
>
<G
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -297,7 +297,7 @@ const BottomTabNavigator = () => {
>
<Path
d="M12.62 3.974 5.079 9.85a6.658 6.658 0 0 0-2.281 4.645v10.368a5.912 5.912 0 0 0 5.89 5.9h16.2a5.909 5.909 0 0 0 5.89-5.89V14.691a6.609 6.609 0 0 0-2.518-4.827l-8.644-6.058a6.278 6.278 0 0 0-6.996.168Z"
fill="#06bace"
fill={Colors.theme1[colorScheme].green79}
/>
<Path
data-name="Vector"
@ -318,7 +318,7 @@ const BottomTabNavigator = () => {
<Path
d="M12.62 3.974 5.079 9.85a6.658 6.658 0 0 0-2.281 4.645v10.368a5.912 5.912 0 0 0 5.89 5.9h16.2a5.909 5.909 0 0 0 5.89-5.89V14.691a6.609 6.609 0 0 0-2.518-4.827l-8.644-6.058a6.278 6.278 0 0 0-6.996.168Z"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -327,7 +327,7 @@ const BottomTabNavigator = () => {
data-name="Vector"
d="M16.79 25.471v-6.693"
fill="none"
stroke="#86a0b9"
stroke={Colors.theme1[colorScheme].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}

@ -54,6 +54,14 @@ const FloatingLabelInput = ({
direction: direction ? direction : "rtl"
},
});
React.useEffect(() => {
if(value) {
setIsFocused(true);
}else{
setIsFocused(false);
}
},[value]);
return (
<View style={tw("mt-4")}>
<Text

@ -8,7 +8,9 @@ const user = {
await proxy.post("public/sendOTP", data, { dispatch });
},
otp_login: (data = {}) => async (dispatch) => {
otp_login:
(data = {}) =>
async (dispatch) => {
await proxy.login("user/otp/login", data, { dispatch });
},
@ -27,20 +29,6 @@ const user = {
getUserRole: (data) => async (dispatch) =>
await proxy.get("user/getUserRole", data, { dispatch }),
// list:
// (data = {}) =>
// async (dispatch : Dispatch) =>
// await proxy.get("user/list", data, { dispatch }),
// domains:
// (data = {}) =>
// async (dispatch : Dispatch) =>
// await proxy.get("user/domains", data, { dispatch }),
// getmothers:
// (data = {}) =>
// async (dispatch : Dispatch) =>
// await proxy.get("mothers/list", data, {
// dispatch,
// }),
getProfile:
(data = {}) =>
async (dispatch) =>
@ -51,6 +39,11 @@ const user = {
await proxy.put("user/setProfile", data, { dispatch });
await proxy.get("user/getProfile", data2, { dispatch });
},
setProfileFields:
(data = {}) =>
async (dispatch) => {
await dispatch({ type: "user/setProfileFields", data });
},
add:
(data = {}, data2 = {}) =>
async (dispatch) => {

@ -12,6 +12,9 @@ let initialState = {
setDone: false,
setLogin: false,
check: "check",
profileFields : {
},
};
const user = (state = initialState, action) => {
@ -43,7 +46,7 @@ const user = (state = initialState, action) => {
return {
...state,
loading: false,
status: JSON.parse(data),
status: data,
error: null,
setDone: false,
};
@ -52,8 +55,9 @@ const user = (state = initialState, action) => {
case "user/getUserRole":
return { ...state, loading: false, userRoles: data, error: null };
case "user/setProfile":
// toast.success("تغییرات اعمال شد.");
return { ...state, loading: false, error: null, setDone: true };
case "user/setProfileFields":
return { ...state, loading: false, error: null, profileFields: data };
case "loading":
return { ...state, loading: true };
case "error":

@ -11,7 +11,8 @@ import {
} from "react-native";
import React, { useEffect, useState } from "react";
import { connect } from "react-redux";
import { publicApi, userAddress } from "../../redux/actions";
import { publicApi, user, userAddress } from "../../redux/actions";
import onInput from "../../utils/onInput";
import { useNavigation } from "@react-navigation/native";
import { asyncAwesomeAlert } from "../../utils/AsyncWrappers";
@ -30,6 +31,8 @@ import fontSize from "../../constants/fontSize";
const ios = Platform.OS === "ios";
const Address = ({
user,
route,
city,
province,
getCity,
@ -37,18 +40,45 @@ const Address = ({
provinces,
cities,
createAddress,
profileFields,
setProfileFields,
setProfile,
loading,
setPhase,
cityLoading,
}) => {
const profilePage = route.params.type === "profile";
const colorScheme = Appearance.getColorScheme();
const navigation = useNavigation();
const [addressFields, setAddressFields] = useState({});
const [mapAddress, setMapAddress] = useState(null);
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(() => {
@ -135,6 +165,52 @@ const Address = ({
navigation.goBack();
};
const submitProfile = () => {
const {
firstName,
lastName,
username,
password,
postalCode,
address,
email,
phone,
picFileId,
gender,
nationalId,
birthDate,
schools,
gradeIds,
status,
provinceId,
cityId,
docFileIds,
} = profileFields;
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 (
<View style={tw("flex flex-col mt-2")}>
@ -170,10 +246,10 @@ const Address = ({
<Navbar
headerOptions={{
logo: false,
menu: true,
menu: profilePage ? false : true,
hamburgerMenu: false,
title: "",
bookmark: true,
title: profilePage ? "اطلاعات کاربری" : "",
bookmark: profilePage ? false : true,
qr: false,
back: true,
}}
@ -194,8 +270,14 @@ const Address = ({
textAlign="right"
name="firstName"
maxlength="40"
value={addressFields?.firstName}
onChange={(name, value) => onChange(name, value)}
value={
profilePage ? profileFields.firstName : addressFields?.firstName
}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, firstName: value })
: onChange(name, value)
}
autoFocus={false}
regex={(val) => val}
/>
@ -205,11 +287,32 @@ const Address = ({
textAlign="right"
name="lastName"
maxlength="60"
value={addressFields?.lastName}
onChange={(name, value) => onChange(name, value)}
value={
profilePage ? profileFields.lastName : addressFields?.lastName
}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, lastName: value })
: onChange(name, value)
}
autoFocus={false}
regex={(val) => val}
/>
{profilePage && (
<CustomTextInput
label="کد ملی"
placeholder=""
textAlign="left"
name="nationalId"
maxlength="10"
value={profileFields.nationalId}
onChange={(name, value) =>
setProfileFields({ ...profileFields, nationalId: value })
}
autoFocus={false}
regex={onInput.numberOnly}
/>
)}
<Header
title="شماره تماس"
text="( شماره موبایل و شماره تلفن ثابت خود را
@ -221,10 +324,16 @@ const Address = ({
textAlign="left"
name="cellphone"
maxlength="11"
value={addressFields?.cellphone}
onChange={(name, value) => onChange(name, value)}
value={
profilePage ? profileFields.cellphone : addressFields?.cellphone
}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, cellphone: value })
: onChange(name, value)
}
autoFocus={false}
regex={(val) => val}
regex={onInput.phonenumber}
/>
<CustomTextInput
label="شماره تلفن"
@ -232,10 +341,14 @@ const Address = ({
textAlign="left"
name="phone"
maxlength="11"
value={addressFields?.phone}
onChange={(name, value) => onChange(name, value)}
value={profilePage ? profileFields.phone : addressFields?.phone}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, phone: value })
: onChange(name, value)
}
autoFocus={false}
regex={(val) => val}
regex={onInput.phonenumber}
/>
<Header
title="آدرس"
@ -244,8 +357,16 @@ const Address = ({
/>
<View style={tw("w-full mt-4")}>
<Select
defaultValue={province[0]}
onChange={(name, value) => onChange(name, value)}
defaultValue={
profilePage
? provinces?.filter(
(province) => province.id === profileFields.provinceId
)[0]?.name || province[0]
: city[0]
}
onChange={(name, value) =>
value === "استان" ? {} : onChange(name, value)
}
options={province}
width={"100%"}
name="provinceId"
@ -253,34 +374,50 @@ const Address = ({
</View>
<View style={tw("w-full mt-4")}>
<Select
defaultValue={city[0]}
onChange={(name, value) => onChange(name, value)}
defaultValue={
profilePage
? cities?.filter(
(city) => city.id === profileFields.cityId
)[0]?.name || city[0]
: city[0]
}
onChange={(name, value) =>
value === "شهر" ? {} : onChange(name, value)
}
options={city}
width={"100%"}
name="cityId"
/>
</View>
<View style={tw('mb-4')}>
<View style={tw("mb-4")}>
<CustomTextInput
label="کد پستی"
placeholder=""
textAlign="left"
name="postalCode"
maxlength="60"
value={addressFields?.postalCode}
onChange={(name, value) => onChange(name, value)}
value={
profilePage
? profileFields.postalCode
: addressFields?.postalCode
}
onChange={(name, value) =>
profilePage
? setProfileFields({ ...profileFields, postalCode: value })
: onChange(name, value)
}
autoFocus={false}
regex={(val) => val}
/>
</View>
<CustomPressable
title={"ثبت آدرس"}
title={profilePage ? "ذخیره اطلاعات و بازگشت به صفحه قبل" : "ثبت آدرس"}
backgroundColor={Colors.theme1[colorScheme].greenCF}
color={"white"}
border={{ color: "#196EC0", width: 0 }}
width={"100%"}
onPress={() => navigation.push("Address")}
onPress={() => profilePage ? submitProfile() : submit()}
/>
</View>
</ScrollView>
@ -308,12 +445,16 @@ const mapStateToProps = (state) => ({
city: state.publicApi.city,
loading: state.userAddress.loading,
cityLoading: state.publicApi.loading,
user: state.user.status,
profileFields: state.user.profileFields,
});
const mapDispatchToProps = {
getProvince: publicApi.getProvince,
getCity: publicApi.getCity,
createAddress: userAddress.add,
setProfileFields: user.setProfileFields,
setProfile: user.setProfile
};
export default connect(mapStateToProps, mapDispatchToProps)(Address);

Loading…
Cancel
Save