Skip to content

N
new_excelso
Commit 9c8e9df5 authored by Trisno's avatar Trisno
Browse files
Options

fix issue edit alamat tidak bisa save, dan update build 171

parent 1b94e9d7
Hide whitespace changes
Inline Side-by-side
Showing with 602 additions and 162 deletions
app.json
View file @ 9c8e9df5
{ {
"expo": { "expo": {
"extra" : { "extra" : {
"buildNumber" : "170", "buildNumber" : "171",
"remarks": "" "remarks": ""
}, },
......
redux/globalActionType.js
View file @ 9c8e9df5
...@@ -51,7 +51,6 @@ const ActionType = { ...@@ -51,7 +51,6 @@ const ActionType = {
SET_ACCOUNT_NUMBER:'SET_ACCOUNT_NUMBER', SET_ACCOUNT_NUMBER:'SET_ACCOUNT_NUMBER',
SET_MEMBER:'SET_MEMBER', SET_MEMBER:'SET_MEMBER',
SET_INBOX:'SET_INBOX', SET_INBOX:'SET_INBOX',
SET_EDIT_ADDRESS: 'SET_EDIT_ADDRESS'
} }
export default ActionType; export default ActionType;
\ No newline at end of file
redux/globalReducer.js
View file @ 9c8e9df5
...@@ -100,8 +100,7 @@ const globalState = { ...@@ -100,8 +100,7 @@ const globalState = {
old_balance_claimed: true, old_balance_claimed: true,
set_inbox :'', set_inbox :'',
email_confirm:false, email_confirm:false
edit_address : false,
} }
...@@ -164,13 +163,6 @@ const rootReducer = (state = globalState, action) => { ...@@ -164,13 +163,6 @@ const rootReducer = (state = globalState, action) => {
pointused: action.data.pointused, pointused: action.data.pointused,
} }
} }
case ActionType.SET_EDIT_ADDRESS: {
return {
...state,
edit_address: action.data.edit_address,
}
}
case ActionType.SET_PAGE: { case ActionType.SET_PAGE: {
return { return {
...state, ...state,
......
view/AddreesDetail.js
View file @ 9c8e9df5
...@@ -11,7 +11,6 @@ import MapView, { PROVIDER_GOOGLE } from 'react-native-maps'; ...@@ -11,7 +11,6 @@ import MapView, { PROVIDER_GOOGLE } from 'react-native-maps';
import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete'; import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import session from '../function/session'; import session from '../function/session';
import ActionType from '../redux/globalActionType';
class AddreesDetail extends React.Component { class AddreesDetail extends React.Component {
...@@ -30,15 +29,13 @@ class AddreesDetail extends React.Component { ...@@ -30,15 +29,13 @@ class AddreesDetail extends React.Component {
street: '', street: '',
city: '', city: '',
region: '', region: '',
name: '',
postalCode: '', postalCode: '',
address: '', address: '',
address_edit :this.props.route.params.data_address.name,
description_edit :this.props.route.params.data_address.address,
address_d: '', address_d: '',
spinner: false, spinner: false,
indicator: true, indicator: true,
caretHidden: true, caretHidden: true,
data: [],
} }
} }
...@@ -60,7 +57,6 @@ class AddreesDetail extends React.Component { ...@@ -60,7 +57,6 @@ class AddreesDetail extends React.Component {
} }
} }
//Current location (lokasi saat ini) //Current location (lokasi saat ini)
_getLocationAsync = async () => { _getLocationAsync = async () => {
this.setState({ this.setState({
...@@ -148,6 +144,10 @@ class AddreesDetail extends React.Component { ...@@ -148,6 +144,10 @@ class AddreesDetail extends React.Component {
indicator: false, indicator: false,
}) })
} }
} }
//searchlocation (mencari lokasi) //searchlocation (mencari lokasi)
...@@ -172,25 +172,13 @@ class AddreesDetail extends React.Component { ...@@ -172,25 +172,13 @@ class AddreesDetail extends React.Component {
} }
validation() { validation() {
if (this.state.name == '') {
if (this.props.edit_address == true) { Alert.alert(i18n.t('alertLabelAddress'))
if (this.state.address_edit == '') { } else if (this.state.description == '') {
Alert.alert('',i18n.t('alertLabelAddress')) Alert.alert(i18n.t('alertDetailAddress'))
} else if (this.state.description_edit == '') {
Alert.alert('',i18n.t('alertDetailAddress'))
} else {
this.saveAddress()
}
} else { } else {
if (this.state.name == '') { this.saveAddress()
Alert.alert('',i18n.t('alertLabelAddress'))
} else if (this.state.description == '') {
Alert.alert('',i18n.t('alertDetailAddress'))
} else {
this.saveAddress()
}
} }
} }
onChangeLocation = async (e) => { onChangeLocation = async (e) => {
...@@ -215,6 +203,7 @@ class AddreesDetail extends React.Component { ...@@ -215,6 +203,7 @@ class AddreesDetail extends React.Component {
latitude: location.lat, latitude: location.lat,
longitude: location.lng longitude: location.lng
} }
console.log(loc)
let detail = await Location.reverseGeocodeAsync(loc) let detail = await Location.reverseGeocodeAsync(loc)
// console.log(detail) // console.log(detail)
this.setState({ this.setState({
...@@ -228,67 +217,50 @@ class AddreesDetail extends React.Component { ...@@ -228,67 +217,50 @@ class AddreesDetail extends React.Component {
}) })
} }
saveAddress() { saveAddress() {
this.setState({ this.setState({
spinner: true, spinner: true,
}) })
const navigation = this.props.navigation const navigation = this.props.navigation
let name = "" let params = {
let description = "" session_id: this.props.session_id,
let address_id = "" address_id: '',
address: this.state.street + ' ' + this.state.city + ' ' + this.state.region + ' ' + this.state.postalCode,
if (this.props.edit_address == true) { name: this.state.name,
name = this.state.address_edit description: this.state.description,
description =this.state.description_edit lat: this.state.latitude,
address_id =this.props.route.params.data_address.id long: this.state.longitude
} else {
name =this.state.name
description =this.state.description
address_id =""
} }
// console.log(params)
let params = { Axios.post(this.props.BASE_URL + 'crm/v2/member/set_address', params).then(res => {
session_id:this.props.session_id, Alert.alert(
address:this.state.street + ' ' + this.state.city + ' ' + this.state.region + ' ' + this.state.postalCode, i18n.t('alertSuccessAddAddressTitle'),
name:name, i18n.t('alertSuccessAddAddressContent')
description:description,
lat:this.state.latitude, )
address_id:address_id, this.setState({
long:this.state.longitude spinner: false,
}
Axios.post(this.props.BASE_URL + 'crm/v2/member/set_address', params).then(res => {
Alert.alert(
i18n.t('alertSuccessAddAddressTitle'),
i18n.t('alertSuccessAddAddressContent')
)
this.setState({
spinner: false,
})
let setDataEditAddress = {
edit_address: false
}
this.props.editAddress(setDataEditAddress);
this.props.navigation.goBack()
this.props.route.params.onChangeAddress({ example: 'wakwaw' })
}) })
.catch(error => {
let response = error.response.data; this.props.navigation.goBack()
const { navigation } = this.props this.props.route.params.onChangeAddress({ example: 'wakwaw' })
session(response, navigation)
Alert.alert( }).catch(error => {
'', let response = error.response.data;
response.msg const { navigation } = this.props
) session(response, navigation)
this.setState({ Alert.alert(
spinner: false, '',
}) response.msg
)
this.setState({
spinner: false,
}) })
} })
}
render() { render() {
return ( return (
...@@ -339,7 +311,7 @@ class AddreesDetail extends React.Component { ...@@ -339,7 +311,7 @@ class AddreesDetail extends React.Component {
}} }}
/> />
</View> </View>
<View style={{ flex: 1, margin: 5, display: 'none' }} > <View style={{ flex: 1, margin: 5 , display:'none'}} >
<TouchableOpacity onPress={() => this._searchLocation()}> <TouchableOpacity onPress={() => this._searchLocation()}>
<Ionicons name="ios-search" size={32} color="#ccb46c" /> <Ionicons name="ios-search" size={32} color="#ccb46c" />
</TouchableOpacity> </TouchableOpacity>
...@@ -404,51 +376,37 @@ class AddreesDetail extends React.Component { ...@@ -404,51 +376,37 @@ class AddreesDetail extends React.Component {
</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 }}>{i18n.t('address_name')}</Text> <Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c", textAlign: 'center', fontSize: 18 }}>{i18n.t('address_name')}</Text>
{this.props.edit_address == true ? (<TextInput style={{ color: 'grey', fontFamily: 'Gotham-Black', height: 40, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey', textAlign: 'center' }} <TextInput style={{ color: 'grey', fontFamily: 'Gotham-Black', height: 40, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey', textAlign: 'center' }}
onChangeText={(address_edit) => this.setState({ address_edit })}
caretHidden={this.state.caretHidden}
value={this.state.address_edit}
onFocus={() => this.setState({ caretHidden: false })}/>):
( <TextInput style={{ color: 'grey', fontFamily: 'Gotham-Black', height: 40, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey', textAlign: 'center' }}
onChangeText={(name) => this.setState({ name })} onChangeText={(name) => this.setState({ name })}
caretHidden={this.state.caretHidden} caretHidden={this.state.caretHidden}
onFocus={() => this.setState({ caretHidden: false })} />)} onFocus={() => this.setState({ caretHidden: false })} />
</View> </View>
<View style={styles.field_detail_addrees}> <View style={styles.field_detail_addrees}>
<Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c", textAlign: 'center', fontSize: 18 }}>{i18n.t('address_fulladdress')}</Text> <Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c", textAlign: 'center', fontSize: 18 }}>{i18n.t('address_fulladdress')}</Text>
{this.props.edit_address == true ? (
<TextInput
style={{ color: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', height: 70, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey' }}
onChangeText={(description_edit) => this.setState({ description_edit })}
numberOfLines={10}
multiline={true}
value={this.state.description_edit}
caretHidden={this.state.caretHidden}
onFocus={() => this.setState({ caretHidden: false })} />):(
<TextInput <TextInput
style={{ color: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', height: 70, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey' }} style={{ color: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', height: 70, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey' }}
onChangeText={(description) => this.setState({ description })} onChangeText={(description) => this.setState({ description })}
numberOfLines={10} numberOfLines={10}
multiline={true} multiline={true}
caretHidden={this.state.caretHidden} caretHidden={this.state.caretHidden}
onFocus={() => this.setState({ caretHidden: false })} /> )} onFocus={() => this.setState({ caretHidden: false })} />
<Text style={{ color: '#666666', textAlign: 'center', fontSize: 14, paddingBottom: 15 }}>{i18n.t('address_fulladdress_helptext')}</Text> <Text style={{ color: '#666666', textAlign: 'center', fontSize: 14, paddingBottom: 15 }}>{i18n.t('address_fulladdress_helptext')}</Text>
</View> </View>
<View style={{ margin: 50, justifyContent: 'center' }}> <View style={{ margin: 50, justifyContent: 'center' }}>
{ {
// this.state.indicator == true ? ( this.state.indicator == true ? (
// <View style={{ height: 40, borderRadius: 10, backgroundColor: '#838383', justifyContent: 'center' }}> <View style={{ height: 40, borderRadius: 10, backgroundColor: '#838383', justifyContent: 'center' }}>
// <ActivityIndicator size="large" color="#c9af6d" /> <ActivityIndicator size="large" color="#c9af6d" />
// </View> </View>
// ) : ( ) : (
<TouchableOpacity onPress={() => this.validation()}> <TouchableOpacity onPress={() => this.validation()}>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center' }}> <View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('addaddress')}</Text> <Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('addaddress')}</Text>
</View> </View>
</TouchableOpacity> </TouchableOpacity>
// ) )
} }
</View> </View>
...@@ -522,23 +480,10 @@ const mapStateToProps = (state) => { ...@@ -522,23 +480,10 @@ const mapStateToProps = (state) => {
session_id: state.session_id, session_id: state.session_id,
language: state.language, language: state.language,
BASE_URL: state.BASE_URL, BASE_URL: state.BASE_URL,
edit_address: state.edit_address
}
}
const mapDispatchToProps = (dispacth) => {
return {
editAddress: (setDataEditAddress) => dispacth({
type: ActionType.SET_EDIT_ADDRESS,
data: {
edit_address:setDataEditAddress.edit_address
}
}),
} }
} }
export default connect(mapStateToProps)(AddreesDetail)
export default connect(mapStateToProps,mapDispatchToProps)(AddreesDetail)
\ No newline at end of file
view/Auth.js
View file @ 9c8e9df5
...@@ -26,6 +26,7 @@ import DeliveryAddress from './DeliveryAddrees'; ...@@ -26,6 +26,7 @@ import DeliveryAddress from './DeliveryAddrees';
import PickupName from './PickupName'; import PickupName from './PickupName';
import MenuConfirmation from './MenuConfirmation'; import MenuConfirmation from './MenuConfirmation';
import AddressDetail from './AddreesDetail'; import AddressDetail from './AddreesDetail';
import EditAddressDetail from './EditAddressDetail';
import ShoppingCart from './ShoppingCart'; import ShoppingCart from './ShoppingCart';
import TransferBalance from './TransferBalance'; import TransferBalance from './TransferBalance';
import CardInfo from './CardInfo'; import CardInfo from './CardInfo';
...@@ -521,6 +522,19 @@ class Auth extends React.Component { ...@@ -521,6 +522,19 @@ class Auth extends React.Component {
textAlign: 'center' textAlign: 'center'
}, title: 'TAMBAH ALAMAT' }, title: 'TAMBAH ALAMAT'
}} /> }} />
<Stack.Screen name="Edit Address" component={EditAddressDetail} options={{
headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign: 'center',
headerTintColor: '#fff',
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
fontSize: 20,
color: 'white',
textAlign: 'center'
}, title: 'EDIT ALAMAT'
}} />
<Stack.Screen name="Menu Detail" component={MenuDetail} <Stack.Screen name="Menu Detail" component={MenuDetail}
options={({ route }) => ({ options={({ route }) => ({
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
......
view/DeliveryAddrees.js
View file @ 9c8e9df5
import { EvilIcons, Ionicons, MaterialCommunityIcons } from '@expo/vector-icons'; import { EvilIcons, Ionicons, MaterialCommunityIcons, SimpleLineIcons } from '@expo/vector-icons';
import Axios from 'axios'; import Axios from 'axios';
import i18n from 'i18n-js'; import i18n from 'i18n-js';
import React from 'react'; import React from 'react';
...@@ -54,8 +54,7 @@ class DeliveryAddrees extends React.Component { ...@@ -54,8 +54,7 @@ class DeliveryAddrees extends React.Component {
} }
Axios.post(this.props.BASE_URL + 'crm/v2/member/get_address', params).then(res => { Axios.post(this.props.BASE_URL + 'crm/v2/member/get_address', params).then(res => {
const dataAlamat = res.data.data; const dataAlamat = res.data.data;
console.log("INI DATA :" + JSON.stringify(dataAlamat))
// console.log("INI DATA :" + JSON.stringify(dataAlamat))
let address = [] let address = []
for (let i = 0; i < dataAlamat.length; i++) { for (let i = 0; i < dataAlamat.length; i++) {
const element = dataAlamat[i]; const element = dataAlamat[i];
...@@ -74,8 +73,6 @@ class DeliveryAddrees extends React.Component { ...@@ -74,8 +73,6 @@ class DeliveryAddrees extends React.Component {
data_alamat.push(b) data_alamat.push(b)
}) })
// console.log(this.state.data)
}).catch(error => { }).catch(error => {
let response = error.response.data; let response = error.response.data;
...@@ -86,6 +83,8 @@ class DeliveryAddrees extends React.Component { ...@@ -86,6 +83,8 @@ class DeliveryAddrees extends React.Component {
}) })
} }
getRate(address_id) { getRate(address_id) {
// console.log('ADdress id : ' + address_id) // console.log('ADdress id : ' + address_id)
...@@ -136,15 +135,7 @@ class DeliveryAddrees extends React.Component { ...@@ -136,15 +135,7 @@ class DeliveryAddrees extends React.Component {
} }
addAdreess() { addAdreess() {
this.props.navigation.navigate('Address Detail', {data_address : "", 'data': 'sample', onChangeAddress: this.onChangeAddress }) this.props.navigation.navigate('Address Detail', { 'data': 'sample', onChangeAddress: this.onChangeAddress })
}
EditAdreess(data_address) {
this.props.navigation.navigate('Address Detail', { data_address : data_address,'data': 'sample', onChangeAddress: this.onChangeAddress })
let setDataEditAddress = {
edit_address: true
}
this.props.editAddress(setDataEditAddress);
} }
...@@ -210,9 +201,9 @@ class DeliveryAddrees extends React.Component { ...@@ -210,9 +201,9 @@ class DeliveryAddrees extends React.Component {
} }
if (this.props.value_voucher !== "") { if (this.props.value_voucher !== "") {
if(this.props.value_voucher.reward.type == 'percentage' ) { if (this.props.value_voucher.reward.type == 'percentage') {
this.handleVoucherSelect() this.handleVoucherSelect()
} }
} }
}).catch(error => { }).catch(error => {
...@@ -320,6 +311,17 @@ class DeliveryAddrees extends React.Component { ...@@ -320,6 +311,17 @@ class DeliveryAddrees extends React.Component {
); );
} }
handleEditAddress(id, name, address, description, lat, long) {
console.log('tes')
console.log(id)
console.log(name)
console.log(address)
console.log(description || 'kosong')
console.log(lat)
console.log(long)
this.props.navigation.navigate('Edit Address', { address_id: id, name: name, address: address, description: description, lat: lat, long: long })
}
renderItem = ({ item }) => { renderItem = ({ item }) => {
return ( return (
<View style={styles.list_addrees}> <View style={styles.list_addrees}>
...@@ -336,8 +338,8 @@ class DeliveryAddrees extends React.Component { ...@@ -336,8 +338,8 @@ class DeliveryAddrees extends React.Component {
uncheckedColor="#ccb46c" uncheckedColor="#ccb46c"
/> />
</View> </View>
<View style={{flex:3}}> <View style={{ bottom: 10 }}>
<Text style={{ textAlign: 'center', color: '#ccb46c', fontFamily: 'Gotham-Light', marginRight:5 }}>{i18n.t('selectaddress')}</Text> <Text style={{ textAlign: 'center', color: '#ccb46c', fontFamily: 'Gotham-Light' }}>{i18n.t('selectaddress')}</Text>
</View> </View>
</View> </View>
<View style={{ flex: 3, justifyContent: 'center' }}> <View style={{ flex: 3, justifyContent: 'center' }}>
...@@ -348,17 +350,10 @@ class DeliveryAddrees extends React.Component { ...@@ -348,17 +350,10 @@ class DeliveryAddrees extends React.Component {
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={{ flex: 1}}>
<TouchableOpacity style={{ flexDirection: 'row', justifyContent: "center" }} onPress={() =>this.EditAdreess(item)}>
<View style={{ alignSelf:'flex-end', marginTop: 20 }}>
{/* <EvilIcons name="pencil" size={40} color="#ccb46c" /> */}
</View>
</TouchableOpacity>
</View>
<View style={{ flex: 1 }}> <View style={{ flex: 1 }}>
<TouchableOpacity style={{ flexDirection: 'row', justifyContent: "center" }} onPress={() =>this.EditAdreess(item)}> <TouchableOpacity style={{ flex: 1, flexDirection: 'row', justifyContent: "center" }} onPress={() => this.handleEditAddress(item.id, item.name, item.address, item.description, item.lat, item.long)}>
<View style={{ alignSelf: "center", marginTop: 20 }}> <View style={{ alignSelf: "center", marginTop: 22, marginLeft: 35 }}>
<EvilIcons name="pencil" size={40} color="#ccb46c" /> <SimpleLineIcons name="pencil" size={25} color="#ccb46c" />
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
...@@ -368,7 +363,6 @@ class DeliveryAddrees extends React.Component { ...@@ -368,7 +363,6 @@ class DeliveryAddrees extends React.Component {
<EvilIcons name="trash" size={40} color="#ccb46c" /> <EvilIcons name="trash" size={40} color="#ccb46c" />
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
</View> </View>
...@@ -404,7 +398,6 @@ class DeliveryAddrees extends React.Component { ...@@ -404,7 +398,6 @@ class DeliveryAddrees extends React.Component {
</View> </View>
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={styles.listAddress}> <View style={styles.listAddress}>
{this.state.indicator == true ? ( {this.state.indicator == true ? (
<ActivityIndicator size="large" color="#c9af6d" /> <ActivityIndicator size="large" color="#c9af6d" />
...@@ -520,13 +513,6 @@ const mapDispatchToProps = (dispacth) => { ...@@ -520,13 +513,6 @@ const mapDispatchToProps = (dispacth) => {
} }
}), }),
editAddress: (setDataEditAddress) => dispacth({
type: ActionType.SET_EDIT_ADDRESS,
data: {
edit_address:setDataEditAddress.edit_address
}
}),
setGrab: (setGrabProps) => dispacth({ setGrab: (setGrabProps) => dispacth({
type: ActionType.SET_GRAB, type: ActionType.SET_GRAB,
data: { data: {
...@@ -567,4 +553,4 @@ const mapDispatchToProps = (dispacth) => { ...@@ -567,4 +553,4 @@ const mapDispatchToProps = (dispacth) => {
} }
} }
export default connect(mapStateToProps, mapDispatchToProps)(DeliveryAddrees) export default connect(mapStateToProps, mapDispatchToProps)(DeliveryAddrees)
\ No newline at end of file
view/EditAddressDetail.js 0 → 100644
View file @ 9c8e9df5
import { Ionicons, MaterialCommunityIcons } from '@expo/vector-icons';
import Axios from 'axios';
import * as Device from 'expo-device';
import * as Location from 'expo-location';
import * as Permissions from 'expo-permissions';
import i18n from 'i18n-js';
import React from 'react';
import { ActivityIndicator, Alert, Platform, StyleSheet, Text, TextInput, View, KeyboardAvoidingView } from 'react-native';
import { ScrollView, TouchableOpacity } from 'react-native-gesture-handler';
import MapView, { PROVIDER_GOOGLE } from 'react-native-maps';
import { GooglePlacesAutocomplete } from 'react-native-google-places-autocomplete';
import { connect } from 'react-redux';
import session from '../function/session';
class EditAddressDetail extends React.Component {
constructor(props) {
super(props)
this.state = {
latitude: 0,
longitude: 0,
location: null,
error_message: null,
name: '',
address_id: '',
description: '',
lat: '',
long: '',
street: '',
city: '',
region: '',
name: '',
postalCode: '',
address: '',
address_d: '',
spinner: false,
indicator: true,
caretHidden: true,
}
}
componentDidMount() {
// console.log(this.props.route.params)
this._getPermissions();
}
//Permission (melakukan izin)
_getPermissions = async () => {
let { status } = await Permissions.askAsync(Permissions.LOCATION);
if (status !== 'granted') {
Alert.alert(i18n.t('accessNotPermitted'))
} else if (Platform.OS === 'android' && !Device.isDevice) {
Alert.alert(i18n.t('tryItRealDevice'))
} else {
this._getLocationAsync()
}
}
//Current location (lokasi saat ini)
_getLocationAsync = async () => {
this.setState({
spinner: true,
})
// let location = await Location.getCurrentPositionAsync({
// accuracy: Location.Accuracy.Highest
// })
// console.log(location)
let loc = {
latitude: parseFloat(this.props.route.params.lat),
longitude: parseFloat(this.props.route.params.long),
}
// console.log(loc)
let detail = await Location.reverseGeocodeAsync(loc)
//ini benerin bug ketika jalan kosong
let street = detail[0].street
let city = detail[0].city
let region = detail[0].region
let postalCode = detail[0].postalCode
let latitude = parseFloat(this.props.route.params.lat);
let longitude = parseFloat(this.props.route.params.long);
this.setState({ latitude: latitude, longitude: longitude})
if (street == null) {
let str_city = city.replace('null', '')
let str_region = region.replace('null', '')
let str_postalCode = postalCode.replace('null', '')
this.setState({
street: '',
city: str_city,
region: str_region,
postalCode: str_postalCode,
indicator: false,
})
} else if (city == null) {
let str_street = street.replace('null', '')
let str_region = region.replace('null', '')
let str_postalCode = postalCode.replace('null', '')
this.setState({
street: str_street,
city: '',
region: str_region,
postalCode: str_postalCode,
indicator: false,
})
} else if (region == null) {
let str_street = street.replace('null', '')
let str_city = city.replace('null', '')
let str_postalCode = postalCode.replace('null', '')
this.setState({
street: str_street,
city: str_city,
region: '',
postalCode: str_postalCode,
indicator: false,
})
} else if (postalCode == null) {
let str_street = street.replace('null', '')
let str_city = city.replace('null', '')
let str_region = region.replace('null', '')
this.setState({
street: str_street,
city: str_city,
region: str_region,
postalCode: '',
indicator: false,
})
} else {
let str_street = street.replace('null', '')
let str_city = city.replace('null', '')
let str_region = region.replace('null', '')
let str_postalCode = postalCode.replace('null', '')
this.setState({
street: str_street,
city: str_city,
region: str_region,
postalCode: str_postalCode,
indicator: false,
})
}
this.setState({
name:this.props.route.params.name,
description:this.props.route.params.address
})
}
//searchlocation (mencari lokasi)
_searchLocation = async () => {
let search_location = await Location.geocodeAsync(this.state.address, Location.Accuracy.Balanced)
if (search_location.length === 0) {
Alert.alert(i18n.t('alertAddressNotFound'));
} else {
// console.log('bugging : ' + JSON.stringify(search_location))
let detail = await Location.reverseGeocodeAsync(search_location[0])
this.setState({
latitude: search_location[0].latitude,
longitude: search_location[0].longitude,
street: detail[0].street,
city: detail[0].city,
// name: detail[0].name,
region: detail[0].region,
postalCode: detail[0].postalCode,
})
}
// console.log('LATITUDE' + '' + this.state.latitude + '' + 'LONGITUDE' + this.state.longitude)
}
validation() {
if (this.state.name == '') {
Alert.alert(i18n.t('alertLabelAddress'))
} else if (this.state.description == '') {
Alert.alert(i18n.t('alertDetailAddress'))
} else {
this.saveAddress()
}
}
onChangeLocation = async (e) => {
// console.log(e.nativeEvent.coordinate)
this.setState({
latitude: e.nativeEvent.coordinate.latitude,
longitude: e.nativeEvent.coordinate.longitude,
})
let detail = await Location.reverseGeocodeAsync(e.nativeEvent.coordinate)
// console.log('ini detail : ', detail)
this.setState({
street: detail[0].street,
city: detail[0].city,
// name: detail[0].name,
region: detail[0].region,
postalCode: detail[0].postalCode,
})
}
onSubmit = async (location) => {
let loc = {
latitude: location.lat,
longitude: location.lng
}
let detail = await Location.reverseGeocodeAsync(loc)
// console.log(detail)
this.setState({
latitude: location.lat,
longitude: location.lng,
street: detail[0].street,
city: detail[0].city,
// name: detail[0].name,
region: detail[0].region,
postalCode: detail[0].postalCode,
})
}
saveAddress() {
this.setState({
spinner: true,
})
const navigation = this.props.navigation
let params = {
session_id: this.props.session_id,
address_id: this.props.route.params.address_id,
address: this.state.street + ' ' + this.state.city + ' ' + this.state.region + ' ' + this.state.postalCode,
name: this.state.name,
description: this.state.description,
lat: this.state.latitude,
long: this.state.longitude
}
console.log(params)
Axios.post(this.props.BASE_URL + 'crm/v2/member/set_address', params).then(res => {
Alert.alert(
i18n.t('alertSuccessAddAddressTitle'),
i18n.t('alertSuccessAddAddressContent')
)
this.setState({
spinner: false,
})
this.props.navigation.goBack()
this.props.route.params.onChangeAddress({ example: 'wakwaw' })
}).catch(error => {
let response = error.response.data;
const { navigation } = this.props
session(response, navigation)
Alert.alert(
'',
response.msg
)
this.setState({
spinner: false,
})
})
}
render() {
return (
<KeyboardAvoidingView
behavior={Platform.OS == 'ios' ? "padding" : "height"}
style={{ flex: 1 }}>
<View style={styles.container}>
<ScrollView keyboardShouldPersistTaps='handled'>
<View style={styles.content}>
<View style={{ borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 10, marginRight: 10 }}>
<View style={{ flex: 1, top: 5 }}>
<MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" />
</View>
<View style={{ flex: 6 }}>
<GooglePlacesAutocomplete
placeholder={i18n.t('findAddress')}
fetchDetails
onPress={(data, details = null) => {
this.onSubmit(details.geometry.location)
}}
textInputProps={{
onChangeText: (address) => { this.setState({ address }) },
onSubmitEditing: () => { this._searchLocation() }
}}
query={{
key: 'AIzaSyCnsGKSJtSNAbVAPX2cSNTQk2L97X7PX68',
language: 'en',
components: 'country:id',
}}
styles={{
textInputContainer: {
backgroundColor: 'rgba(0,0,0,0)',
borderTopWidth: 0,
borderBottomWidth: 0,
},
textInput: {
marginLeft: 0,
marginRight: 0,
height: 30,
color: '#5d5d5d',
fontSize: 14,
},
predefinedPlacesDescription: {
color: '#1faadb',
},
}}
/>
</View>
<View style={{ flex: 1, margin: 5 , display:'none'}} >
<TouchableOpacity onPress={() => this._searchLocation()}>
<Ionicons name="ios-search" size={32} color="#ccb46c" />
</TouchableOpacity>
</View>
</View>
<View style={styles.cont_google_map}>
<MapView
region={{
latitude: this.state.latitude,
longitude: this.state.longitude,
latitudeDelta: 0.001,
longitudeDelta: 0.001,
}}
onPress={(e) => this.onChangeLocation(e)}
zoomEnabled={true}
showsMyLocationButton={true}
loadingEnabled={true}
showsUserLocation={true}
showsScale={true}
provider={PROVIDER_GOOGLE}
zoomControlEnabled={true}
style={styles.cont_google_map}>
<MapView.Marker
draggable
onDragEnd={(e) => this.onChangeLocation(e)}
coordinate={{
latitude: this.state.latitude,
longitude: this.state.longitude
}}
title={i18n.t('yourLocation')}
description={this.state.street}
/>
</MapView>
<View style={{ position: 'absolute', top: '50%', alignSelf: 'flex-end' }}>
<View style={{ margin: 15 }}>
{/* <TouchableOpacity style={{ height: 30, width: 30, backgroundColor: 'red' }} onPress={() => this._getLocationAsync()}> */}
{/* <Image source={require('../assets/icon/gps.png')} style={{ height: 30, width: 30 }} /> */}
{/* </TouchableOpacity> */}
</View>
</View>
</View>
<View style={styles.name_addrees_input}>
<View style={{ flexDirection: 'row', top: 10, justifyContent: 'center' }}>
<View style={{ flex: 1, justifyContent: 'center', flexDirection: 'row' }}>
<MaterialCommunityIcons name="map-marker" size={32} color="#ccb46c" />
</View>
{this.state.indicator == true ? (
<ActivityIndicator size="large" color="#c9af6d" />
) : (
<View style={{ flex: 3, justifyContent: 'center' }}>
<Text style={{ fontFamily: 'Gotham-Light', textAlign: 'center' }}>{this.state.street}</Text>
<Text style={{ fontFamily: 'Gotham-Light', textAlign: 'center' }}>{this.state.city} </Text>
<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 style={styles.field_name_addrees}>
<Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c", textAlign: 'center', fontSize: 18 }}>{i18n.t('address_name')}</Text>
<TextInput style={{ color: 'grey', fontFamily: 'Gotham-Black', height: 40, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey', textAlign: 'center' }}
onChangeText={(name) => this.setState({ name })}
// placeholder={this.props.route.params.name}
value={this.state.name}
caretHidden={this.state.caretHidden}
onFocus={() => this.setState({ caretHidden: false })} />
</View>
<View style={styles.field_detail_addrees}>
<Text style={{ fontFamily: 'Gotham-Black', color: "#ccb46c", textAlign: 'center', fontSize: 18 }}>{i18n.t('address_fulladdress')}</Text>
<TextInput
style={{ color: 'grey', fontFamily: 'Gotham-Black', textAlign: 'center', height: 70, borderWidth: 1, padding: 5, flex: 1, margin: 10, borderRadius: 10, borderColor: 'grey' }}
onChangeText={(description) => this.setState({ description })}
// placeholder={this.props.route.params.address}
value={this.state.description}
numberOfLines={10}
multiline={true}
caretHidden={this.state.caretHidden}
onFocus={() => this.setState({ caretHidden: false })} />
<Text style={{ color: '#666666', textAlign: 'center', fontSize: 14, paddingBottom: 15 }}>{i18n.t('address_fulladdress_helptext')}</Text>
</View>
<View style={{ margin: 50, justifyContent: 'center' }}>
{
this.state.indicator == true ? (
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#838383', justifyContent: 'center' }}>
<ActivityIndicator size="large" color="#c9af6d" />
</View>
) : (
<TouchableOpacity onPress={() => this.validation()}>
<View style={{ height: 40, borderRadius: 10, backgroundColor: '#CFB368', justifyContent: 'center' }}>
<Text style={{ fontFamily: 'Gotham-Black', color: 'white', fontSize: 16, textAlign: 'center' }}>{i18n.t('addaddress')}</Text>
</View>
</TouchableOpacity>
)
}
</View>
<View style={{ height: 20 }}></View>
</View>
</View>
</ScrollView>
</View>
</KeyboardAvoidingView>
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#ffff'
},
header: {
flex: 0.5,
margin: 5,
},
content: {
flex: 3,
marginRight: 10,
marginLeft: 10,
},
field_search: {
flexDirection: 'column'
},
cont_google_map: {
flex: 1,
top: 5,
marginRight: 10,
marginLeft: 10,
height: 350,
},
name_addrees_input: {
flex: 1,
marginLeft: 10,
marginRight: 10,
top: 20
},
field_name_addrees: {
flexDirection: 'column',
top: 40,
justifyContent: 'center'
},
field_detail_addrees: {
top: 40,
},
button: {
height: 40,
margin: 10,
},
})
const mapStateToProps = (state) => {
return {
session_id: state.session_id,
language: state.language,
BASE_URL: state.BASE_URL,
}
}
export default connect(mapStateToProps)(EditAddressDetail)
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