Skip to content

E
eCartPro-Customer
Commit 100101c2 authored by Deni Rinaldi's avatar Deni Rinaldi
Browse files
Options

update mlm

parent 280d4484
Show whitespace changes
Inline Side-by-side
Showing with 319 additions and 67 deletions
App/Containers/ComplainScreen.js
View file @ 100101c2
import React, { Component } from 'react'
import { ScrollView, Image, View, Text, TouchableOpacity } from 'react-native'
import { ScrollView, Image, View, Text, TouchableOpacity, BackHandler } from 'react-native'
import { connect } from 'react-redux'
// Add Actions - replace 'Your' with whatever your reducer is called :)
// import YourActions from '../Redux/YourRedux'
......@@ -33,6 +33,19 @@ class ComplainScreen extends Component {
}
}
backAction = () => {
this.props.navigation.goBack()
return true;
};
componentDidMount() {
BackHandler.addEventListener("hardwareBackPress", this.backAction);
}
componentWillUnmount() {
BackHandler.removeEventListener("hardwareBackPress", this.backAction);
}
handleImagePicker(type) {
if (type == 'Galeri') {
ImagePicker.openPicker({
......@@ -58,12 +71,15 @@ class ComplainScreen extends Component {
} else {
ImagePicker.openCamera({
width: 480,
height: 296,
height: 480,
cropping: true,
compressImageQuality: 0.7,
mediaType: 'photo'
mediaType: 'photo',
includeBase64: true,
}).then(image => {
// console.log(image)
let imageBukti = this.state.imageBukti
imageBukti.push(image.data)
this.setState({ imageBukti });
});
}
}
......@@ -78,7 +94,7 @@ class ComplainScreen extends Component {
<TouchableOpacity style={{ paddingHorizontal: 20, paddingVertical: 10, borderBottomColor: 'black', borderBottomWidth: .4, }} onPress={() => this.setState({ modalPhoto: false }, () => this.handleImagePicker('Galeri'))}>
<BaseText type={"regular"} text={'Galeri'} style={{ fontSize: 16, color: 'black' }} />
</TouchableOpacity>
<TouchableOpacity style={{ paddingHorizontal: 20, paddingVertical: 10 }}>
<TouchableOpacity style={{ paddingHorizontal: 20, paddingVertical: 10 }} onPress={() => this.setState({ modalPhoto: false }, () => this.handleImagePicker('Camera'))}>
<BaseText type={"regular"} text={'Kamera'} style={{ fontSize: 16, color: 'black' }} />
</TouchableOpacity>
</View>
......@@ -105,13 +121,13 @@ class ComplainScreen extends Component {
searchablePlaceholderTextColor="#4cc9f0"
defaultValue={this.state.pickComplain}
containerStyle={{ height: 40 }}
style={{ backgroundColor: '#fafafa', elevation: 2, zIndex: 2 }}
style={{ backgroundColor: '#fff', elevation: 2, zIndex: 2 }}
itemStyle={{
justifyContent: 'flex-start'
}}
labelStyle={{ color: 'grey'}}
activeLabelStyle={{ color: '#4cc9f0'}}
dropDownStyle={{ backgroundColor: '#fafafa', elevation: 2, zIndex: 2, height: 200 }}
dropDownStyle={{ backgroundColor: '#fff', elevation: 2, zIndex: 2, height: 200 }}
onChangeItem={item => this.setState({
pickComplain: item.value
})}
......
App/Containers/CreateAddressScreen.js
View file @ 100101c2
......@@ -14,31 +14,36 @@ import { Images } from '../Themes'
import DropDownPicker from 'react-native-dropdown-picker';
import Api from '../Services/Api';
import { handlePhone } from '../Lib/Utils';
import { NavigationEvents } from 'react-navigation';
class CreateAddressScreen extends Component {
constructor(props) {
super(props)
this.state = {
provinsiData: [],
provinsi: "",
provinsi: null,
kotaData: [],
kota: "",
kota: null,
kecamatanData: [],
kecamatan: "",
kecamatan: null,
kelurahanData: [],
kelurahan: "",
kelurahan: null,
posData: [],
kodePos: "",
kodePos: null,
addressType: "",
receiverName: "",
phone: "",
kodePos: "",
address: "",
long: "",
lat: ""
lat: "",
addressID: ""
}
}
onSelect = data => {
this.setState(data)
}
backAction = () => {
this.props.navigation.goBack()
return true;
......@@ -46,14 +51,34 @@ class CreateAddressScreen extends Component {
componentDidMount() {
BackHandler.addEventListener("hardwareBackPress", this.backAction);
console.log(JSON.stringify(this.props.navigation.state))
if (this.props.navigation.state.params) {
let item = this.props.navigation.state.params.item
this.setState({
addressID: item.address_id,
addressType: item.type_address,
receiverName: item.receiver_name,
phone: String(item.receiver_phone).substring(1, 14),
address: item.address,
long: item.lng,
lat: item.lat
}, () => {
this.getProvinsi(item.provinsi_id)
this.getKota(item.provinsi_id, item.kabupaten_kota_id)
this.getKecamatan(item.kabupaten_kota_id, item.kecamatan_id)
this.getKelurahan(item.kecamatan_id, item.kelurahan_id)
this.getKodePos(item.kelurahan_id, item.kode_pos)
})
} else {
this.getProvinsi()
}
}
componentWillUnmount() {
BackHandler.removeEventListener("hardwareBackPress", this.backAction);
}
getProvinsi() {
getProvinsi(provinsi) {
let provinsiData = []
Api.create().getProvinsi().then((response) => {
if (response.data.status == "success") {
......@@ -63,12 +88,12 @@ class CreateAddressScreen extends Component {
value: item.provinsi_id
})
})
this.setState({ provinsiData })
this.setState({ provinsiData, provinsi: provinsi == undefined ? null : provinsi })
}
})
}
getKota(provID) {
getKota(provID, kota) {
let kotaData = []
Api.create().getKota(provID).then((response) => {
// console.log(provID, JSON.stringify(response))
......@@ -79,12 +104,12 @@ class CreateAddressScreen extends Component {
value: item.kabupaten_kota_id
})
})
this.setState({ kotaData })
this.setState({ kotaData, kota: kota == undefined ? null : kota })
}
})
}
getKecamatan(kecID) {
getKecamatan(kecID, kecamatan) {
let kecamatanData = []
Api.create().getKecamatan(kecID).then((response) => {
if (response.data.status == "success") {
......@@ -94,15 +119,15 @@ class CreateAddressScreen extends Component {
value: item.kecamatan_id
})
})
this.setState({ kecamatanData })
this.setState({ kecamatanData, kecamatan: kecamatan == undefined ? null : kecamatan })
}
})
}
getKelurahan(kelID) {
getKelurahan(kelID, kelurahan) {
let kelurahanData = []
Api.create().getKelurahan(kelID).then((response) => {
console.log(JSON.stringify(response.data))
// console.log(JSON.stringify(response.data))
if (response.data.status == "success") {
response.data.data.map((item) => {
kelurahanData.push({
......@@ -110,15 +135,15 @@ class CreateAddressScreen extends Component {
value: item.kelurahan_id
})
})
this.setState({ kelurahanData })
this.setState({ kelurahanData, kelurahan: kelurahan == undefined ? null : kelurahan })
}
})
}
getKodePos(kelID) {
getKodePos(kelID, kodePos) {
let posData = []
Api.create().getKodePos(kelID).then((response) => {
console.log(JSON.stringify(response.data))
// console.log(JSON.stringify(response.data))
if (response.data.status == "success") {
response.data.data.map((item) => {
posData.push({
......@@ -126,7 +151,7 @@ class CreateAddressScreen extends Component {
value: item.kode_pos
})
})
this.setState({ posData })
this.setState({ posData, kodePos: kodePos == undefined ? null : String(kodePos) })
}
})
}
......@@ -135,18 +160,46 @@ class CreateAddressScreen extends Component {
let body = {
"address_type": this.state.addressType,
"receiver_name": this.state.receiverName,
"receiver_phone": this.state.phone,
"receiver_phone": "0" + this.state.phone,
"provinsi_id": this.state.provinsi,
"kabupaten_kota_id": this.state.kota,
"kecamatan_id": this.state.kecamatan,
"kelurahan_id": this.state.kelurahan,
"kode_pos": this.state.kodePos,
"address": this.state.address,
"long": this.state.long,
"lat": this.state.lat
"long": String(this.state.long),
"lat": String(this.state.lat)
}
// console.log(body)
Api.create().addAddress(body).then((response) => {
console.log(JSON.stringify(response))
if (response.data.status == "success") {
this.backAction()
}
})
}
updateAddress() {
let body = {
"address_id": this.state.addressID,
"address_type": this.state.addressType,
"receiver_name": this.state.receiverName,
"receiver_phone": "0" + this.state.phone,
"provinsi_id": this.state.provinsi,
"kabupaten_kota_id": this.state.kota,
"kecamatan_id": this.state.kecamatan,
"kelurahan_id": this.state.kelurahan,
"kode_pos": this.state.kodePos,
"address": this.state.address,
"long": String(this.state.long),
"lat": String(this.state.lat)
}
// console.log(body)
Api.create().editAddress(body).then((response) => {
console.log(JSON.stringify(response))
if (response.data.status == "success") {
this.backAction()
}
})
}
......@@ -158,6 +211,7 @@ class CreateAddressScreen extends Component {
<View style={{ marginTop: 20 }}>
<BaseInput
title={"Nama Alamat"}
value={this.state.addressType}
placeholder={"Masukkan Nama Alamat Anda"}
blurOnSubmit={false}
onChangeText={(e) => {
......@@ -169,6 +223,7 @@ class CreateAddressScreen extends Component {
<View style={{ marginTop: 20 }}>
<BaseInput
title={"Nama Penerima"}
value={this.state.receiverName}
placeholder={"Masukkan Nama Penerima"}
blurOnSubmit={false}
onChangeText={(e) => {
......@@ -207,7 +262,7 @@ class CreateAddressScreen extends Component {
placeholderStyle={{ margin: 0, padding: 0 }}
searchable={true}
searchablePlaceholder={"Cari Provinsi"}
// defaultValue={this.state.provinsi}
defaultValue={this.state.provinsi}
containerStyle={{ height: 40 }}
style={{ marginHorizontal: 0, paddingHorizontal: 0, backgroundColor: '#fff', zIndex: 1, borderTopWidth: 0, borderLeftWidth: 0, borderRightWidth: 0 }}
itemStyle={{
......@@ -223,16 +278,16 @@ class CreateAddressScreen extends Component {
dropDownMaxHeight={200}
dropDownStyle={{ backgroundColor: '#fff', height: 200 }}
onChangeItem={item => this.setState({
provinsi: item.value,
provinsi: item.value, kota: null, kecamatan: null, kelurahan: null, kodePos: null
}, () => this.getKota(item.value))}
/>
</View>
<View style={{ marginTop: 20 }}>
<BaseText type={"regular"} text={'Kota'} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
<DropDownPicker
value={this.state.kota}
items={this.state.kotaData}
disabled={this.state.provinsi == "" ? true : false}
defaultValue={this.state.kota == null || this.state.kota == "" ? null : this.state.kota}
disabled={this.state.provinsi == "" || this.state.provinsi == null ? true : false}
placeholder={"Pilih Kota"}
placeholderStyle={{ margin: 0, padding: 0 }}
searchable={true}
......@@ -252,7 +307,7 @@ class CreateAddressScreen extends Component {
dropDownMaxHeight={200}
dropDownStyle={{ backgroundColor: '#fff', height: 200 }}
onChangeItem={item => this.setState({
kota: item.value, kecamatan: ""
kota: item.value, kecamatan: null, kelurahan: null, kodePos: null
}, () => this.getKecamatan(item.value))}
/>
</View>
......@@ -260,12 +315,12 @@ class CreateAddressScreen extends Component {
<BaseText type={"regular"} text={'Kecamatan'} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
<DropDownPicker
items={this.state.kecamatanData}
disabled={this.state.kota == "" ? true : false}
defaultValue={this.state.kecamatan == null ? null : this.state.kecamatan}
disabled={this.state.kota == "" || this.state.kota == null ? true : false}
placeholder={"Pilih Kecamatan"}
placeholderStyle={{ margin: 0, padding: 0 }}
searchable={true}
searchablePlaceholder={"Cari Kecamatan"}
// defaultValue={this.state.kota}
containerStyle={{ height: 40 }}
style={{ marginHorizontal: 0, paddingHorizontal: 0, backgroundColor: '#fff', zIndex: 1, borderTopWidth: 0, borderLeftWidth: 0, borderRightWidth: 0 }}
itemStyle={{
......@@ -281,7 +336,7 @@ class CreateAddressScreen extends Component {
dropDownMaxHeight={200}
dropDownStyle={{ backgroundColor: '#fff', height: 200 }}
onChangeItem={item => this.setState({
kecamatan: item.value, kelurahan: ""
kecamatan: item.value, kelurahan: null, kodePos: null
}, () => this.getKelurahan(item.value))}
/>
</View>
......@@ -289,7 +344,8 @@ class CreateAddressScreen extends Component {
<BaseText type={"regular"} text={'Kelurahan'} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
<DropDownPicker
items={this.state.kelurahanData}
disabled={this.state.kecamatan == "" ? true : false}
defaultValue={this.state.kelurahan == null ? null : this.state.kelurahan}
disabled={this.state.kecamatan == "" || this.state.kecamatan == null ? true : false}
placeholder={"Pilih Kelurahan"}
placeholderStyle={{ margin: 0, padding: 0 }}
searchable={true}
......@@ -309,7 +365,7 @@ class CreateAddressScreen extends Component {
dropDownMaxHeight={200}
dropDownStyle={{ backgroundColor: '#fff', height: 200 }}
onChangeItem={item => this.setState({
kelurahan: item.value, kodePos: ""
kelurahan: item.value, kodePos: null
}, () => this.getKodePos(item.value))}
/>
</View>
......@@ -317,7 +373,8 @@ class CreateAddressScreen extends Component {
<BaseText type={"regular"} text={'Kode Pos'} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
<DropDownPicker
items={this.state.posData}
disabled={this.state.kelurahan == "" ? true : false}
defaultValue={this.state.kodePos}
disabled={this.state.kelurahan == null ? true : false}
placeholder={"Pilih Kode Pos"}
placeholderStyle={{ margin: 0, padding: 0 }}
searchable={true}
......@@ -345,6 +402,7 @@ class CreateAddressScreen extends Component {
<BaseInput
title={"Alamat Pengirim"}
placeholder={"Masukkan Alamat Pengirim"}
value={this.state.address}
onChangeText={(e) => {
this.setState({ address: e })
}}
......@@ -352,22 +410,49 @@ class CreateAddressScreen extends Component {
</View>
<View style={{ marginTop: 20 }}>
<BaseText text={"Pin Lokasi"} type={"regular"} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
<TouchableOpacity style={{ borderWidth: .9, borderColor: '#d8d8d8', marginTop: 10, flexDirection: 'row', padding: 10, borderRadius: 4, backgroundColor: 'white', marginBottom: 10 }} onPress={() => this.props.navigation.navigate('MapViewScreen')}>
<TouchableOpacity style={{ borderWidth: .9, borderColor: '#d8d8d8', marginTop: 10, flexDirection: 'row', padding: 10, borderRadius: 4, backgroundColor: 'white', marginBottom: 10 }} onPress={() => this.props.navigation.navigate('MapViewScreen', { onSelect: this.onSelect.bind(this), long: this.state.long, lat: this.state.lat })}>
<View style={{ width: '20%' }}>
<View style={{ width: 40, height: 40, backgroundColor: '#d8d8d8', justifyContent: 'center', opacity: .5, }}>
<Image source={Images.map} style={{ height: 24, width: 18, alignSelf: 'center' }} />
</View>
</View>
{this.state.long != "" ?
<View style={{ width: '80%' }}>
<View style={{ flexDirection: 'row' }}>
<View style={{ width: "26%", }}>
<BaseText text={"Longitude"} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
</View>
<View style={{ width: "3%", }}>
<BaseText text={":"} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
</View>
<View style={{ width: "71%", }}>
<BaseText text={this.state.long == "" ? "-" : this.state.long} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
</View>
</View>
<View style={{ flexDirection: 'row' }}>
<View style={{ width: "26%", }}>
<BaseText text={"Latitude"} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
</View>
<View style={{ width: "3%", }}>
<BaseText text={":"} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
</View>
<View style={{ width: "71%", }}>
<BaseText text={this.state.lat == "" ? "-" : this.state.lat} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
</View>
</View>
</View> :
<View style={{ width: '80%', }}>
<BaseText text={"Sesuaikan lokasi"} type={"regular"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .7 }} />
<View style={{ borderWidth: .7, borderColor: '#d8d8d8', marginTop: 5 }} />
<BaseText text={"Lokasi harus sesuai dengan alamat diatas"} type={"regular"} style={{ fontSize: 10, color: '#4b4b4b', opacity: .7 }} />
</View>
}
</TouchableOpacity>
</View>
</ScrollView>
<View style={{ flexDirection: 'row', bottom: 0, width: '100%', justifyContent: 'space-around', paddingVertical: 20, paddingHorizontal: 20, borderTopWidth: .5, borderTopColor: 'rgba(0, 0, 0, 0.5)', elevation: 10, backgroundColor: 'white' }}>
<TouchableOpacity style={{ width: '45%', alignSelf: 'center', backgroundColor: 'white', borderRadius: 20, height: 40, justifyContent: 'center', borderColor: '#4cc9f0', borderWidth: .6 }}>
<TouchableOpacity style={{ width: '45%', alignSelf: 'center', backgroundColor: 'white', borderRadius: 20, height: 40, justifyContent: 'center', borderColor: '#4cc9f0', borderWidth: .6 }} onPress={()=> this.backAction()}>
<BaseText type={"bold"} text={'Batal'} style={{ fontSize: 12, color: '#4cc9f0', textAlign: 'center' }} />
</TouchableOpacity>
<TouchableOpacity style={{ width: '45%', alignSelf: 'center', backgroundColor: '#4cc9f0', borderRadius: 20, height: 40, justifyContent: 'center' }} onPress={() => this.createAddress()}>
......
App/Containers/ListAddressScreen.js
View file @ 100101c2
......@@ -10,6 +10,7 @@ import BaseHeader from '../Components/BaseHeader'
import { Images } from '../Themes'
import BaseText from '../Components/BaseText'
import Api from '../Services/Api'
import { NavigationEvents } from 'react-navigation'
class ListAddressScreen extends Component {
constructor(props) {
......@@ -35,7 +36,7 @@ class ListAddressScreen extends Component {
getAddress() {
Api.create().getAddress().then((response) => {
console.log('address', JSON.stringify(response.data))
// console.log('address', JSON.stringify(response.data))
if (response.data.status == "success") {
this.setState({
data: response.data.data
......@@ -50,10 +51,11 @@ class ListAddressScreen extends Component {
render() {
return (
<View style={{ flex: 1, backgroundColor: '#4cc9f0' }}>
<NavigationEvents onDidFocus={() => { this.getAddress() }} />
<BaseHeader leftText={'Pilih Alamat'} onBackPress={() => this.props.navigation.goBack()} />
<ScrollView style={[styles.scrollContent]}>
<View style={{ flexDirection: 'row', marginTop: 20 }}>
<TouchableOpacity onPress={()=> this.props.navigation.navigate('CreateAddressScreen')}>
<TouchableOpacity onPress={() => this.props.navigation.navigate('CreateAddressScreen')}>
<Image source={Images.add} style={{ height: 24, width: 24 }} />
</TouchableOpacity>
<BaseText type={"regular"} text={'Tambah Alamat'} style={{ fontSize: 12, color: 'black', marginLeft: 10, alignSelf: 'center' }} />
......@@ -61,19 +63,21 @@ class ListAddressScreen extends Component {
{this.state.data.map((item, index) => {
return (
<View style={{ borderRadius: 4, padding: 10, marginTop: 20, elevation: 4, backgroundColor: 'white', margin: 5 }} key={index}>
<BaseText type={"bold"} text={`${item.receiver_name}`} style={{ fontSize: 10, color: 'black' }} />
<BaseText type={"bold"} text={`${item.receiver_name} (${item.type_address})`} style={{ fontSize: 10, color: 'black' }} />
<BaseText type={"bold"} text={`${item.receiver_phone}`} style={{ fontSize: 10, color: 'black', marginTop: 5 }} />
<BaseText type={"regular"} text={`${item.address}, ${item.kelurahan_name}, ${item.kecamatan_name}, ${item.kabupaten_kota_name}, ${item.provinsi_name} ${item.kode_pos}`} style={{ fontSize: 10, color: '#4b4b4b', marginTop: 5 }} />
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flexDirection: 'row', marginTop: 10, height: 20 }}>
<Image source={Images.map} style={{ height: 16, width: 12 }} />
<BaseText type={"regular"} text={'Sudah Pin Point'} style={{ fontSize: 10, color: '#4b4b4b', alignSelf: 'center', marginLeft: 10 }} />
<BaseText type={"regular"} text={item.lat == "" ? "Belum Pin point" : 'Sudah Pin Point'} style={{ fontSize: 10, color: '#4b4b4b', alignSelf: 'center', marginLeft: 10 }} />
</View>
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginTop: 10 }}>
<View>
{item.select_status == 0 ? <View /> : <View>
<BaseText type={"bold"} text={'Alamat Utama'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</View>
</View>}
<View style={{ flexDirection: 'row', justifyContent: 'flex-end' }}>
<BaseText type={"bold"} text={'Ubah'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline', marginRight: 35 }} />
<TouchableOpacity style={{ marginRight: 35 }} onPress={() => this.props.navigation.navigate('CreateAddressScreen', { item, type: 'edit' })}>
<BaseText type={"bold"} text={'Ubah'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</TouchableOpacity>
<BaseText type={"bold"} text={'Hapus'} style={{ fontSize: 12, color: '#4cc9f0', textDecorationLine: 'underline' }} />
</View>
</View>
......
App/Containers/MapViewScreen.js
View file @ 100101c2
import React, { Component } from 'react'
import { ScrollView, Text, KeyboardAvoidingView, View } from 'react-native'
import { ScrollView, Text, TouchableOpacity, View, Platform, PermissionsAndroid, Image, BackHandler } from 'react-native'
import { connect } from 'react-redux'
import MapView, { Marker } from 'react-native-maps';
import MapView, { Marker, PROVIDER_GOOGLE } from 'react-native-maps';
import Icon from 'react-native-vector-icons/MaterialIcons'
import Geolocation from 'react-native-geolocation-service';
// Add Actions - replace 'Your' with whatever your reducer is called :)
// import YourActions from '../Redux/YourRedux'
// Styles
import styles from './Styles/MapViewScreenStyle'
import BaseHeader from '../Components/BaseHeader';
import { Images } from '../Themes';
import BaseText from '../Components/BaseText';
class MapViewScreen extends Component {
constructor(props) {
......@@ -19,20 +23,145 @@ class MapViewScreen extends Component {
latitudeDelta: 0.1,
longitudeDelta: 0.1
},
long: 24.92009056750823,
lat: 67.1012272143364
center: ""
}
}
backAction = () => {
this.props.navigation.goBack()
return true;
};
componentDidMount() {
BackHandler.addEventListener("hardwareBackPress", this.backAction);
if (this.props.navigation.state.params.long == "") {
if (Platform.OS == 'android') {
this._askAccessLocationPermission().then((res) => {
if (res == true) this._focusToUserLocation()
})
} else { this._focusToUserLocation() }
} else {
this.setState({
region: {
...this.state.region,
longitude: Number(this.props.navigation.state.params.long),
latitude: Number(this.props.navigation.state.params.lat),
}
})
}
}
componentWillUnmount() {
BackHandler.removeEventListener("hardwareBackPress", this.backAction);
}
async _askAccessLocationPermission() {
try {
var result = false
const resultPermission = await PermissionsAndroid.requestMultiple([
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
PermissionsAndroid.PERMISSIONS.ACCESS_COARSE_LOCATION])
Object.values(resultPermission).forEach(element => {
var bool = false
element === PermissionsAndroid.RESULTS.GRANTED ? bool = true : bool = false
// console.tron.log(bool)
result = bool
})
return result
} catch (err) {
// console.tron.log(err)
}
}
_focusToUserLocation() {
Geolocation.getCurrentPosition(
(position) => {
var region = {
latitude: position.coords.latitude,
longitude: position.coords.longitude,
latitudeDelta: 0.1,
longitudeDelta: 0.1,
}
this.setState({ region })
console.log('posisi', position)
}, (error) => {
// console.tron.log(error.code)
},
{ enableHighAccuracy: true, timeout: 15000, maximumAge: 10000 }
)
}
getLocation() {
console.log('masuk')
this.props.navigation.state.params.onSelect({
long: this.state.region.longitude,
lat: this.state.region.latitude,
})
this.backAction()
}
render() {
return (
<View style={{ flex: 1 }}>
<BaseHeader leftText={'Pilih Lokasi'} onBackPress={() => this.props.navigation.goBack()} />
<MapView style={{ flex: 1, }} region={this.state.region}
onPress={(e) => this.setState({ long: e.nativeEvent.coordinate.longitude, lat: e.nativeEvent.coordinate.latitude })}>
<Marker
coordinate={{ latitude: this.state.lat, longitude: this.state.long}}
/>
<MapView
style={{ flex: 1, }}
region={this.state.region}
provider={PROVIDER_GOOGLE}
// showsUserLocation={true}
followsUserLocation={true}
showsMyLocationButton={false}
showsPointsOfInterest={true}
showsCompass={true}
onRegionChangeComplete={e =>
this.setState({ region: e }
// fetch('https://maps.googleapis.com/maps/api/geocode/json?address=' + this.state.region.latitude + ',' + this.state.region.longitude + '&key=' + 'AIzaSyCTl0yP2k67rKKtAmPPTEFn3rcl-zSoKPY')
// .then((response) => response.json())
// .then((responseJson) => {
// // this.setState({ center: responseJson.results[0].formatted_address })
// })
)}
// onPress={(e) => this.setState({ long: e.nativeEvent.coordinate.longitude, lat: e.nativeEvent.coordinate.latitude })}
>
</MapView>
<View style={{
position: 'absolute',
top: '39%',
width: '100%'
}}>
<View style={{ backgroundColor: 'white', width: '80%', alignSelf: "center", marginBottom: 10, borderRadius: 5 }}>
<View style={{ padding: 10 }}>
<BaseText type={"regular"} text={"Latitude: " + this.state.region.latitude} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
<BaseText type={"regular"} text={"Longitude: " + this.state.region.longitude} style={{ fontSize: 12, color: 'black', opacity: .7 }} />
</View>
<TouchableOpacity style={{ backgroundColor: '#4cc9f0', width: "100%", paddingVertical: 10, borderBottomLeftRadius: 5, borderBottomRightRadius: 5 }} onPress={() => this.getLocation()}>
<BaseText type={"bold"} text={"Tetapkan"} style={{ fontSize: 12, color: 'white', opacity: .7, alignSelf: 'center' }} />
</TouchableOpacity>
</View>
<Image style={{
left: '50%', marginLeft: -18, height: 40, width: 29,
}} source={Images.map_addpin} />
</View>
<View style={{ position: "absolute", top: 100, paddingRight: 5, flexDirection: 'column', alignSelf: 'flex-end', flex: 1 }}>
<TouchableOpacity activeOpacity={.7}
style={{
backgroundColor: 'white',
borderRadius: 30,
padding: 10,
justifyContent: 'flex-end',
elevation: 10,
marginHorizontal: 5
}}
onPress={() => this._focusToUserLocation()}
>
<Icon name="my-location" size={25} style={{ alignSelf: 'center' }} color={'#0072bc'} />
</TouchableOpacity>
</View>
</View>
)
......
App/Services/Api.js
View file @ 100101c2
......@@ -81,6 +81,7 @@ const create = (baseURL = 'https://apiecart.eksad.com/mobile/') => {
const getKelurahan = (body) => api.get('get_kelurahan/' + body)
const getKodePos = (body) => api.get('get_kode_pos/' + body)
const addAddress = (body) => api.post('add_address/', body)
const editAddress = (body) => api.post('edit_address/', body)
// About App
const appInfo = () => api.get('app_info')
......@@ -126,7 +127,8 @@ const create = (baseURL = 'https://apiecart.eksad.com/mobile/') => {
getKecamatan,
getKelurahan,
getKodePos,
addAddress
addAddress,
editAddress
}
}
......
App/Themes/Images.js
View file @ 100101c2
......@@ -37,6 +37,7 @@ const images = {
map: require('../Images/Icons/map.png'),
icon_pesanansaya_gray: require('../Images/Icons/icon_pesanansaya_gray.png'),
icon_close: require('../Images/Icons/icon_close.png'),
map_addpin: require('../Images/Icons/map_addpin.png'),
// big image
letter: require('../Images/letter.png'),
......
android/app/build.gradle
View file @ 100101c2
......@@ -196,6 +196,7 @@ dependencies {
implementation "com.facebook.react:react-native:+" // From node_modules
implementation 'com.android.support:multidex:1.0.3'
implementation "com.google.firebase:firebase-analytics:17.2.2"
implementation "com.google.android.gms:play-services-location:16.0.0"
if (enableHermes) {
def hermesPath = "../../node_modules/hermes-engine/android/";
debugImplementation files(hermesPath + "hermes-debug.aar")
......
android/app/src/main/AndroidManifest.xml
View file @ 100101c2
......@@ -5,6 +5,8 @@
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<application
android:name=".MainApplication"
......
android/build.gradle
View file @ 100101c2
......@@ -9,6 +9,7 @@ buildscript {
supportLibVersion = "28.0.0"
playServicesVersion = "17.0.0"
androidMapsUtilsVersion = "1.3.1"
googlePlayServicesVersion = '16.0.0'
}
repositories {
google()
......@@ -33,7 +34,12 @@ allprojects {
// Android JSC is installed from npm
url("$rootDir/../node_modules/jsc-android/dist")
}
configurations.all {
resolutionStrategy {
force "com.google.android.gms:play-services-ads:$googlePlayServicesVersion"
force "com.google.android.gms:play-services-location:$googlePlayServicesVersion"
}
}
google()
jcenter()
maven { url 'https://jitpack.io' }
......
yarn.lock
View file @ 100101c2
......@@ -11164,6 +11164,11 @@ react-native-flipper@^0.34.0:
resolved "https://registry.yarnpkg.com/react-native-flipper/-/react-native-flipper-0.34.0.tgz#7df1f38ba5d97a9321125fe0fccbe47d99e6fa1d"
integrity sha512-48wgm29HJTOlZ0DibBsvXueEOY0EPIVL0wWKbwRfgrk86+luSEuLW3aZC50oJa95zSFb9qYShTV/6dWqh4Jamg==
react-native-geolocation-service@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/react-native-geolocation-service/-/react-native-geolocation-service-5.0.0.tgz#eaf0541c99db9cbed5af5e2ad2822d166e3a7543"
integrity sha512-y0uTtt/wT78i/7QestJJrZea9ZoYOzCP4fBgGbINWXU4f+OV3D8ndH7+nEOtnDKDhQc6YtJUeV7VqNxRI+hwBQ==
react-native-gesture-handler@1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.3.0.tgz#d0386f565928ccc1849537f03f2e37fd5f6ad43f"
......
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