Skip to content

N
new_excelso
Commit be445b63 authored by Wahyu Adjie Prasetyo's avatar Wahyu Adjie Prasetyo
Browse files
Options

change desaign login (2)

parent 6b168f3f
Hide whitespace changes
Inline Side-by-side
Showing with 114 additions and 48 deletions
app.json
View file @ be445b63
{ {
"expo": { "expo": {
"name": "Excelso_update v1. siang.13.05.2020", "name": "Excelso_update v1. siang.14.05.2020",
"slug": "excelso-pro", "slug": "excelso-pro",
"privacy": "public", "privacy": "public",
"sdkVersion": "36.0.0", "sdkVersion": "36.0.0",
......
package.json
View file @ be445b63
...@@ -76,6 +76,5 @@ ...@@ -76,6 +76,5 @@
"babel-preset-expo": "~8.0.0", "babel-preset-expo": "~8.0.0",
"@babel/core": "^7.0.0" "@babel/core": "^7.0.0"
}, },
"private": true "private": true
} }
view/Auth.js
View file @ be445b63
...@@ -84,9 +84,7 @@ function HomePage({ navigation }) { ...@@ -84,9 +84,7 @@ function HomePage({ navigation }) {
}, },
})} })}
tabBarOptions={{ activeTintColor: 'cornflowerblue', inactiveTintColor: 'gray' }} tabBarOptions={{ activeTintColor: 'cornflowerblue', inactiveTintColor: 'gray' }}
> >
<Tab.Screen name="HOME" component={Home} /> <Tab.Screen name="HOME" component={Home} />
<Tab.Screen name="MENU" component={MenuSelection} /> <Tab.Screen name="MENU" component={MenuSelection} />
...@@ -133,12 +131,12 @@ class Auth extends React.Component { ...@@ -133,12 +131,12 @@ class Auth extends React.Component {
headerShown: false, headerShown: false,
title: 'TODAY PROMOTION', title: 'TODAY PROMOTION',
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle:{alignContent:'center'}, headerTitleContainerStyle: { alignContent: 'center' },
headerTitleStyle: { headerTitleStyle: {
alignSelf: 'center', alignSelf: 'center',
fontFamily: 'Gotham-Black', fontFamily: 'Gotham-Black',
color:'white', color: 'white',
textAlign:'center' textAlign: 'center'
} }
}} /> }} />
...@@ -158,7 +156,7 @@ class Auth extends React.Component { ...@@ -158,7 +156,7 @@ class Auth extends React.Component {
<Stack.Screen name="Delivery Address" component={DeliveryAddress} /> <Stack.Screen name="Delivery Address" component={DeliveryAddress} />
<Stack.Screen name="Address Detail" component={AddressDetail} /> <Stack.Screen name="Address Detail" component={AddressDetail} />
<Stack.Screen name="Menu Detail" component={MenuDetail} /> <Stack.Screen name="Menu Detail" component={MenuDetail} />
<Stack.Screen name="Pickup Name" component={PickupName} options={{ title: "PICKUP STORE", headerStyle: { backgroundColor: "#ccb46c" }, headerTitleAlign: 'center', headerTitleStyle: { color: 'white', fontWeight: 'bold' } }} /> <Stack.Screen name="Pickup Name" component={PickupName} options={{ title: "PICKUP STORE", headerStyle: { backgroundColor: "#ccb46c", alignSelf: 'center' }, headerTitleAlign: 'center', headerTitleStyle: { color: 'white', fontWeight: 'bold' } }} />
<Stack.Screen name="Outlet Detail" component={OutletDetail} /> <Stack.Screen name="Outlet Detail" component={OutletDetail} />
<Stack.Screen name="Menu Select" component={MenuSelection} options={{ headerShown: false }} /> <Stack.Screen name="Menu Select" component={MenuSelection} options={{ headerShown: false }} />
<Stack.Screen name="Card Info" component={CardInfo} /> <Stack.Screen name="Card Info" component={CardInfo} />
...@@ -178,7 +176,22 @@ class Auth extends React.Component { ...@@ -178,7 +176,22 @@ class Auth extends React.Component {
<Stack.Screen name="New Password" component={NewPassword} /> <Stack.Screen name="New Password" component={NewPassword} />
{/* <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={{
headerStyle: { backgroundColor: "#ccb46c" },
headerBackTitleStyle: { color: 'white' },
headerTitleAlign:'center',
headerTintColor: '#fff',
headerTitleStyle: {
textAlign: 'center',
fontSize: 15,
fontFamily: 'Gotham-Black',
color: 'white'
},
headerTitle: 'RESET PASSWORD'
}} />
<Stack.Screen name="Verify Email" component={VerifyEmail} /> <Stack.Screen name="Verify Email" component={VerifyEmail} />
<Stack.Screen name="Change Email" component={ChangeEmail} /> <Stack.Screen name="Change Email" component={ChangeEmail} />
{/* <Stack.Screen name="Card Activation" component={CardActivation} /> */} {/* <Stack.Screen name="Card Activation" component={CardActivation} /> */}
...@@ -190,16 +203,20 @@ class Auth extends React.Component { ...@@ -190,16 +203,20 @@ class Auth extends React.Component {
{/* <Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> */} {/* <Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> */}
<Stack.Screen name="News Detail" component={NewsDetail} /> <Stack.Screen name="News Detail" component={NewsDetail} />
{/* <Stack.Screen name="Delivery Address" component={DeliveryAddress} /> */}
<Stack.Screen name="Confirm Your Order" component={MenuConfirmation} /> <Stack.Screen name="Confirm Your Order" component={MenuConfirmation} />
{/* <Stack.Screen name="Card Info" component={CardInfo} /> */}
{/* <Stack.Screen name="Change password" component={ChangePassword} /> */}
<Stack.Screen name="Date Time" component={DateTime} /> <Stack.Screen name="Date Time" component={DateTime} />
<Stack.Screen name="New Register" component={NewRegister} /> <Stack.Screen name="New Register" component={NewRegister}
options={{
headerStyle: { backgroundColor: "#ccb46c" },
headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff',
headerTitleStyle: {
fontFamily: 'Gotham-Black',
color: 'white',
fontSize: 30,
},
title: 'REGISTER'
}} />
<Stack.Screen name="TopUpInfo" component={TopUpInfo} /> <Stack.Screen name="TopUpInfo" component={TopUpInfo} />
<Stack.Screen name="Reward Detail" component={RewardDetail} /> <Stack.Screen name="Reward Detail" component={RewardDetail} />
<Stack.Screen name="Reward Select" component={RewardSelect} /> <Stack.Screen name="Reward Select" component={RewardSelect} />
......
view/Login.js
View file @ be445b63
import * as React from 'react'; import * as React from 'react';
import { Button, View, Text, TextInput, StyleSheet, Alert, Platform, Image, TouchableOpacity, StatusBar, ImageBackground } from 'react-native'; import { Button, View, Text, TextInput, StyleSheet, Alert, Platform, Image, TouchableOpacity, StatusBar, ImageBackground,ScrollView } from 'react-native';
import Axios from 'axios'; import Axios from 'axios';
import Constants from 'expo-constants'; import Constants from 'expo-constants';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import ActionType from '../redux/globalActionType'; import ActionType from '../redux/globalActionType';
import { BASE_URL_LOGIN } from '../model/Base_Model'; import { BASE_URL_LOGIN } from '../model/Base_Model';
import { Notifications } from 'expo'; import { Notifications } from 'expo';
import Spinner from 'react-native-loading-spinner-overlay';
class Login extends React.Component { class Login extends React.Component {
constructor(props) { constructor(props) {
...@@ -186,8 +186,14 @@ class Login extends React.Component { ...@@ -186,8 +186,14 @@ class Login extends React.Component {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Spinner
visible={this.state.spinner}
textContent={'Loading...'}
textStyle={styles.spinnerTextStyle}
/>
<StatusBar <StatusBar
hidden={true} /> hidden={true} />
<ImageBackground source={require('../assets/images/loging-background.jpg')} style={{ width: '100%', height: '100%' }}> <ImageBackground source={require('../assets/images/loging-background.jpg')} style={{ width: '100%', height: '100%' }}>
<View style={styles.logo}> <View style={styles.logo}>
<Image source={require('../assets/images/excelso-log.png')} style={styles.imageslogo}></Image> <Image source={require('../assets/images/excelso-log.png')} style={styles.imageslogo}></Image>
......
view/NewPassword.js
View file @ be445b63
...@@ -73,9 +73,8 @@ class NewPassword extends React.Component { ...@@ -73,9 +73,8 @@ class NewPassword extends React.Component {
textContent={'Loading...'} textContent={'Loading...'}
textStyle={styles.spinnerTextStyle} textStyle={styles.spinnerTextStyle}
/> />
{/* <Text>{this.state.email}</Text> */}
<View style={styles.header}> <View style={styles.header}>
<Text style={{ textAlign: 'center', marginTop: 10, fontSize: 25 }}>New Password</Text>
</View> </View>
<View style={styles.form}> <View style={styles.form}>
<View style={styles.field_token}> <View style={styles.field_token}>
...@@ -90,7 +89,6 @@ class NewPassword extends React.Component { ...@@ -90,7 +89,6 @@ class NewPassword extends React.Component {
</View> </View>
<View style={styles.field_new_password}> <View style={styles.field_new_password}>
<View style={{ width: 55, justifyContent: 'center' }}> <View style={{ width: 55, justifyContent: 'center' }}>
<Text>New Password</Text>
</View> </View>
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10 }} <TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10 }}
......
view/New_Register.js
View file @ be445b63
...@@ -236,11 +236,6 @@ class NewRegister extends React.Component { ...@@ -236,11 +236,6 @@ class NewRegister extends React.Component {
textContent={'Loading...'} textContent={'Loading...'}
textStyle={styles.spinnerTextStyle} textStyle={styles.spinnerTextStyle}
/> />
<View style={styles.header}>
<StatusBar barStyle='dark-content' />
{/* <Text style={styles.titleText}>{i18n.t('register')}</Text> */}
<Text style={styles.titleText}>REGISTER</Text>
</View>
<View style={styles.body}> <View style={styles.body}>
<View style={styles.itemsRow}> <View style={styles.itemsRow}>
......
view/ResetPassword.js
View file @ be445b63
import React from 'react'; import React from 'react';
import { View, Text, TextInput, StyleSheet, Button, Alert } from 'react-native'; import { View, Text, TextInput, StyleSheet, Button, Alert, Image } 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';
...@@ -14,7 +14,7 @@ class ResetPassword extends React.Component { ...@@ -14,7 +14,7 @@ class ResetPassword extends React.Component {
this.state = { this.state = {
email: '', email: '',
language: 'id', language: 'id',
spinner:false spinner: false
} }
} }
...@@ -40,7 +40,7 @@ class ResetPassword extends React.Component { ...@@ -40,7 +40,7 @@ class ResetPassword extends React.Component {
'Email terkirim, mohon dicek' 'Email terkirim, mohon dicek'
, ,
) )
this.props.navigation.navigate('New Password'); this.props.navigation.navigate('New Password');
} }
}).catch(error => { }).catch(error => {
...@@ -56,33 +56,44 @@ class ResetPassword extends React.Component { ...@@ -56,33 +56,44 @@ class ResetPassword extends React.Component {
render() { render() {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Spinner <Spinner
visible={this.state.spinner} visible={this.state.spinner}
textContent={'Loading...'} textContent={'Loading...'}
textStyle={styles.spinnerTextStyle} textStyle={styles.spinnerTextStyle}
/> />
<View style={styles.header}> <View style={{ flex: 3 }}>
<Text style={{ textAlign: 'center', marginTop: 10, fontSize: 25 }}>{i18n.t('resetPassword')}</Text> <View style={{ flex: 1, marginRight: 30, marginLeft: 30, top: 50 }}>
<Text style={{ fontFamily: 'Gotham-Black', color: '#CFB368', fontSize: 20, textAlign: 'center', margin: 3 }}>Email</Text>
<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 }}
onChangeText={(email) => this.setState({ email })}
autoCapitalize="none"
value={this.state.email}
keyboardType='email-address' />
<TouchableOpacity style={{ height: 100 }} onPress={() => this.handleResetPassword()}>
<View style={{ backgroundColor: '#CFB368', height: 45, top: 20, 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: 60}} onPress={() => this.handleResetPassword()}>
<Text style={{ alignSelf: 'center', color: '#CFB368', fontFamily: 'Gotham-Black', fontSize: 20 }}>ENTER TOKEN</Text>
</TouchableOpacity>
</View>
</View> </View>
<View style={styles.form}> <View style={{ flex: 1, flexDirection: 'row' }}>
<View style={styles.field_email}>
<View style={{ width: 40, justifyContent: 'center' }}> <View style={styles.v_logo}>
<Text>Email</Text> <View style={{ flex: 1, alignSelf: 'flex-start' }}>
<Image resizeMode="contain" source={require('../assets/images/daun.png')} style={styles.logo}></Image>
</View> </View>
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10 }}
onChangeText={(email) => this.setState({ email })}
autoCapitalize="none"
value={this.state.email}
keyboardType='email-address'/>
</View> </View>
</View> </View>
<View style={styles.button}>
<Button title={i18n.t('submit')} onPress={() => this.handleResetPassword()}></Button> <View style={{ flex: 0.5 }}>
</View> </View>
<TouchableOpacity onPress={() => this.handleResetPassword()}>
<Text style={{ fontSize: 20, textAlign: 'center', color: 'red' }}>{i18n.t('enterToken')}</Text>
</TouchableOpacity>
</View> </View>
</View> </View>
) )
...@@ -103,6 +114,7 @@ const styles = StyleSheet.create({ ...@@ -103,6 +114,7 @@ const styles = StyleSheet.create({
form: { form: {
flex: 3, flex: 3,
top: 40,
margin: 10, margin: 10,
marginTop: 0, marginTop: 0,
}, },
...@@ -115,6 +127,19 @@ const styles = StyleSheet.create({ ...@@ -115,6 +127,19 @@ const styles = StyleSheet.create({
height: 40, height: 40,
margin: 10, margin: 10,
},
logo: {
alignSelf: 'flex-start',
marginTop: 50,
width: 290,
height: 290,
bottom: 145,
},
v_logo: {
flex: 2,
flexDirection: 'column-reverse',
alignContent: 'flex-start',
} }
}) })
...@@ -136,4 +161,30 @@ const mapDispatchToProps = (dispacth) => { ...@@ -136,4 +161,30 @@ const mapDispatchToProps = (dispacth) => {
} }
} }
export default connect(mapStateToProps, mapDispatchToProps)(ResetPassword); export default connect(mapStateToProps, mapDispatchToProps)(ResetPassword);
\ No newline at end of file
{/* <Spinner
visible={this.state.spinner}
textContent={'Loading...'}
textStyle={styles.spinnerTextStyle}
/>
<Text style={{ textAlign: 'center', marginTop: 10, fontSize: 25 }}>{i18n.t('resetPassword')}</Text>
<View style={styles.form}>
<View style={styles.field_email}>
<View style={{ flex: 1 }}>
<TextInput style={{ height: 40, borderWidth: 1, padding: 5, margin: 10, borderRadius:20 }}
onChangeText={(email) => this.setState({ email })}
autoCapitalize="none"
value={this.state.email}
keyboardType='email-address'/>
</View>
</View>
<View style={styles.button}>
<Button title={i18n.t('submit')} onPress={() => this.handleResetPassword()}></Button>
<View></View>
</View>
<TouchableOpacity onPress={() => this.handleResetPassword()}>
<Text style={{ fontSize: 20, textAlign: 'center', color: 'red' }}>{i18n.t('enterToken')}</Text>
</TouchableOpacity>
</View> */}
\ No newline at end of file
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