Skip to content

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

change menu selection and add outlet list

parent fe4cca37
Hide whitespace changes
Inline Side-by-side
Showing with 71 additions and 86 deletions
view/Account.js
View file @ bdc7c092
...@@ -203,36 +203,10 @@ class Account extends React.Component { ...@@ -203,36 +203,10 @@ class Account extends React.Component {
</View> </View>
</View> </View>
{ {
this.props.set_card === false ? ( this.props.set_card === false ? (
<View> <View>
<View style={styles.Card}> <View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center', top:50 }}>
{/* <Card style={{ padding: 10, margin: 10, alignContent: 'center' }}>
<Text style={{ textAlign: "center", fontSize: 40, color: '#c9af6d' }}>
</Text>
<Text style={{ textAlign: 'left', fontWeight: 'bold' }}> {'\n'}
</Text>
<Text style={{ textAlign: 'left', fontWeight: 'bold' }}>{'\n'}
</Text>
</Card>
<Card style={{ padding: 10, margin: 10, alignContent: 'center' }}>
<Text style={{ textAlign: "center", fontSize: 40, color: '#c9af6d' }}>
</Text>
<Text style={{ textAlign: 'left', fontWeight: 'bold' }}> {'\n'}
</Text>
<Text style={{ textAlign: 'left', fontWeight: 'bold' }}>{'\n'}
</Text>
</Card> */}
</View>
<View style={{ flex: 1, flexDirection: 'row', justifyContent: 'center', top: 20 }}>
<View style={{ height: 250, flex: 1, backgroundColor: 'grey', marginRight: 20, marginLeft: 20, top: 25, borderRadius: 20 }}> <View style={{ height: 250, flex: 1, backgroundColor: 'grey', marginRight: 20, marginLeft: 20, top: 25, borderRadius: 20 }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', top: 20 }}>No card yet</Text> <Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', top: 20 }}>No card yet</Text>
<TouchableOpacity onPress={() => this.handleLoggin()}> <TouchableOpacity onPress={() => this.handleLoggin()}>
...@@ -243,11 +217,11 @@ class Account extends React.Component { ...@@ -243,11 +217,11 @@ class Account extends React.Component {
</View> </View>
</View> </View>
<TouchableOpacity onPress={() => this.logout()}> <TouchableOpacity onPress={() => this.logout()}>
<View style={{ height: 50, borderRadius: 20, backgroundColor: '#CFB368', margin: 40, top: 30 }}> <View style={{ height: 50, borderRadius: 20, backgroundColor: '#CFB368', margin: 40, top: 40, }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', margin: 15 }}>LOGOUT</Text> <Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 20, textAlign: 'center', margin: 15 }}>LOGOUT</Text>
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
) : ( ) : (
<View> <View>
<View style={styles.Card}> <View style={styles.Card}>
......
view/MenuSelection.js
View file @ bdc7c092
...@@ -181,7 +181,7 @@ class MenuSelection extends React.Component { ...@@ -181,7 +181,7 @@ class MenuSelection extends React.Component {
return ( return (
<View style={{ flex: 1, height: 270 }}> <View style={{ flex: 1, height: 270 }}>
<TouchableOpacity> <TouchableOpacity>
<Image style={{ height: 70, width: 70,top:5}} source={{ uri: item.image }} /> <Image style={{ height: 60, width: 60, top: 5 }} source={{ uri: item.image }} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
) )
...@@ -280,7 +280,7 @@ class MenuSelection extends React.Component { ...@@ -280,7 +280,7 @@ class MenuSelection extends React.Component {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<StatusBar hidden={true} /> <StatusBar hidden={true} />
<View style={{ flex:0.5, height: 50, flexDirection: 'row' }}> <View style={{ flex: 0.5, height: 50, flexDirection: 'row' }}>
<FlatList horizontal={true} style={{ flexDirection: 'row' }} <FlatList horizontal={true} style={{ flexDirection: 'row' }}
showsHorizontalScrollIndicator={false} showsHorizontalScrollIndicator={false}
data={this.state.listCategory} data={this.state.listCategory}
...@@ -288,7 +288,7 @@ class MenuSelection extends React.Component { ...@@ -288,7 +288,7 @@ class MenuSelection extends React.Component {
keyExtractor={(item) => item.id} keyExtractor={(item) => item.id}
/> />
</View> </View>
<View style={{height:1,backgroundColor:'grey',marginRight:10,marginLeft:10,marginTop:5}}></View> <View style={{ height: 1, backgroundColor: 'grey', marginRight: 10, marginLeft: 10, marginTop: 5 }}></View>
<View style={{ flex: 3 }}> <View style={{ flex: 3 }}>
{this.state.indicator == true ? ( {this.state.indicator == true ? (
<ActivityIndicator style={{ top: 10 }} size="large" color="#c9af6d" /> <ActivityIndicator style={{ top: 10 }} size="large" color="#c9af6d" />
...@@ -310,19 +310,22 @@ class MenuSelection extends React.Component { ...@@ -310,19 +310,22 @@ class MenuSelection extends React.Component {
</View> </View>
<View style={styles.shadow}> <View style={styles.shadow}>
<Text style={{ fontSize: 12, margin: 10, fontFamily: 'Gotham-Black' }}> {this.props.order_quantity} Item | {this.props.type_pickup == true ? (null) : (
<Text style={{ fontSize: 12, margin: 10 }}> Ongkir {this.props.grabamount} </Text>
)} </Text>
<View style={{ flex: 1, flexDirection: 'row' }}> <View style={{ flex: 1, flexDirection: 'row' }}>
<View style={{ flex: 1 }}> <View style={{ flex: 0.7}}>
<Text style={{ fontSize: 20, margin: 10, marginBottom: 10, fontFamily: 'Gotham-Light' }}> Rp. {this.props.order_total}</Text> <Text style={{ fontSize: 12, fontFamily: 'Gotham-Black',top:10 }}> {this.props.order_quantity} Item | {this.props.type_pickup == true ? (null) : (
<Text style={{ fontSize: 12 }}> Ongkir {this.props.grabamount} </Text>
)} </Text>
<Text style={{ fontSize: 20, fontFamily: 'Gotham-Light', top:20 }}> Rp. {this.props.order_total}</Text>
</View> </View>
<View style={{ flex: 1,height:100,marginBottom:30}}> <View style={{ flex: 1, height: 100 }}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('Shopping Cart')}> <TouchableOpacity onPress={() => this.props.navigation.navigate('Shopping Cart')}>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368',marginRight:20,flexDirection:'row',marginBottom:30}}> <View>
<View style={{ height: 50, borderRadius: 10, backgroundColor: '#CFB368',marginRight:20,marginLeft:20,top:10,flexDirection:'row',marginBottom:30}}>
<Image source={(require('../assets/icon/icon-order.png'))} style={{height:50,width:40,tintColor:'white',}}></Image> <Image source={(require('../assets/icon/icon-order.png'))} style={{height:50,width:40,tintColor:'white',}}></Image>
<Text style={{ fontFamily: 'Gotham-Light', color: 'white', fontSize: 15,alignSelf:'center', textAlign: 'center' }}>View Cart</Text> <Text style={{ fontFamily: 'Gotham-Light', color: 'white', fontSize: 15,alignSelf:'center', textAlign: 'center' }}>View Cart</Text>
</View> </View>
</View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
...@@ -340,7 +343,6 @@ const styles = StyleSheet.create({ ...@@ -340,7 +343,6 @@ const styles = StyleSheet.create({
backgroundColor: 'white', backgroundColor: 'white',
}, },
shadow: { shadow: {
borderWidth: 1,
borderRadius: 2, borderRadius: 2,
borderColor: '#ddd', borderColor: '#ddd',
borderBottomWidth: 0, borderBottomWidth: 0,
...@@ -348,7 +350,7 @@ const styles = StyleSheet.create({ ...@@ -348,7 +350,7 @@ const styles = StyleSheet.create({
shadowOffset: { width: 0, height: 2 }, shadowOffset: { width: 0, height: 2 },
shadowOpacity: 10, shadowOpacity: 10,
shadowRadius: 5, shadowRadius: 5,
elevation: 1, elevation: 0.5,
marginTop: 10, marginTop: 10,
flex: 0.5, flex: 0.5,
height: 50, height: 50,
......
view/Outlets.js
View file @ bdc7c092
import React from 'react'; import React from 'react';
import { View, Text, StyleSheet, FlatList, TextInput, Alert,Linking } from 'react-native'; import { View, Text, StyleSheet, FlatList, TextInput, Alert, Linking } from 'react-native';
import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler'; import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler';
import Spinner from 'react-native-loading-spinner-overlay'; import Spinner from 'react-native-loading-spinner-overlay';
import { CheckBox } from 'react-native-elements'; import { CheckBox } from 'react-native-elements';
...@@ -12,7 +12,7 @@ import { connect } from 'react-redux'; ...@@ -12,7 +12,7 @@ import { connect } from 'react-redux';
import * as Permissions from 'expo-permissions'; import * as Permissions from 'expo-permissions';
import * as Device from 'expo-device'; import * as Device from 'expo-device';
import RNPickerSelect from 'react-native-picker-select'; import RNPickerSelect from 'react-native-picker-select';
import MapView, { PROVIDER_GOOGLE } from 'react-native-maps'; import MapView, { PROVIDER_GOOGLE, Marker } from 'react-native-maps';
import { Icon } from 'react-native-elements' import { Icon } from 'react-native-elements'
class Outlets extends React.Component { class Outlets extends React.Component {
...@@ -31,7 +31,7 @@ class Outlets extends React.Component { ...@@ -31,7 +31,7 @@ class Outlets extends React.Component {
spinner: false, spinner: false,
data_outlet: [], data_outlet: [],
outlet_selected: '', outlet_selected: '',
data_name:'' data_name: ''
} }
} }
...@@ -107,6 +107,7 @@ class Outlets extends React.Component { ...@@ -107,6 +107,7 @@ class Outlets extends React.Component {
} }
dataOutlets[i]['full_address'] = address; dataOutlets[i]['full_address'] = address;
} }
this.setState({ this.setState({
dataOutlets: dataOutlets, dataOutlets: dataOutlets,
data_before_search: dataOutlets, data_before_search: dataOutlets,
...@@ -157,27 +158,29 @@ class Outlets extends React.Component { ...@@ -157,27 +158,29 @@ class Outlets extends React.Component {
_getOutletClosest() { _getOutletClosest() {
let params = { let params = {
session_id: this.props.session_id, session_id: this.props.session_id,
lat: this.props.lat, lat: this.props.lat,
long: this.props.long long: this.props.long
} }
// console.log(params); // console.log(params);
Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/outlet/get_closest', params).then(res => { Axios.post('https://excelsocrm.ravintoladev.com/crm/v2/outlet/get_closest', params).then(res => {
let outletName = res.data.data.outlet_name let outletName = res.data.data.outlet_name
this.setState({ this.setState({
indicator: false, indicator: false,
data_name : outletName data_name: outletName
}) })
console.log("INI DATANYA NAME : " + outletName) console.log("INI ADALAH RESPON : + " + JSON.stringify(res))
console.log("INI DATANYA NAME : " + outletName)
}).catch(error => { }).catch(error => {
const {navigation} = this.props const { navigation } = this.props
let response = error.response.data let response = error.response.data
session(response,navigation) session(response, navigation)
Alert.alert(response.msg); Alert.alert(response.msg);
}) })
} }
toRad(value) { toRad(value) {
return value * Math.PI / 180; return value * Math.PI / 180;
...@@ -223,34 +226,32 @@ class Outlets extends React.Component { ...@@ -223,34 +226,32 @@ class Outlets extends React.Component {
<View style={{ flexDirection: 'row', flex: 1 }}> <View style={{ flexDirection: 'row', flex: 1 }}>
<View style={styles.list_addrees}> <View style={styles.list_addrees}>
<Text style={{ fontWeight: 'bold', fontSize: 20, margin: 5, color: '#ccb46c' }}>{item.name}</Text> <Text style={{ fontFamily: 'Gotham-Black', color: '#ccb46c', fontSize: 20, margin: 5 }}>{item.name}</Text>
<Text style={{ margin: 5, color: '#b1b1b2' }}> <Text style={{ fontFamily: 'Gotham-Light', color: '#b1b1b2', fontSize: 15, margin: 5 }}>{item.full_address}</Text>
{item.full_address} <Text style={{ fontFamily: 'Gotham-Light', margin: 5, color: '#aeaead' }}>
</Text>
<Text style={{ margin: 5, color: '#aeaead' }}>
{item.distance} KM {item.distance} KM
</Text> </Text>
</View> </View>
<View style={{flex:1}}> <View style={{ flex: 1,top:20 }}>
<TouchableOpacity onPress={()=>{Linking.openURL('tel:(021) 56985640')}}> <TouchableOpacity onPress={() => { Linking.openURL('tel:(021) 56985640') }}>
<Icon <Icon
reverse name='ios-call'
name='ios-call' type='ionicon'
type='ionicon' color='grey'
color='#517fa4' size={40}
/> />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={{flex:1}}> <View style={{ flex: 1,top:20 }}>
<TouchableOpacity onPress={() => Linking.openURL('https://www.google.de/maps/@" ' + item.lat +"," + item.long)}> <TouchableOpacity onPress={() => Linking.openURL('https://www.google.com/maps/dir/?api=1&destination=' + item.lat + item.long)}>
<Icon <Icon
reverse name='ios-navigate'
name='ios-navigate' type='ionicon'
type='ionicon' color='grey'
color='#517fa4' size={40}
/> />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
); );
...@@ -264,7 +265,7 @@ class Outlets extends React.Component { ...@@ -264,7 +265,7 @@ class Outlets extends React.Component {
textContent={'Loading...'} textContent={'Loading...'}
textStyle={styles.spinnerTextStyle} textStyle={styles.spinnerTextStyle}
/> />
<View style={{ flex: 1, backgroundColor: 'red' }}> <View style={{ flex: 1 }}>
<MapView style={{ flex: 1 }} <MapView style={{ flex: 1 }}
region={{ region={{
latitude: this.state.my_lat, latitude: this.state.my_lat,
...@@ -277,13 +278,22 @@ class Outlets extends React.Component { ...@@ -277,13 +278,22 @@ class Outlets extends React.Component {
loadingEnabled={true} loadingEnabled={true}
provider={PROVIDER_GOOGLE} provider={PROVIDER_GOOGLE}
> >
<MapView.Marker
coordinate={{
latitude: this.state.my_lat,
longitude: this.state.my_long
}}
title={"Lokasi Kamu "}
description={this.state.street}
/>
</MapView> </MapView>
</View> </View>
<Text style={{ fontWeight: 'bold', fontSize: 20, margin: 5, color: '#ccb46c',textAlign:'center' }}>{this.state.data_name}</Text> <View style={{ height: 50, flexDirection: 'row' }}>
<View style={{ height: 70, flexDirection: 'row' }}>
<View style={{ flex: 1 }}></View> <View style={{ flex: 1 }}></View>
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<RNPickerSelect <RNPickerSelect
placeholder={{ label: 'Select Area', value: null }}
onValueChange={(label) => this.filterData(label)} onValueChange={(label) => this.filterData(label)}
items={this.state.data_outlet} items={this.state.data_outlet}
/> />
...@@ -320,11 +330,10 @@ const styles = StyleSheet.create({ ...@@ -320,11 +330,10 @@ const styles = StyleSheet.create({
body: { body: {
flex: 1, flex: 1,
margin: 20,
}, },
list_addrees: { list_addrees: {
flex: 3, flex: 3,
margin: 5, margin: 20,
}, },
searchbar: { searchbar: {
......
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