Skip to content

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

change design account, address,auth, delivery

parent 56233833
Hide whitespace changes
Inline Side-by-side
Showing with 61 additions and 48 deletions
view/Account.js
View file @ c8b301f2
...@@ -319,7 +319,7 @@ class Account extends React.Component { ...@@ -319,7 +319,7 @@ class Account extends React.Component {
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center'}}> <View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center'}}>
<TouchableOpacity style={{ marginBottom: 10 }} onPress={() => this.TransferBalance()} > <TouchableOpacity style={{ marginBottom: 5 }} onPress={() => this.TransferBalance()} >
<Card style={{ height: 120, width: 155 }}> <Card style={{ height: 120, width: 155 }}>
<View style={{ height: 50, alignItems: 'center', padding: 10 }}> <View style={{ height: 50, alignItems: 'center', padding: 10 }}>
...@@ -332,7 +332,7 @@ class Account extends React.Component { ...@@ -332,7 +332,7 @@ class Account extends React.Component {
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
<View style={{ width: 5 }}></View> <View style={{ width: 5 }}></View>
<TouchableOpacity style={{ marginBottom: 10 }} onPress={() => this.props.navigation.navigate('Transaction History')} > <TouchableOpacity onPress={() => this.props.navigation.navigate('Transaction History')} >
<Card style={{ height: 120, width: 155 }}> <Card style={{ height: 120, width: 155 }}>
<View style={{ height: 50, alignItems: 'center', padding: 10 }}> <View style={{ height: 50, alignItems: 'center', padding: 10 }}>
<Image <Image
...@@ -344,11 +344,10 @@ class Account extends React.Component { ...@@ -344,11 +344,10 @@ class Account extends React.Component {
</Card> </Card>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> <View style={{ flex:1, flexDirection: 'row', justifyContent: 'center'}}>
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center', top: 10 }}>
{this.state.premium === false ? ( {this.state.premium === false ? (
<TouchableOpacity onPress={() => this.props.navigation.navigate('Upgrade Premium')} style={{ marginBottom: 20, marginRight: 5, marginLeft: 5 }}> <TouchableOpacity onPress={() => this.props.navigation.navigate('Upgrade Premium')} style={{ marginBottom: 20, marginRight: 5, marginLeft: 5 }}>
<Card style={{ height: 100, width: 160 }}> <Card style={{ height: 120, width: 155 }}>
<View style={{ height: 50, alignItems: 'center' }}> <View style={{ height: 50, alignItems: 'center' }}>
<MaterialIcons name="autorenew" size={30} color="gray" style={{ top: 20 }} /> <MaterialIcons name="autorenew" size={30} color="gray" style={{ top: 20 }} />
<Text style={{ fontFamily: 'Gotham-Black', textAlign: 'center', top: 30, fontSize: 14, color: '#838383' }}>UPGRADE PREMIUM</Text> <Text style={{ fontFamily: 'Gotham-Black', textAlign: 'center', top: 30, fontSize: 14, color: '#838383' }}>UPGRADE PREMIUM</Text>
...@@ -359,9 +358,11 @@ class Account extends React.Component { ...@@ -359,9 +358,11 @@ class Account extends React.Component {
null null
)} )}
</View> </View>
</View>
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<TouchableOpacity onPress={() => this.logout()}> <TouchableOpacity onPress={() => this.logout()}>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center', marginLeft: 20, marginRight: 20, marginBottom: 10, padding: 5, bottom: 5 }}> <View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center', marginLeft: 20, marginRight: 20, marginBottom: 20, padding: 5, bottom: 5,top:1 }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>LOGOUT</Text> <Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>LOGOUT</Text>
</View> </View>
</TouchableOpacity> </TouchableOpacity>
......
view/AddreesDetail.js
View file @ c8b301f2
import React from 'react'; import React from 'react';
import { View, Text, TextInput, StyleSheet, Button, Platform, Dimensions, Alert, Image } from 'react-native'; import { View, Text, TextInput, StyleSheet, Button, Platform, Dimensions, Alert, Image ,ActivityIndicator } from 'react-native';
import * as Device from 'expo-device'; import * as Device from 'expo-device';
import * as Permissions from 'expo-permissions'; import * as Permissions from 'expo-permissions';
import * as Location from 'expo-location'; import * as Location from 'expo-location';
...@@ -33,6 +33,7 @@ class AddreesDetail extends React.Component { ...@@ -33,6 +33,7 @@ class AddreesDetail extends React.Component {
address: '', address: '',
address_d: '', address_d: '',
spinner: false, spinner: false,
indicator: true,
} }
} }
...@@ -76,13 +77,11 @@ class AddreesDetail extends React.Component { ...@@ -76,13 +77,11 @@ class AddreesDetail extends React.Component {
// name: detail[0].name, // name: detail[0].name,
region: detail[0].region, region: detail[0].region,
postalCode: detail[0].postalCode, postalCode: detail[0].postalCode,
indicator: false,
}) })
this.setState({
spinner: false,
})
} }
//searchlocation (mencari lokasi) //searchlocation (mencari lokasi)
...@@ -156,15 +155,10 @@ class AddreesDetail extends React.Component { ...@@ -156,15 +155,10 @@ class AddreesDetail extends React.Component {
render() { render() {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Spinner
visible={this.state.spinner}
textContent={'Loading...'}
textStyle={styles.spinnerTextStyle}
/>
<ScrollView> <ScrollView>
<View style={styles.content}> <View style={styles.content}>
<View style={{ height: 45, borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 10, marginRight: 10 }}> <View style={{ height: 45, borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 10, marginRight: 10 }}>
<View style={{ flex: 1,top:5 }}> <View style={{ flex: 1, top: 5 }}>
<MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" /> <MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" />
</View> </View>
<View style={{ flex: 6 }}> <View style={{ flex: 6 }}>
...@@ -212,28 +206,34 @@ class AddreesDetail extends React.Component { ...@@ -212,28 +206,34 @@ class AddreesDetail extends React.Component {
</View> </View>
</View> </View>
<View style={styles.name_addrees_input}> <View style={styles.name_addrees_input}>
<View style={{ flexDirection: 'row', top: 10,justifyContent:'center' }}> <View style={{ flexDirection: 'row', top: 10, justifyContent: 'center' }}>
<View style={{flex:1,justifyContent:'center',flexDirection:'row'}}> <View style={{ flex: 1, justifyContent: 'center', flexDirection: 'row' }}>
<MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" /> <MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" />
</View> </View>
<View style={{ flex: 3 ,justifyContent:'center'}}> {this.state.indicator == true ? (
<Text style={{ fontFamily: 'Gotham-Light',textAlign:'center' }}>{this.state.street}</Text> <ActivityIndicator size="large" color="#c9af6d" />
<Text style={{ fontFamily: 'Gotham-Light',textAlign:'center' }}>{this.state.city} </Text> ) : (
<Text style={{fontFamily: 'Gotham-Light',textAlign:'center'}}>{this.state.region}</Text> <View style={{ flex: 3, justifyContent: 'center' }}>
<Text style={{fontFamily: 'Gotham-Light',textAlign:'center'}}>{this.state.postalCode}</Text> <Text style={{ fontFamily: 'Gotham-Light', textAlign: 'center' }}>{this.state.street}</Text>
</View> <Text style={{ fontFamily: 'Gotham-Light', textAlign: 'center' }}>{this.state.city} </Text>
<View style={{flex:1}}> <Text style={{ fontFamily: 'Gotham-Light', textAlign: 'center' }}>{this.state.region}</Text>
<Text style={{ fontFamily: 'Gotham-Light', textAlign: 'center' }}>{this.state.postalCode}</Text>
</View>
)}
<View style={{ flex: 1 }}>
</View> </View>
</View> </View>
<View style={styles.field_name_addrees}> <View style={styles.field_name_addrees}>
<Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c",textAlign:'center',fontSize:18 }}>Label</Text> <Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c", textAlign: 'center', fontSize: 18 }}>Label</Text>
<TextInput style={{ height: 40, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey' }} onChangeText={(name) => this.setState({ name })} /> <TextInput style={{ height: 40, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey' }} onChangeText={(name) => this.setState({ name })} />
</View> </View>
<View style={styles.field_detail_addrees}> <View style={styles.field_detail_addrees}>
<Text style={{ fontFamily: 'Gotham-Black', marginLeft: 10, color: "#ccb46c",textAlign:'center',fontSize:18 }} >Detail</Text> <Text style={{ fontFamily: 'Gotham-Black', marginLeft: 10, color: "#ccb46c", textAlign: 'center', fontSize: 18 }} >Detail</Text>
<TextInput style={{ height: 150, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey',justifyContent:'flex-start' }} <TextInput style={{ height: 150, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey', justifyContent: 'flex-start' }}
onChangeText={(description) => this.setState({ description })} onChangeText={(description) => this.setState({ description })}
numberOfLines={10} numberOfLines={10}
multiline={true} /> multiline={true} />
...@@ -258,7 +258,7 @@ const styles = StyleSheet.create({ ...@@ -258,7 +258,7 @@ const styles = StyleSheet.create({
container: { container: {
flex: 1, flex: 1,
backgroundColor: '#ffff' backgroundColor: '#ffff'
}, },
header: { header: {
...@@ -268,8 +268,8 @@ const styles = StyleSheet.create({ ...@@ -268,8 +268,8 @@ const styles = StyleSheet.create({
content: { content: {
flex: 3, flex: 3,
marginRight:10, marginRight: 10,
marginLeft:10, marginLeft: 10,
}, },
field_search: { field_search: {
...@@ -279,22 +279,22 @@ const styles = StyleSheet.create({ ...@@ -279,22 +279,22 @@ const styles = StyleSheet.create({
cont_google_map: { cont_google_map: {
flex: 1, flex: 1,
top: 5, top: 5,
marginRight:10, marginRight: 10,
marginLeft:10, marginLeft: 10,
height: 250, height: 250,
}, },
name_addrees_input: { name_addrees_input: {
flex: 1, flex: 1,
marginLeft:10, marginLeft: 10,
marginRight:10, marginRight: 10,
top:20 top: 20
}, },
field_name_addrees: { field_name_addrees: {
flexDirection: 'column', flexDirection: 'column',
top: 40, top: 40,
justifyContent:'center' justifyContent: 'center'
}, },
field_detail_addrees: { field_detail_addrees: {
......
view/Auth.js
View file @ c8b301f2
...@@ -168,7 +168,7 @@ class Auth extends React.Component { ...@@ -168,7 +168,7 @@ class Auth extends React.Component {
fontFamily: 'Gotham-Black', fontFamily: 'Gotham-Black',
color: 'white', color: 'white',
textAlign: 'center' textAlign: 'center'
}, title: 'CHANGE PROFIL' }, title: 'CHANGE PROFILE'
}} /> }} />
<Stack.Screen name="Register" component={Register} /> <Stack.Screen name="Register" component={Register} />
{/* <Stack.Screen name="Change language" component={ChangeLanguage} /> */} {/* <Stack.Screen name="Change language" component={ChangeLanguage} /> */}
......
view/DeliveryAddrees.js
View file @ c8b301f2
import React from 'react'; import React from 'react';
import { View, Text, StyleSheet, Button, FlatList, Alert, TextInput, Image } from 'react-native'; import { View, Text, StyleSheet, Button, FlatList, Alert, TextInput, Image,ScrollView,ActivityIndicator } from 'react-native';
import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; import { TouchableOpacity } from 'react-native-gesture-handler';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { CheckBox, Icon } from 'react-native-elements'; import { CheckBox, Icon } from 'react-native-elements';
import Axios from 'axios'; import Axios from 'axios';
import ActionType from '../redux/globalActionType'; import ActionType from '../redux/globalActionType';
import { MaterialCommunityIcons, Ionicons } from '@expo/vector-icons'; import { MaterialCommunityIcons, Ionicons } from '@expo/vector-icons';
// import ravLog from '../helper/debug'; // import ravLog from '../helper/debug';
class DeliveryAddrees extends React.Component { class DeliveryAddrees extends React.Component {
...@@ -16,6 +17,7 @@ class DeliveryAddrees extends React.Component { ...@@ -16,6 +17,7 @@ class DeliveryAddrees extends React.Component {
data: [], data: [],
data_before_search: [], data_before_search: [],
search: '', search: '',
indicator: true,
// outlet_id: '', // outlet_id: '',
// grabamount: '' // grabamount: ''
} }
...@@ -49,6 +51,7 @@ class DeliveryAddrees extends React.Component { ...@@ -49,6 +51,7 @@ class DeliveryAddrees extends React.Component {
this.setState({ this.setState({
data: address, data: address,
data_before_search: dataAlamat, data_before_search: dataAlamat,
indicator: false
}) })
let data_alamat = [] let data_alamat = []
...@@ -245,6 +248,7 @@ class DeliveryAddrees extends React.Component { ...@@ -245,6 +248,7 @@ class DeliveryAddrees extends React.Component {
</View> </View>
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
); );
...@@ -254,6 +258,7 @@ class DeliveryAddrees extends React.Component { ...@@ -254,6 +258,7 @@ class DeliveryAddrees extends React.Component {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ScrollView>
<View style={{ height: 45, borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 20, marginRight: 20 }}> <View style={{ height: 45, borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 20, marginRight: 20 }}>
<View style={{ flex: 1, top: 5 }}> <View style={{ flex: 1, top: 5 }}>
<MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" /> <MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" />
...@@ -277,12 +282,19 @@ class DeliveryAddrees extends React.Component { ...@@ -277,12 +282,19 @@ class DeliveryAddrees extends React.Component {
</View> </View>
<View style={styles.listAddress}> <View style={styles.listAddress}>
<FlatList {this.state.indicator == true ? (
data={this.state.data} <ActivityIndicator size="large" color="#c9af6d" />
renderItem={this.renderItem} ) : (
keyExtractor={item => item.id} <FlatList style={{marginBottom:25}}
/> data={this.state.data}
renderItem={this.renderItem}
keyExtractor={item => item.id}
/>
)}
</View> </View>
</ScrollView>
</View> </View>
) )
...@@ -317,7 +329,7 @@ const styles = StyleSheet.create({ ...@@ -317,7 +329,7 @@ const styles = StyleSheet.create({
top:20, top:20,
marginLeft:20, marginLeft:20,
marginRight:20, marginRight:20,
marginBottom:10, marginBottom:20,
borderWidth: 1, borderWidth: 1,
borderColor: '#838383', borderColor: '#838383',
borderRadius: 10, borderRadius: 10,
......
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