hamed
3 years ago
parent
19434004e0
commit
5169182cd8
30 changed files with 1010 additions and 50 deletions
|
After Width: | Height: | Size: 24 KiB |
@ -0,0 +1,23 @@ |
||||
import React from "react"; |
||||
import { View, StyleSheet, Dimensions } from "react-native"; |
||||
import Identifier from "./Identifier"; |
||||
|
||||
function component2D({ list, flexDirection }) { |
||||
return ( |
||||
<View style={[styles.container, { flexDirection: flexDirection }]}> |
||||
{list.map((item, i) => ( |
||||
<Identifier {...item} key={i} /> |
||||
))} |
||||
</View> |
||||
); |
||||
} |
||||
|
||||
const { width } = Dimensions.get("window"); |
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
// width,
|
||||
borderRadius: 10, |
||||
flex: 1 |
||||
} |
||||
}); |
||||
export default component2D; |
||||
@ -0,0 +1,24 @@ |
||||
import React from "react"; |
||||
import { View, StyleSheet, Dimensions } from "react-native"; |
||||
import Identifier from "./Identifier"; |
||||
|
||||
function component3D({ list }) { |
||||
return ( |
||||
<View style={styles.container}> |
||||
{list.map((item, i) => ( |
||||
<Identifier {...item} key={i} /> |
||||
))} |
||||
</View> |
||||
); |
||||
} |
||||
|
||||
const { width } = Dimensions.get("window"); |
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
// width,
|
||||
borderRadius: 10, |
||||
flex: 1, |
||||
flexDirection: "row-reverse" |
||||
} |
||||
}); |
||||
export default component3D; |
||||
@ -0,0 +1,38 @@ |
||||
import React from "react"; |
||||
import Carousel from "./carousel"; |
||||
import Component2D from "./2d"; |
||||
import Component3D from "./3d"; |
||||
import FlexAround from "./flexAround"; |
||||
import BackgroundTile from "./backgroundTile"; |
||||
import Shop from "./shop.js"; |
||||
|
||||
const Identifier = (item) => { |
||||
let component; |
||||
switch (item.name) { |
||||
case "carousel": |
||||
component = <Carousel list={item.list} />; |
||||
break; |
||||
case "2d": |
||||
component = ( |
||||
<Component2D list={item.items} flexDirection={item.flexDirection} /> |
||||
); |
||||
break; |
||||
case "3d": |
||||
component = <Component3D list={item.items} />; |
||||
break; |
||||
case "flex-around": |
||||
component = <FlexAround item={item} />; |
||||
break; |
||||
case "background-tile": |
||||
component = <BackgroundTile item={item} />; |
||||
break; |
||||
case "shop": |
||||
component = <Shop item={item} />; |
||||
break; |
||||
default: |
||||
component = null; |
||||
} |
||||
return <>{component}</>; |
||||
}; |
||||
|
||||
export default Identifier; |
||||
@ -0,0 +1,49 @@ |
||||
import React from "react"; |
||||
import { StyleSheet, View, Text, ImageBackground } from "react-native"; |
||||
|
||||
const backgroundTile = ({ item }) => { |
||||
return ( |
||||
<ImageBackground |
||||
source={{ uri: item.imageUrl }} |
||||
resizeMode="cover" |
||||
style={[styles.container, { flex: item.flex }]} |
||||
> |
||||
<View |
||||
style={[ |
||||
styles.cover, |
||||
{ backgroundColor: item.backgroundColor, alignItems: item.alignItems } |
||||
]} |
||||
> |
||||
<Text style={styles.title}>{item.title}</Text> |
||||
<Text style={styles.subTitle}>{item.subTitle}</Text> |
||||
</View> |
||||
</ImageBackground> |
||||
); |
||||
}; |
||||
|
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
margin: 5, |
||||
borderRadius: 10 |
||||
}, |
||||
cover: { |
||||
minHeight: "100%", |
||||
minWidth: "100%", |
||||
flexDirection: "column", |
||||
justifyContent: "center", |
||||
padding: 10, |
||||
borderRadius: 10 |
||||
}, |
||||
title: { |
||||
fontSize: 21, |
||||
fontWeight: 600, |
||||
marginBottom: 5, |
||||
color: "white" |
||||
}, |
||||
subTitle: { |
||||
fontSize: 14, |
||||
color: "white" |
||||
} |
||||
}); |
||||
|
||||
export default backgroundTile; |
||||
@ -0,0 +1,50 @@ |
||||
import React from "react"; |
||||
import { ImageBackground, Dimensions, StyleSheet, View } from "react-native"; |
||||
// import { SwiperFlatList } from "react-native-swiper-flatlist";
|
||||
|
||||
const Carousel = ({ list }) => { |
||||
return ( |
||||
<View style={styles.container}> |
||||
{/*<SwiperFlatList*/} |
||||
{/* autoplay*/} |
||||
{/* autoplayDelay={2}*/} |
||||
{/* autoplayLoop*/} |
||||
{/* index={2}*/} |
||||
{/* // showPagination*/} |
||||
{/* data={list}*/} |
||||
{/* renderItem={({ item }) => (*/} |
||||
{/* <View style={[styles.child]}>*/} |
||||
{/* <ImageBackground*/} |
||||
{/* source={{ uri: item.imageUrl }}*/} |
||||
{/* resizeMode="cover"*/} |
||||
{/* style={styles.image}*/} |
||||
{/* ></ImageBackground>*/} |
||||
{/* </View>*/} |
||||
{/* )}*/} |
||||
{/*/>*/} |
||||
</View> |
||||
); |
||||
}; |
||||
|
||||
const { width } = Dimensions.get("window"); |
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
minHeight: 300, |
||||
borderRadius: 10, |
||||
margin: 5 |
||||
}, |
||||
child: { |
||||
width, |
||||
justifyContent: "center", |
||||
borderRadius: 10, |
||||
alignItems: "center" |
||||
}, |
||||
image: { |
||||
width, |
||||
flex: 1, |
||||
justifyContent: "center", |
||||
borderRadius: 10 |
||||
} |
||||
}); |
||||
|
||||
export default Carousel; |
||||
@ -0,0 +1,52 @@ |
||||
import React from "react"; |
||||
import { StyleSheet, View, Text, Image } from "react-native"; |
||||
|
||||
const FlexAround = ({ item }) => { |
||||
return ( |
||||
<View |
||||
style={[ |
||||
styles.container, |
||||
{ flex: item.flex, backgroundColor: item.backgroundColor } |
||||
]} |
||||
> |
||||
<View style={[styles.column]}> |
||||
<Text style={styles.title}>{item.title}</Text> |
||||
<Text style={styles.subTitle}>{item.subTitle}</Text> |
||||
</View> |
||||
<Image source={{ uri: item.imageUrl }} style={styles.image} /> |
||||
</View> |
||||
); |
||||
}; |
||||
|
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
borderRadius: 10, |
||||
flex: 1, |
||||
paddingVertical: 30, |
||||
flexDirection: "row-reverse", |
||||
alignItems: "center", |
||||
justifyContent: "space-around", |
||||
textAlign: "right", |
||||
margin: 5 |
||||
}, |
||||
column: { |
||||
display: "flex", |
||||
flexDirection: "column" |
||||
}, |
||||
image: { |
||||
width: 60, |
||||
height: 60 |
||||
}, |
||||
title: { |
||||
fontSize: 21, |
||||
fontWeight: 600, |
||||
marginBottom: 5, |
||||
color: "white" |
||||
}, |
||||
subTitle: { |
||||
fontSize: 14, |
||||
color: "white" |
||||
} |
||||
}); |
||||
|
||||
export default FlexAround; |
||||
@ -0,0 +1,54 @@ |
||||
import React from "react"; |
||||
import { StyleSheet, View, Text, Image } from "react-native"; |
||||
|
||||
const Shop = ({ item }) => { |
||||
return ( |
||||
<View |
||||
style={[ |
||||
styles.container, |
||||
{ flex: item.flex, backgroundColor: item.backgroundColor } |
||||
]} |
||||
> |
||||
<Text style={styles.title}>{item.title}</Text> |
||||
|
||||
<View style={[styles.list]}> |
||||
{item.items.map((item1) => ( |
||||
<View> |
||||
<Image source={{ uri: item1.imageUrl }} style={styles.product} /> |
||||
</View> |
||||
))} |
||||
</View> |
||||
</View> |
||||
); |
||||
}; |
||||
|
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
borderRadius: 10, |
||||
flex: 1, |
||||
paddingVertical: 5, |
||||
paddingHorizontal: 10, |
||||
flexDirection: "column", |
||||
textAlign: "right", |
||||
margin: 5 |
||||
}, |
||||
list: { |
||||
display: "flex", |
||||
flexDirection: "row", |
||||
justifyContent: "space-around", |
||||
marginTop: 10 |
||||
}, |
||||
product: { |
||||
width: 50, |
||||
height: 65, |
||||
borderRadius: 10 |
||||
}, |
||||
title: { |
||||
fontSize: 18, |
||||
fontWeight: 600, |
||||
marginBottom: 5, |
||||
color: "white" |
||||
} |
||||
}); |
||||
|
||||
export default Shop; |
||||
@ -0,0 +1,140 @@ |
||||
const data = [ |
||||
{ |
||||
name: "carousel", |
||||
list: [ |
||||
{ |
||||
id: 0, |
||||
imageUrl: "https://dnvn.ir/api/v1/file/5299" |
||||
}, |
||||
{ |
||||
id: 1, |
||||
imageUrl: "https://dnvn.ir/api/v1/file/6581" |
||||
}, |
||||
{ |
||||
id: 2, |
||||
imageUrl: "https://dnvn.ir/api/v1/file/6586" |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name: "2d", |
||||
flexDirection: "row-reverse", |
||||
items: [ |
||||
{ |
||||
name: "flex-around", |
||||
title: "qr خوان", |
||||
subTitle: "در صفحات کتاب هوشمند", |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1855", |
||||
backgroundColor: "blue", |
||||
flex: 1 |
||||
}, |
||||
{ |
||||
name: "flex-around", |
||||
title: "واقعیت افزوده", |
||||
subTitle: "فعال شده و دیجیتال", |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1851", |
||||
backgroundColor: "green", |
||||
flex: 1 |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name: "2d", |
||||
flexDirection: "row-reverse", |
||||
items: [ |
||||
{ |
||||
name: "flex-around", |
||||
title: "qr خوان", |
||||
subTitle: "در صفحات کتاب هوشمند", |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1855", |
||||
backgroundColor: "blue", |
||||
flex: 1.6 |
||||
}, |
||||
{ |
||||
name: "background-tile", |
||||
title: "کتاب های من", |
||||
subTitle: "فعال شده و دیجیتال", |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1860", |
||||
backgroundColor: "#ff00ff77", |
||||
flex: 1, |
||||
alignItems: "flex-end" |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name: "2d", |
||||
flexDirection: "row-reverse", |
||||
items: [ |
||||
{ |
||||
name: "background-tile", |
||||
title: "بلاگ", |
||||
subTitle: "", |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1852", |
||||
backgroundColor: "#00ff0066", |
||||
flex: 1, |
||||
alignItems: "center" |
||||
}, |
||||
{ |
||||
name: "shop", |
||||
title: "فروشگاه", |
||||
backgroundColor: "#8888ff", |
||||
flex: 1.6, |
||||
items: [ |
||||
{ |
||||
id: 0, |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1857" |
||||
}, |
||||
{ |
||||
id: 1, |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1858" |
||||
}, |
||||
{ |
||||
id: 2, |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1859" |
||||
} |
||||
] |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name: "3d", |
||||
items: [ |
||||
{ |
||||
name: "2d", |
||||
flexDirection: "column", |
||||
items: [ |
||||
{ |
||||
name: "background-tile", |
||||
title: "پیگیری سفارشات", |
||||
subTitle: "", |
||||
imageUrl: "", |
||||
backgroundColor: "#ff5555", |
||||
flex: 1, |
||||
alignItems: "center" |
||||
}, |
||||
{ |
||||
name: "background-tile", |
||||
title: "پشتیبانی", |
||||
subTitle: "", |
||||
imageUrl: "", |
||||
backgroundColor: "#ffaa00", |
||||
flex: 1, |
||||
alignItems: "center" |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
name: "background-tile", |
||||
title: "بلاگ", |
||||
subTitle: "", |
||||
imageUrl: "https://dnvn.ir/api/v1/file/1853", |
||||
backgroundColor: "#00ffff66", |
||||
flex: 1, |
||||
alignItems: "center" |
||||
} |
||||
] |
||||
} |
||||
]; |
||||
|
||||
export default data; |
||||
|
||||
@ -1,13 +1,27 @@ |
||||
import React from 'react' |
||||
import { View, Text } from 'react-native'; |
||||
import {connect} from 'react-redux'; |
||||
import React from "react"; |
||||
import { View, StyleSheet, Dimensions, ScrollView } from "react-native"; |
||||
import data from "./data"; |
||||
import Identifier from "./components/Identifier"; |
||||
|
||||
function Home({}) { |
||||
// Within your render function
|
||||
function Home() { |
||||
return ( |
||||
<View> |
||||
<Text></Text> |
||||
</View> |
||||
) |
||||
<ScrollView style={styles.container}> |
||||
{data?.map((item, i) => ( |
||||
<Identifier {...item} key={i} /> |
||||
))} |
||||
</ScrollView> |
||||
); |
||||
} |
||||
|
||||
// Later on in your styles..
|
||||
const styles = StyleSheet.create({ |
||||
container: { |
||||
width: Dimensions.get("window").width, |
||||
backgroundColor: "white", |
||||
flexDirection: "column", |
||||
padding: 5 |
||||
} |
||||
}); |
||||
|
||||
export default Home; |
||||
|
||||
@ -0,0 +1,46 @@ |
||||
import React from "react"; |
||||
|
||||
import { Button, StyleSheet, Text, View, Dimensions } from "react-native"; |
||||
|
||||
function App() { |
||||
return ( |
||||
<View style={styles.navbar}> |
||||
<View style={[styles.flex, styles.row, styles.alignCenter]}> |
||||
<Text style={styles.head}>دانوین</Text> |
||||
</View> |
||||
<Button title="ورود" color="#6cbe44" /> |
||||
</View> |
||||
); |
||||
} |
||||
|
||||
const styles = StyleSheet.create({ |
||||
navbar: { |
||||
position: "fixed", |
||||
display: "flex", |
||||
paddingHorizontal: 10, |
||||
flexDirection: "row-reverse", |
||||
left: 0, |
||||
top: 0, |
||||
width: Dimensions.get("window").width, |
||||
height: 60, |
||||
backgroundColor: "#ccc", |
||||
justifyContent: "space-between", |
||||
alignItems: "center" |
||||
}, |
||||
head: { |
||||
fontWeight: "bold", |
||||
fontSize: 20, |
||||
marginRight: 10 |
||||
}, |
||||
flex: { |
||||
display: "flex" |
||||
}, |
||||
row: { |
||||
flexDirection: "row-reverse" |
||||
}, |
||||
alignCenter: { |
||||
alignItems: "center" |
||||
} |
||||
}); |
||||
|
||||
export default App; |
||||
@ -0,0 +1,17 @@ |
||||
import React from 'react'; |
||||
import {Image, Dimensions} from "react-native"; |
||||
|
||||
const {width} = Dimensions.get('window') |
||||
|
||||
function IranFlag() { |
||||
return ( |
||||
<Image source={{uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAUCAYAAACaq43EAAAABHNCSVQICAgIfAhkiAAAAiBJREFUSEvtVkFrU0EQ/mb3vTRJ08bURAVFA4K0CIKCNw8WQQQPKqj/oN56qgePnv0Vnjy0YPAiItWLFw8VtWhF9BClGE3S5tnmxaR5u+PuPgIKSnlQ46UDww6zM/PtNztveTR3HwEIeQxRBHCS5irgIWI6KAKmd4GH0nXX6sWVO+6Ou9F3p2kvj0LmCD6uPcXB8VO/+X89lY2rbS4jnz6ErD/h4npGD4ydQOvHJ2z2aiiNTrqUQV1rV1vPUMxOzlC1/uKD4khJ8qRd7aa1NVQkID3rE+QJc0oaxLkBqX0TNDYOlcsozZG2OWyEjPwtZ5D/ZWN5lsIwTDTV4u076GIR/uMn6J8/B9FsQh+fSnpFpxMBU70B+XwJ+mgZqYUH6N6chf9oEWrqWFLwZMCWrah+hi4fjoFv34I/X3Fs+9evJGGdDNgxfv0G1AogV94jOnsG7ElwYc+/ZewotUN4Sy+RunvPAW9dvQTkRpOwtbGGcRB8hVJbkNI3a99VEDJFWndZihHrM4OqWcS2266uZtHeUBDCM4PVBbOxTY5ZWZBwcSQkBratzeal1DGObKzfoN58hanTAYUd6FLR3SGX9gIjKdBqzdm03gKUju3GGnhfMX5zbU4mbTDMs8+mslGdy5kdY7fbloDzW+H9JVC9abQBnijMEF+8luhzStrTP8YTT+8C70gnty3y31rN5g+EL1wuw/PK255ypwI0BfRw4dVPHMAgJ7WnxBQAAAAASUVORK5CYII='}} |
||||
style={{ |
||||
width: width / 8, |
||||
height: width / 8 / 1.5, |
||||
left: 5 |
||||
}} /> |
||||
) |
||||
} |
||||
|
||||
export default IranFlag; |
||||
@ -0,0 +1,10 @@ |
||||
import mocks from './mocks'; |
||||
import mainServices from './services'; |
||||
|
||||
const mock = false; |
||||
|
||||
let services = {...mainServices}; |
||||
if (mock) { |
||||
services = mocks; |
||||
} |
||||
export default services; |
||||
@ -0,0 +1,18 @@ |
||||
import { asyncAwesomeAlert, randomApiSleep } from '../../../utils/AsyncWrappers'; |
||||
|
||||
const data = { |
||||
|
||||
}; |
||||
|
||||
const getSmsCode = async () => { |
||||
await randomApiSleep(); |
||||
return { |
||||
ok: true, |
||||
data: data |
||||
}; |
||||
}; |
||||
|
||||
|
||||
|
||||
const mocks = {getSmsCode}; |
||||
export default mocks; |
||||
@ -0,0 +1,13 @@ |
||||
import {nextFetchApi} from '../../../services/api'; |
||||
const getSmsCode = async (obj) => { |
||||
return await nextFetchApi('/public/sendOTP', { |
||||
method: 'POST', |
||||
payload: obj |
||||
}); |
||||
}; |
||||
|
||||
const mainServices = { |
||||
getSmsCode, |
||||
}; |
||||
|
||||
export default mainServices; |
||||
@ -1,13 +1,203 @@ |
||||
import React from 'react' |
||||
import { View, Text } from 'react-native'; |
||||
import React, {useEffect, useState} from 'react' |
||||
import {View, Text, Image, TextInput, TouchableHighlight, Dimensions, StyleSheet, TouchableOpacity} from 'react-native'; |
||||
import {connect} from 'react-redux'; |
||||
import Logo from "../../assets/images/logo.png"; |
||||
import IranFlag from "../Login/components/IranFlag"; |
||||
import {digitToEn, digitToPersian} from "../../utils"; |
||||
import services from "./services"; |
||||
|
||||
const {width} = Dimensions.get('window') |
||||
let ref1; |
||||
let ref2; |
||||
let ref3; |
||||
let ref4; |
||||
|
||||
let timer = 60; |
||||
function Otp(props) { |
||||
let faNums = ['۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹', '۰'] |
||||
|
||||
const [firstCode, setFirstCode] = useState(''); |
||||
const [secondCode, setSecondCode] = useState(''); |
||||
const [thirdCode, setThirdCode] = useState(''); |
||||
const [fourthCode, setFourthCode] = useState(''); |
||||
const [time, setTime] = useState(60); |
||||
|
||||
const checkValue = (value) => { |
||||
return faNums.includes(digitToPersian(value)); |
||||
} |
||||
|
||||
const onChangeCode = (value, key) => { |
||||
// if (!checkValue()) {
|
||||
// return
|
||||
// }
|
||||
switch (key) { |
||||
case '1': |
||||
setFirstCode(digitToPersian(value)); |
||||
ref2.focus(); |
||||
break; |
||||
case '2': |
||||
setSecondCode(digitToPersian(value)); |
||||
ref3.focus(); |
||||
break; |
||||
case '3': |
||||
setThirdCode(digitToPersian(value)); |
||||
ref4.focus(); |
||||
break; |
||||
case '4': |
||||
setFourthCode(digitToPersian(value)) |
||||
break; |
||||
} |
||||
} |
||||
|
||||
const getEnCode = () => { |
||||
return Number(digitToEn(firstCode) + digitToEn(secondCode) + digitToEn(thirdCode) + digitToEn(fourthCode)) |
||||
} |
||||
|
||||
const submit = async () => { |
||||
let res = await services.sendOtpCode({ |
||||
cellphone: props.route.params.phone, |
||||
otp: getEnCode() |
||||
}) |
||||
if (res.ok) { |
||||
console.log(res) |
||||
} |
||||
} |
||||
|
||||
useEffect(() => { |
||||
let interval = setInterval(() => { |
||||
if (time > 0) { |
||||
setTime(timer - 1); |
||||
timer -= 1; |
||||
} |
||||
}, 1000); |
||||
let timeout = setTimeout(() => { |
||||
clearInterval(interval) |
||||
}, 60000) |
||||
return () => { |
||||
clearInterval(interval); |
||||
clearTimeout(timeout) |
||||
} |
||||
}, []); |
||||
|
||||
function Otp({}) { |
||||
return ( |
||||
<View> |
||||
<Text></Text> |
||||
<View style={{ |
||||
flex: 1, |
||||
justifyContent: 'center', |
||||
alignItems: 'center', |
||||
backgroundColor: 'white' |
||||
}}> |
||||
<Image source={Logo} style={{ |
||||
width: width * 0.7, |
||||
height: width * 0.7 / 2.09, |
||||
}} /> |
||||
<Text style={{ |
||||
width: width, |
||||
paddingHorizontal: 10, |
||||
marginTop: 20, |
||||
fontSize: 20, |
||||
textAlign: 'right', |
||||
}}>{'دانوین'}</Text> |
||||
<Text style={{ |
||||
width: width, |
||||
paddingHorizontal: 10, |
||||
marginTop: 10, |
||||
fontSize: 14, |
||||
color: '#6f7074', |
||||
textAlign: 'right', |
||||
}}>{`یک کد تائیدیه به شماره ${props.route.params.phone} ارسال شد. آن را در قسمت زیر وارد کنید`}</Text> |
||||
<View style={{ |
||||
width: width - 10, |
||||
height: width / 8, |
||||
borderRadius: 8, |
||||
flexDirection: 'row', |
||||
marginTop: 10, |
||||
alignItems: 'center', |
||||
justifyContent: 'space-evenly' |
||||
}}> |
||||
<TextInput |
||||
style={styles.input} |
||||
underlineColorAndroid={'transparent'} |
||||
value={firstCode} |
||||
maxLength={1} |
||||
ref={ref => ref1 = ref} |
||||
onChangeText={text => onChangeCode(text, '1')} |
||||
/> |
||||
<TextInput |
||||
style={styles.input} |
||||
underlineColorAndroid={'transparent'} |
||||
value={secondCode} |
||||
maxLength={1} |
||||
ref={ref => ref2 = ref} |
||||
onChangeText={text => onChangeCode(text, '2')} |
||||
/> |
||||
<TextInput |
||||
style={styles.input} |
||||
underlineColorAndroid={'transparent'} |
||||
value={thirdCode} |
||||
maxLength={1} |
||||
ref={ref => ref3 = ref} |
||||
onChangeText={text => onChangeCode(text, '3')} |
||||
/> |
||||
<TextInput |
||||
style={styles.input} |
||||
underlineColorAndroid={'transparent'} |
||||
value={fourthCode} |
||||
maxLength={1} |
||||
ref={ref => ref4 = ref} |
||||
onChangeText={text => onChangeCode(text, '4')} |
||||
/> |
||||
</View> |
||||
<TouchableOpacity |
||||
style={{ |
||||
width: width - 10, |
||||
height: width / 9, |
||||
backgroundColor: '#6cbe44', |
||||
alignItems: 'center', |
||||
justifyContent: 'center', |
||||
borderRadius: 10, |
||||
marginTop: 15, |
||||
}} |
||||
onPress={() => submit()}> |
||||
<Text style={{ |
||||
color: 'white', |
||||
fontSize: 18, |
||||
}}> |
||||
{'ثبت'} |
||||
</Text> |
||||
</TouchableOpacity> |
||||
<View> |
||||
<Text style={{marginTop: 30, textAlign: 'center'}}> |
||||
{'زمان باقی مانده تا انقضای کد: ' + time} |
||||
</Text> |
||||
<TouchableOpacity |
||||
style={{ |
||||
marginTop: 20, |
||||
}} |
||||
onPress={() => { |
||||
if (time !== 0) { |
||||
return |
||||
} |
||||
props.navigation.goBack(); |
||||
}}> |
||||
<Text style={{textAlign: 'center'}}> |
||||
{'بازگشت به مرحله قبل و اصلاح شماره'} |
||||
</Text> |
||||
</TouchableOpacity> |
||||
</View> |
||||
</View> |
||||
) |
||||
} |
||||
|
||||
const styles = StyleSheet.create({ |
||||
input: { |
||||
width: width / 13 * 2, |
||||
height: width / 16 * 2, |
||||
backgroundColor: '#a2a2a2', |
||||
color: '#333', |
||||
fontSize: 22, |
||||
borderRadius: 8, |
||||
textAlign: 'center' |
||||
} |
||||
}) |
||||
|
||||
export default Otp; |
||||
|
||||
@ -0,0 +1,10 @@ |
||||
import mocks from './mocks'; |
||||
import mainServices from './services'; |
||||
|
||||
const mock = false; |
||||
|
||||
let services = {...mainServices}; |
||||
if (mock) { |
||||
services = mocks; |
||||
} |
||||
export default services; |
||||
@ -0,0 +1,18 @@ |
||||
import { asyncAwesomeAlert, randomApiSleep } from '../../../utils/AsyncWrappers'; |
||||
|
||||
const data = { |
||||
|
||||
}; |
||||
|
||||
const sendOtpCode = async () => { |
||||
await randomApiSleep(); |
||||
return { |
||||
ok: true, |
||||
data: data |
||||
}; |
||||
}; |
||||
|
||||
|
||||
|
||||
const mocks = {sendOtpCode}; |
||||
export default mocks; |
||||
@ -0,0 +1,13 @@ |
||||
import {nextFetchApi} from '../../../services/api'; |
||||
const sendOtpCode = async (obj) => { |
||||
return await nextFetchApi('/user/otp/login', { |
||||
method: 'POST', |
||||
payload: obj |
||||
}); |
||||
}; |
||||
|
||||
const mainServices = { |
||||
sendOtpCode, |
||||
}; |
||||
|
||||
export default mainServices; |
||||
@ -1,4 +1,3 @@ |
||||
export default { |
||||
dev: 'https://dnvn.ir/api/v1/', |
||||
splash: 'https://topsito.ir/api/v1.1', |
||||
dev: 'https://dnvn.ir/api/v1', |
||||
}; |
||||
|
||||
@ -0,0 +1,23 @@ |
||||
export const digitToPersian = (digit) => { |
||||
let enNums = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'] |
||||
let faNums = ['۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹', '۰'] |
||||
let digitString = digit + ''; |
||||
let digitArray = digitString.split(''); |
||||
for (let i in digitArray) { |
||||
if (enNums.includes(digitArray[i])) |
||||
digitArray[i] = faNums[enNums.indexOf(digitArray[i])] |
||||
} |
||||
return digitArray.join('') |
||||
} |
||||
|
||||
export const digitToEn = (digit) => { |
||||
let enNums = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'] |
||||
let faNums = ['۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹', '۰'] |
||||
let digitString = digit + ''; |
||||
let digitArray = digitString.split(''); |
||||
for (let i in digitArray) { |
||||
if (faNums.includes(digitArray[i])) |
||||
digitArray[i] = enNums[faNums.indexOf(digitArray[i])] |
||||
} |
||||
return digitArray.join('') |
||||
} |
||||
Loading…
Reference in new issue