Reza_ashrafi
/
RnDanovinExpo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

reza added resend button

Browse Source
master
Reza_ashrafi 3 years ago
parent 2870905357
commit 12859f5f83
6 changed files with 130 additions and 70 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/redux/reducers/user.js
  2. 5
      src/screens/Faq/index.js
  3. 18
      src/screens/Home/components/MyBooks.js
  4. 153
      src/screens/Otp/index.js
  5. 20
      src/screens/Profile/components/User.js

2
src/redux/reducers/user.js
Unescape View File

@ -59,7 +59,7 @@ const user = (state = initialState, action) => {
return { ...state, loading: false, error: null, setDone: true }; return { ...state, loading: false, error: null, setDone: true };
case "user/setProfileFields": case "user/setProfileFields":
return { ...state, loading: false, error: null, profileFields: data }; return { ...state, loading: false, error: null, profileFields: data };
case "loading": case "user/loading":
return { ...state, loading: true }; return { ...state, loading: true };
case "error": case "error":
asyncAwesomeAlert("خطا", data.message, { asyncAwesomeAlert("خطا", data.message, {

5
src/screens/Faq/index.js
Unescape View File

@ -23,7 +23,7 @@ import Instance from "./components/Instance";
//assets //assets
import bgFaq from "./assets/faq.png"; import bgFaq from "./assets/faq.png";
const width = Dimensions.get("window").width; const {width, height} = Dimensions.get("window");
function Faq({ list, getFaq, searchResult, search, selectFaq, searchFaq }) { function Faq({ list, getFaq, searchResult, search, selectFaq, searchFaq }) {
useEffect(() => { useEffect(() => {
@ -64,7 +64,8 @@ function Faq({ list, getFaq, searchResult, search, selectFaq, searchFaq }) {
/> />
</View> </View>
<ScrollView <ScrollView
style={[tw("bg-white flex pb-20 px-4 mb-4")]} style={[tw("bg-white flex px-4 mb-4")]}
contentContainerStyle={{paddingBottom: height / 2.4}}
> >
{!search {!search
? list.length > 0 && ? list.length > 0 &&

18
src/screens/Home/components/MyBooks.js
Unescape View File

@ -1,11 +1,4 @@
import { import { View, Text, Image, Pressable, FlatList, Platform } from "react-native";
View,
Text,
Image,
Pressable,
FlatList,
Platform,
} from "react-native";
import { connect } from "react-redux"; import { connect } from "react-redux";
//components //components
@ -19,7 +12,7 @@ import fontSize from "../../../constants/fontSize";
const ios = Platform.OS === "ios"; const ios = Platform.OS === "ios";
function MyBooks({ books, grades, theme }) { function MyBooks({ books, grades, theme }) {
return ( return books.length && (
<View style={[tw("flex w-full mb-5")]}> <View style={[tw("flex w-full mb-5")]}>
<View <View
style={[ style={[
@ -43,13 +36,16 @@ function MyBooks({ books, grades, theme }) {
> >
کتابهای من کتابهای من
</Text> </Text>
<FlatList <FlatList
showsHorizontalScrollIndicator={false} showsHorizontalScrollIndicator={false}
style={[tw("py-3")]} style={[tw("py-3")]}
horizontal={true} horizontal={true}
inverted={true} inverted={true}
data={books} data={books}
renderItem={({ item }) => <Book book={item} grades={grades} theme={theme} />} renderItem={({ item }) => (
<Book book={item} grades={grades} theme={theme} />
)}
keyExtractor={(book) => book?.id} keyExtractor={(book) => book?.id}
/> />
</View> </View>
@ -108,7 +104,7 @@ const Book = ({ book, grades, theme }) => {
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
grades: state.publicApi.grades, grades: state.publicApi.grades,
theme: state.publicApi.theme theme: state.publicApi.theme,
}); });
export default connect(mapStateToProps)(MyBooks); export default connect(mapStateToProps)(MyBooks);

153
src/screens/Otp/index.js
Unescape View File

@ -11,6 +11,7 @@ import {
import tw from "tailwind-rn"; import tw from "tailwind-rn";
import { connect } from "react-redux"; import { connect } from "react-redux";
import Svg, { Defs, Pattern, Image, Path } from "react-native-svg"; import Svg, { Defs, Pattern, Image, Path } from "react-native-svg";
import { asyncAwesomeAlert } from "../../utils/AsyncWrappers";
import { digitToEn } from "../../utils"; import { digitToEn } from "../../utils";
import onInput from "../../utils/onInput"; import onInput from "../../utils/onInput";
import { user } from "../../redux/actions"; import { user } from "../../redux/actions";
@ -25,14 +26,14 @@ let ref2;
let ref3; let ref3;
let ref4; let ref4;
let timer = 60; let timer = 120;
function Otp(props) { function Otp(props) {
const [firstCode, setFirstCode] = useState(""); const [firstCode, setFirstCode] = useState("");
const [secondCode, setSecondCode] = useState(""); const [secondCode, setSecondCode] = useState("");
const [thirdCode, setThirdCode] = useState(""); const [thirdCode, setThirdCode] = useState("");
const [fourthCode, setFourthCode] = useState(""); const [fourthCode, setFourthCode] = useState("");
const [time, setTime] = useState(60); const [time, setTime] = useState(120);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [timeEnd, setTimeEnd] = useState(false); const [timeEnd, setTimeEnd] = useState(false);
@ -86,47 +87,87 @@ function Otp(props) {
}; };
const submit = async () => { const submit = async () => {
setLoading(true); if (firstCode && secondCode && thirdCode && fourthCode) {
props.sendOtp({ props.sendOtp({
cellphone: props.route.params?.phone, cellphone: props.route.params?.phone,
otp: String(getEnCode()), otp: String(getEnCode()),
applicationToken: "1", applicationToken: "1",
userToken: "1", userToken: "1",
}); });
setLoading(false); } else {
asyncAwesomeAlert("خطا", "کد تاییدیه را کامل وارد کنید.", {
showCancelButton: false,
});
}
}; };
useEffect(() => { useEffect(() => {
ref1.focus(); ref1.focus();
let interval = setInterval(() => { }, []);
if (time > 0) {
setTime(timer - 1); useEffect(() => {
timer -= 1; if (!timeEnd) {
} let interval = setInterval(() => {
}, 1000); if (time > 0) {
let timeout = setTimeout(() => { setTime(timer - 1);
clearInterval(interval); timer -= 1;
setTimeEnd(true); }
}, 60000); }, 1000);
return () => { let timeout = setTimeout(() => {
clearInterval(interval); clearInterval(interval);
clearTimeout(timeout); setTimeEnd(true);
}; }, 10000);
return () => {
clearInterval(interval);
clearTimeout(timeout);
};
}
}, [timeEnd]);
const duration = React.useCallback(
(value) => {
const minute = value % 60;
const hour = Math.floor(value / 60);
return (
(hour > 0
? (hour.toString().length === 1 ? "0" + hour.toString() : hour) + ""
: "") +
":" +
(minute.toString().length === 1 ? "0" + minute.toString() : minute)
);
},
[props.route]
);
const submitCellphone = React.useCallback(() => {
setTimeEnd(false);
setTime(120);
setFirstCode("");
setSecondCode("");
setThirdCode("");
setFourthCode("");
props.sendCellphone({ cellphone: props.cellphone });
timer = 120;
}, []); }, []);
useEffect(() => { useEffect(() => {
if (props.isLogin) { if (props.isLogin) {
props.navigation.navigate('Root'); props.navigation.navigate("Root");
} }
}, [props.isLogin]); }, [props.isLogin]);
const goBack = () => { const goBack = () => {
timer = 60; timer = 120;
props.navigation.navigate("Login"); props.navigation.navigate("Login");
}; };
return ( return (
<View style={[tw("px-4 flex-1 justify-center items-center bg-white"), {minHeight: height}]}> <View
style={[
tw("px-4 flex-1 justify-center items-center bg-white"),
{ minHeight: height },
]}
>
<Svg <Svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink" xmlnsXlink="http://www.w3.org/1999/xlink"
@ -165,7 +206,8 @@ function Otp(props) {
}, },
]} ]}
> >
یک کد تائیدیه به شماره{" "} {" "}
یک کد تائیدیه به شماره
<Text <Text
style={{ style={{
color: Colors.theme1[props.theme].greenCF, color: Colors.theme1[props.theme].greenCF,
@ -174,7 +216,7 @@ function Otp(props) {
}} }}
> >
{props.route.params?.phone || "09123456789"} {props.route.params?.phone || "09123456789"}
</Text>{" "} </Text>
ارسال شد. آن را در قسمت زیر وارد کنید. ارسال شد. آن را در قسمت زیر وارد کنید.
</Text> </Text>
<View <View
@ -299,26 +341,46 @@ function Otp(props) {
}, },
]} ]}
> >
{"زمان باقی مانده تا ارسال مجدد: " + time} {"زمان باقی مانده تا ارسال مجدد: " + duration(time)}
</Text> </Text>
) : ( ) : (
<TouchableOpacity <View style={tw("flex")}>
style={{ <TouchableOpacity
marginTop: 30,
}}
onPress={() => goBack()}
>
<Text
style={{ style={{
textAlign: "center", marginTop: 30,
fontFamily: "light", }}
fontSize: fontSize.base, onPress={() => submitCellphone()}
color: Colors.theme1[props.theme].greenBA, >
<Text
style={{
textAlign: "center",
fontFamily: "light",
fontSize: fontSize.base,
color: Colors.theme1[props.theme].greenBA,
}}
>
{"ارسال مجدد کد"}
</Text>
</TouchableOpacity>
<TouchableOpacity
style={{
marginTop: 10,
}} }}
onPress={() => goBack()}
> >
{"بازگشت به مرحله قبل و اصلاح شماره"} <Text
</Text> style={{
</TouchableOpacity> textAlign: "center",
fontFamily: "light",
fontSize: fontSize.base,
color: Colors.theme1[props.theme].greenBA,
}}
>
{"بازگشت به مرحله قبل و اصلاح شماره"}
</Text>
</TouchableOpacity>
</View>
)} )}
</View> </View>
</View> </View>
@ -328,11 +390,12 @@ function Otp(props) {
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
isLogin: state.user.status, isLogin: state.user.status,
mobile: state.publicApi.mobile, mobile: state.publicApi.mobile,
theme: state.publicApi.theme theme: state.publicApi.theme,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {
sendOtp: user.otp_login, sendOtp: user.otp_login,
sendCellphone: user.otp,
}; };
export default connect(mapStateToProps, mapDispatchToProps)(Otp); export default connect(mapStateToProps, mapDispatchToProps)(Otp);

20
src/screens/Profile/components/User.js
Unescape View File

@ -1,13 +1,8 @@
import { import { View, Text, Image, Platform, Pressable } from "react-native";
View,
Text,
Image,
Platform,
Pressable,
} from "react-native";
import React from "react"; import React from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import Svg, { Path } from "react-native-svg"; import Svg, { Path } from "react-native-svg";
import { asyncAwesomeAlert } from "../../../utils/AsyncWrappers";
//style //style
import tw from "tailwind-rn"; import tw from "tailwind-rn";
@ -84,12 +79,17 @@ const User = ({ user, mobile, theme }) => {
</Svg> </Svg>
</Pressable> </Pressable>
{dropdown && ( {dropdown && (
<View <Pressable
style={tw( style={tw(
`flex w-full pr-16 ${ios ? "items-end" : " "} ${ `flex w-full pr-16 ${ios ? "items-end" : " "} ${
mobile ? "mt-0" : "mt-4" mobile ? "mt-0" : "mt-4"
}` }`
)} )}
onPress={() =>
asyncAwesomeAlert("نتیجه", "این قابلیت در حال توسعه است.", {
showCancelButton: false,
})
}
> >
<View <View
style={[ style={[
@ -121,7 +121,7 @@ const User = ({ user, mobile, theme }) => {
+ +
</Text> </Text>
</View> </View>
</View> </Pressable>
)} )}
</View> </View>
); );
@ -130,7 +130,7 @@ const User = ({ user, mobile, theme }) => {
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
user: state.user.status, user: state.user.status,
mobile: state.publicApi.mobile, mobile: state.publicApi.mobile,
theme: state.publicApi.theme theme: state.publicApi.theme,
}); });
export default connect(mapStateToProps)(User); export default connect(mapStateToProps)(User);

Write Preview
Loading…
Cancel
Save