Commit a9f6004b authored by Wahyu Adjie Prasetyo's avatar Wahyu Adjie Prasetyo

change design email confirmation , new password, reset password (1)

parent 9716706f
...@@ -110,13 +110,22 @@ class Auth extends React.Component { ...@@ -110,13 +110,22 @@ class Auth extends React.Component {
{ {
this.props.session_id === '' ? ( this.props.session_id === '' ? (
<> <>
{/* <Stack.Screen name="Change language" component={ChangeLanguage} /> */}
<Stack.Screen name="Login" component={Login} options={{ headerShown: false }} /> <Stack.Screen name="Login" component={Login} options={{ headerShown: false }} />
<Stack.Screen name="Home" component={Home} /> <Stack.Screen name="Home" component={Home} />
<Stack.Screen name="Profile" component={ProfilePage} /> <Stack.Screen name="Profile" component={ProfilePage} />
<Stack.Screen name="Change Profil" component={ChangeProfile} /> <Stack.Screen name="Change Profil" component={ChangeProfile} />
<Stack.Screen name="Register" component={Register} /> <Stack.Screen name="Register" component={Register} />
<Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> {/* <Stack.Screen name="Change language" component={ChangeLanguage} /> */}
<Stack.Screen name="Email Confirmation" component={EmailConfirmation} options={{headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign:'center',
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
color: 'white',
textAlign: 'center'
},title:'EMAIL CONFIRMATION'}} />
</> </>
) : this.props.pageEmailConfirmation === true ? ( ) : this.props.pageEmailConfirmation === true ? (
<> <>
...@@ -174,7 +183,20 @@ class Auth extends React.Component { ...@@ -174,7 +183,20 @@ class Auth extends React.Component {
} }
<Stack.Screen name="New Password" component={NewPassword} /> <Stack.Screen name="New Password" component={NewPassword} options={{
headerStyle: { backgroundColor: "#ccb46c" },
headerBackTitleStyle: { color: 'white' },
headerTitleAlign:'center',
headerTintColor: '#fff',
headerTitleStyle: {
textAlign: 'center',
fontSize: 15,
fontFamily: 'Gotham-Black',
color: 'white'
},
headerTitle: 'New'
}} />
{/* <Stack.Screen name="Login" component={Login} /> */} {/* <Stack.Screen name="Login" component={Login} /> */}
<Stack.Screen name="Reset Password" component={ResetPassword} <Stack.Screen name="Reset Password" component={ResetPassword}
options={{ options={{
...@@ -210,10 +232,11 @@ class Auth extends React.Component { ...@@ -210,10 +232,11 @@ class Auth extends React.Component {
headerStyle: { backgroundColor: "#ccb46c" }, headerStyle: { backgroundColor: "#ccb46c" },
headerBackTitleStyle: { color: 'white' }, headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff', headerTintColor: '#fff',
headerTitleAlign:'center',
headerTitleStyle: { headerTitleStyle: {
fontFamily: 'Gotham-Black', fontFamily: 'Gotham-Black',
color: 'white', color: 'white',
fontSize: 30, fontSize: 20,
}, },
title: 'REGISTER' title: 'REGISTER'
}} /> }} />
......
import * as React from 'react'; import * as React from 'react';
import { Button, View, Text, StyleSheet, TextInput, Alert } from 'react-native'; import { Button, View, Text, StyleSheet, TextInput, Alert, Image } from 'react-native';
import { TouchableOpacity } from 'react-native-gesture-handler'; import { TouchableOpacity } from 'react-native-gesture-handler';
import Axios from 'axios'; import Axios from 'axios';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
...@@ -161,28 +161,45 @@ class EmailConfirmation extends React.Component { ...@@ -161,28 +161,45 @@ class EmailConfirmation extends React.Component {
textContent={'Loading...'} textContent={'Loading...'}
textStyle={styles.spinnerTextStyle} textStyle={styles.spinnerTextStyle}
/> />
<View style={{ margin: 10, top: 10 }}> <View style={{ flex: 3 }}>
<TextInput <View style={{ flex: 1, marginRight: 30, marginLeft: 30, top: 60 }}>
style={{ height: 40, borderColor: 'gray', borderWidth: 1, padding: 5 }} <Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3 }}>Token</Text>
onChangeText={(confirmation_number) => this.setState({ confirmation_number })} <TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10, borderRadius: 10, borderColor: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', color: 'grey', fontWeight: 'bold', fontSize: 20 }}
value={this.state.confirmation_number} onChangeText={(confirmation_number) => this.setState({ confirmation_number })}
/> value={this.state.confirmation_number}
autoCapitalize="none"
value={this.state.email}
keyboardType='email-address' />
<TouchableOpacity style={{ height: 100 }} onPress={() => this.handleSubmit()}>
<View style={{ backgroundColor: '#CFB368', height: 45, top: 10, borderRadius: 10, marginRight: 50, marginLeft: 50 }}>
<Text style={{ alignSelf: 'center', top: 10, color: 'white', fontFamily: 'Gotham-Black', fontSize: 20 }}>SUBMIT</Text>
</View>
</TouchableOpacity>
<TouchableOpacity style={{ height: 100 }} onPress={() => this.handleCancel()}>
<View style={{ backgroundColor: '#CFB368', height: 45, top: 10, borderRadius: 10, marginRight: 50, marginLeft: 50 }}>
<Text style={{ alignSelf: 'center', top: 10, color: 'white', fontFamily: 'Gotham-Black', fontSize: 20 }}>CANCEL</Text>
</View>
</TouchableOpacity>
<TouchableOpacity style={{ height: 60}} onPress={() => this.handleResend()}>
<Text style={{ alignSelf: 'center', color: '#CFB368', fontFamily: 'Gotham-Black', fontSize: 20 ,top:10}}>RESEND EMAIL TOKEN</Text>
</TouchableOpacity>
<TouchableOpacity style={{ height: 60}} onPress={() => this.props.navigation.navigate('Change Email')}>
<Text style={{ alignSelf: 'center', color: '#CFB368', fontFamily: 'Gotham-Black', fontSize: 20, }}>CHANGE EMAIL</Text>
</TouchableOpacity>
</View>
</View> </View>
<View style={{ margin: 10 }}> <View style={{ flex: 1, flexDirection: 'row' }}>
<Button title="Submit" onPress={() => this.handleSubmit()} /> <View style={styles.v_logo}>
</View> <View style={{ flex: 1, alignSelf: 'flex-start' }}>
<View style={{ margin: 10 }}> <Image resizeMode="contain" source={require('../assets/images/daun.png')} style={styles.logo}></Image>
<Button title="Cancel" onPress={() => this.handleCancel()} /> </View>
</View> <View style={{ flex: 1 }}>
<View>
<TouchableOpacity onPress={() => this.handleResend()}> </View>
<Text style={{ color: 'red', textAlign: 'center' }}>Resend email token</Text> </View>
</TouchableOpacity>
</View> <View style={{ flex: 0.5 }}>
<View> </View>
<TouchableOpacity onPress={() => this.props.navigation.navigate('Change Email')}>
<Text style={{ color: 'red', textAlign: 'center' }}> Change email</Text>
</TouchableOpacity>
</View> </View>
</View> </View>
) )
...@@ -191,9 +208,45 @@ class EmailConfirmation extends React.Component { ...@@ -191,9 +208,45 @@ class EmailConfirmation extends React.Component {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
flex: 1, flex: 1,
backgroundColor: 'white' backgroundColor: '#ffff'
},
header: {
flex: 0.5,
margin: 10,
},
form: {
flex: 3,
top: 40,
margin: 10,
marginTop: 0,
},
field_email: {
flexDirection: 'row'
},
button: {
height: 40,
margin: 10,
},
logo: {
alignSelf: 'flex-start',
marginTop: 50,
width: 290,
height: 290,
bottom: 145,
},
v_logo: {
flex: 2,
flexDirection: 'column-reverse',
alignContent: 'flex-start',
} }
}) })
...@@ -248,4 +301,34 @@ const mapDispatchToProps = (dispacth) => { ...@@ -248,4 +301,34 @@ const mapDispatchToProps = (dispacth) => {
} }
export default connect(mapStateToProps,mapDispatchToProps)(EmailConfirmation); export default connect(mapStateToProps,mapDispatchToProps)(EmailConfirmation);
\ No newline at end of file
{/* <Spinner
visible={this.state.spinner}
textContent={'Loading...'}
textStyle={styles.spinnerTextStyle}
/>
<View style={{ margin: 10, top: 10 }}>
<TextInput
style={{ height: 40, borderColor: 'gray', borderWidth: 1, padding: 5 }}
onChangeText={(confirmation_number) => this.setState({ confirmation_number })}
value={this.state.confirmation_number}
/>
</View>
<View style={{ margin: 10 }}>
<Button title="Submit" onPress={() => this.handleSubmit()} />
</View>
<View style={{ margin: 10 }}>
<Button title="Cancel" onPress={() => this.handleCancel()} />
</View>
<View>
<TouchableOpacity onPress={() => this.handleResend()}>
<Text style={{ color: 'red', textAlign: 'center' }}>Resend email token</Text>
</TouchableOpacity>
</View>
<View>
<TouchableOpacity onPress={() => this.props.navigation.navigate('Change Email')}>
<Text style={{ color: 'red', textAlign: 'center' }}> Change email</Text>
</TouchableOpacity>
</View> */}
\ No newline at end of file
This diff is collapsed.
import React from 'react'; import React from 'react';
import { View, Text, TextInput, StyleSheet, Button, Alert, Image } from 'react-native'; import { View, Text, TextInput, StyleSheet, Button, Alert, Image, TouchableOpacity } from 'react-native';
import Axios from 'axios'; import Axios from 'axios';
import { BASE_URL_RESET_PASSWORD } from '../model/Base_Model'; import { BASE_URL_RESET_PASSWORD } from '../model/Base_Model';
import ActionType from '../redux/globalActionType'; import ActionType from '../redux/globalActionType';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { TouchableOpacity } from 'react-native-gesture-handler';
import i18n from 'i18n-js'; import i18n from 'i18n-js';
import Spinner from 'react-native-loading-spinner-overlay'; import Spinner from 'react-native-loading-spinner-overlay';
...@@ -78,7 +78,6 @@ class ResetPassword extends React.Component { ...@@ -78,7 +78,6 @@ class ResetPassword extends React.Component {
<Text style={{ alignSelf: 'center', color: '#CFB368', fontFamily: 'Gotham-Black', fontSize: 20 }}>ENTER TOKEN</Text> <Text style={{ alignSelf: 'center', color: '#CFB368', fontFamily: 'Gotham-Black', fontSize: 20 }}>ENTER TOKEN</Text>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
<View style={{ flex: 1, flexDirection: 'row' }}> <View style={{ flex: 1, flexDirection: 'row' }}>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment