Skip to content

C
clone_excelso
Commit 6cf089e2 authored by Trisno's avatar Trisno
Browse files
Options

ganti kolom pencarian alamat menggunakan google places

parent 17e45f8e
Show whitespace changes
Inline Side-by-side
Showing with 79 additions and 16 deletions
app.json
View file @ 6cf089e2
......@@ -35,7 +35,7 @@
"bundleIdentifier": "id.web.ravintola.excelsocrm",
"buildNumber": "2009041500",
"config": {
"googleMapsApiKey": "AIzaSyCvIFNvXKmBNetqPrV4VnjvF772avYbA3M"
"googleMapsApiKey": "AIzaSyCnsGKSJtSNAbVAPX2cSNTQk2L97X7PX68"
},
"infoPlist": {
"NSCameraUsageDescription": "This app uses the camera to capture data from ID cards for upgrade membership to Premium Account.",
......@@ -47,7 +47,7 @@
"versionCode": 2009041500,
"config": {
"googleMaps": {
"apiKey": "AIzaSyAcCfuNHVFstDUE-ZDafWsiUmA3ON79cqo"
"apiKey": "AIzaSyCnsGKSJtSNAbVAPX2cSNTQk2L97X7PX68"
}
}
},
......
package-lock.json
View file @ 6cf089e2
......@@ -4696,6 +4696,11 @@
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
"integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
},
"lodash.debounce": {
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
},
"lodash.get": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
......@@ -6755,6 +6760,16 @@
"prop-types": "^15.7.2"
}
},
"react-native-google-places-autocomplete": {
"version": "1.8.2",
"resolved": "https://registry.npmjs.org/react-native-google-places-autocomplete/-/react-native-google-places-autocomplete-1.8.2.tgz",
"integrity": "sha512-+bQPeSJCfq6nqdVSGJQTwe7djCzKHBT/ULuSjhWiijidWhKstVnZ/9bB8z/8Jpk0gHs0fYCJb0DFR3djFrg7uw==",
"requires": {
"lodash.debounce": "^4.0.8",
"prop-types": "^15.5.10",
"qs": "~6.9.1"
}
},
"react-native-i18n": {
"version": "2.0.15",
"resolved": "https://registry.npmjs.org/react-native-i18n/-/react-native-i18n-2.0.15.tgz",
......
view/AddreesDetail.js
View file @ 6cf089e2
......@@ -8,6 +8,7 @@ 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';
......@@ -181,12 +182,13 @@ class AddreesDetail extends React.Component {
}
onChangeLocation = async (e) => {
// console.log(e.nativeEvent.coordinate.latitude)
// 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,
......@@ -196,6 +198,24 @@ class AddreesDetail extends React.Component {
})
}
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({
......@@ -249,19 +269,45 @@ class AddreesDetail extends React.Component {
<View style={styles.container}>
<ScrollView>
<ScrollView keyboardShouldPersistTaps='handled'>
<View style={styles.content}>
<View style={{ height: 45, borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 10, marginRight: 10 }}>
<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 }}>
<TextInput style={{ height: 45 }} placeholder={i18n.t('findAddress')}
caretHidden={this.state.caretHidden}
onFocus={() => this.setState({ caretHidden: false })}
onChangeText={(address) => this.setState({ address })}
onSubmitEditing={() => this._searchLocation()}>
</TextInput>
<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',
}}
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 }}>
<TouchableOpacity onPress={() => this._searchLocation()}>
......@@ -269,6 +315,7 @@ class AddreesDetail extends React.Component {
</TouchableOpacity>
</View>
</View>
<View style={styles.cont_google_map}>
<MapView
region={{
......
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