Skip to content

G
getme
Commit 8e0829a9 by Adarsh K
Options

address fix

parent adb569ba
Showing with 167 additions and 37 deletions
src/app/address/address.page.html
......@@ -22,14 +22,16 @@
<ion-grid *ngFor="let address of addressService.addressList; let i = index">
<ion-row>
<ion-col size="1">
<input type="radio" id="address_{{i}}" class="address-radio" name="address" (change)="setDefault(address.addressId)" [checked]="address.defaultVal == 1" />
<input type="radio" id="address_{{i}}" class="address-radio" name="address"
(change)="setDefault(address.addressId)" [checked]="address.defaultVal == 1" />
</ion-col>
<ion-col size="9">
<h1>{{address.addressType}}</h1>
<h1>{{address.address}}</h1>
<!-- <h1>{{address.address}}</h1> -->
<p>{{address.building}}, {{address.landmark}}</p>
</ion-col>
<ion-col size="2" [hidden]="address.defaultVal == 1"><button class="show-btn" (click)="addressService.deleteAddress(address.addressId)">
<ion-col size="2" [hidden]="address.defaultVal == 1"><button class="show-btn"
(click)="addressService.deleteAddress(address.addressId)">
<img src="../../assets/delete.png" /></button></ion-col>
</ion-row>
</ion-grid>
......
src/app/cart/cart.page.html
......@@ -321,7 +321,7 @@
<p>
{{address.building}}, <span
*ngIf="address.landmark && address.landmark!==''">{{address.landmark}},</span>
{{address.address}}
<!-- {{address.address}} -->
</p>
</div>
<div class="clear"></div>
......
src/app/changeaddress/changeaddress.page.html
......@@ -31,12 +31,18 @@
class="form-horizontal">
<div class="add_address_wrapper">
<h5>DELIVERY</h5>
<p>{{address}}</p>
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required
<!-- <p>{{address}}</p> -->
<!-- <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required
placeholder="House No./ Building No" />
<div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
Building Name is required
</div>
</div> -->
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building"
placeholder="House No./ Building No" [value]="address" (keydown.enter)="$event.preventDefault()"
autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #building />
<!-- <div class=" md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
Building Name is required
</div> -->
<input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark"
placeholder="Landmark" />
<ion-grid>
......
src/app/changeaddress/changeaddress.page.scss
......@@ -2,7 +2,7 @@
width: 100%;
height: 100vh;
.map-inner {
height: calc(100% - 348px);
height: calc(100% - 375px);
position: relative;
.map-pin {
position: absolute;
......@@ -11,8 +11,10 @@
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 20px;
height: 40px;
img {
margin-top: -23px;
margin-top: -20px;
display: block;
}
}
}
......@@ -60,6 +62,7 @@
margin: 0px;
padding: 0px;
font-weight: 800;
margin-bottom: 20px;
}
input {
width: 100%;
......@@ -143,7 +146,7 @@
}
}
.map-inner {
height: calc(100% - 235px);
height: calc(100% - 300px);
}
}
}
\ No newline at end of file
src/app/changeaddress/changeaddress.page.ts
......@@ -39,6 +39,7 @@ export class ChangeaddressPage implements OnInit {
lng: any;
newCenterLat: number;
newCenterLng: number;
@ViewChild('building', { static: false })
public searchElementRef: ElementRef;
constructor(
......@@ -76,6 +77,20 @@ export class ChangeaddressPage implements OnInit {
this.mapsAPILoader.load().then(() => {
this.setCurrentLocation();
this.geoCoder = new google.maps.Geocoder();
const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, {
types: ['address']
});
autocomplete.addListener('place_changed', () => {
this.ngZone.run(() => {
const place: google.maps.places.PlaceResult = autocomplete.getPlace();
if (place.geometry === undefined || place.geometry === null) {
return;
}
this.latitude = place.geometry.location.lat();
this.longitude = place.geometry.location.lng();
this.zoom = 16;
});
});
});
}
// google maps zoom level
......@@ -160,6 +175,8 @@ export class ChangeaddressPage implements OnInit {
}
onSubmit(data: any) {
console.log();
const buildAddress = this.searchElementRef.nativeElement.value;
this.loader = true;
this.service.get('order').then(val => {
console.log(val);
......@@ -178,11 +195,12 @@ export class ChangeaddressPage implements OnInit {
);
const distanceKM = (distanceNew / 1000).toFixed(2);
if (distanceKM < This.service.distance) {
console.log(buildAddress);
const orderId = val.orderId;
const postData: Address = {
address: This.address,
addressType: data.addressType,
building: data.building,
address: '',
building: buildAddress,
landmark: data.landmark !== undefined ? data.landmark : '',
defaultVal: 0,
uid: This.uid,
......
src/app/home/home.page.html
......@@ -141,6 +141,12 @@
</div>
</ion-header>
<ion-content class="sort_wrappper">
<div class="location-finder">
<input type="text" placeholder="Search for location" (keydown.enter)="$event.preventDefault()"
autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #building>
</div>
<agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false"
[backgroundColor]="'rgba(29, 27, 130,0.2)'">
<agm-marker [latitude]="lat" [longitude]="lng" [iconUrl]="
......@@ -173,7 +179,7 @@
<p>
{{address.building}}, <span
*ngIf="address.landmark && address.landmark!==''">{{address.landmark}},</span>
{{address.address}}
<!-- {{address.address}} -->
</p>
</div>
<div class="clear"></div>
......
src/app/home/home.page.scss
......@@ -255,6 +255,43 @@
right: 0px;
bottom: 0px;
z-index: 99;
.location-finder {
position: absolute;
top: 15px;
left: 0;
right: 0;
padding: 0 20px;
z-index: 1;
input {
width: 100%;
border: 1px solid #e0e0e0;
outline: none;
padding: 8px 15px 8px 35px;
border-radius: 25px;
background-image: url('/assets/search_2.png');
background-position: 15px;
background-repeat: no-repeat;
background-size: 15px;
}
}
agm-map {
width: 100%;
height: 100vh;
......
src/app/home/home.page.ts
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, ViewChild, ElementRef, NgZone } from '@angular/core';
import { Location } from '@angular/common';
import { trigger, transition, animate, style } from '@angular/animations';
import { MapsAPILoader, MouseEvent } from '@agm/core';
......@@ -35,7 +35,7 @@ import { AuthService } from 'src/config/auth.service';
]
})
export class HomePage implements OnInit {
isShow = false;
isShow = true;
searchShow = false;
public lat = 51.678418;
public lng = 7.809007;
......@@ -47,6 +47,8 @@ export class HomePage implements OnInit {
slideOpts = {
slidesPerView: 1.5
};
@ViewChild('building', { static: false })
public searchElementRef: ElementRef;
constructor(
private router: Router,
......@@ -63,11 +65,12 @@ export class HomePage implements OnInit {
private searchService: SearchService,
private productsService: ProductsService,
private subjectService: SubjectService,
private authService: AuthService
private authService: AuthService,
private ngZone: NgZone,
) {
this.loader = false;
this.address = 'Pick your Location';
this.isShow = false;
const users = this.service.get('user').then(data => {
if (data) {
data = JSON.parse(data);
......@@ -97,6 +100,35 @@ export class HomePage implements OnInit {
this.menuCtrl.enable(true);
}
resetMap() {
console.log('called');
const This = this;
setTimeout(() => {
This.mapsAPILoader.load().then(() => {
This.setCurrentLocation();
This.geoCoder = new google.maps.Geocoder();
const autocomplete = new google.maps.places.Autocomplete(This.searchElementRef.nativeElement, {
types: ['address']
});
autocomplete.addListener('place_changed', () => {
This.ngZone.run(() => {
const place: google.maps.places.PlaceResult = autocomplete.getPlace();
if (place.geometry === undefined || place.geometry === null) {
return;
}
This.lat = place.geometry.location.lat();
This.lng = place.geometry.location.lng();
This.getAddress(This.lat, This.lng);
console.log(This.lat, This.lng, This.service.distance);
This.centerService.getNearBy(This.lat, This.lng, This.service.distance);
This.istoggle();
});
});
});
}, 1000);
}
private setCurrentLocation() {
const This = this;
if ('geolocation' in navigator) {
......@@ -137,6 +169,8 @@ export class HomePage implements OnInit {
.setDefaultAddress(address.addressId, this.custId)
.then(() => {
this.address = address.address;
this.lat = address.latLng.latitude;
this.lng = address.latLng.longitude;
console.log(address.latLng);
this.centerService.getNearBy(
address.latLng.latitude,
......@@ -190,6 +224,9 @@ export class HomePage implements OnInit {
istoggle() {
this.isShow = !this.isShow;
if (this.isShow) {
this.resetMap();
}
console.log(this.isShow, 'Is SHow');
this.subjectService.setTabData(!this.isShow);
}
......
src/app/nearby/nearby.page.html
......@@ -20,7 +20,7 @@
<ion-content>
<div class="nearby_map">
<div class="map-inner">
<agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="8"
<agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="zoom"
[backgroundColor]="'rgba(29, 27, 130,0.2)'" (mapReady)="mapReady($event)"
(centerChange)="centerChange($event)">
<agm-marker [markerDraggable]="true" (dragEnd)="markerDragEnd($event)" [iconUrl]="
......@@ -37,12 +37,12 @@
class="form-horizontal">
<div class="add_address_wrapper">
<h5>DELIVERY</h5>
<p>{{address}}</p>
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required
placeholder="House No./ Building No" />
<div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building"
placeholder="House No./ Building No" [value]="address" (keydown.enter)="$event.preventDefault()"
autocorrect="off" autocapitalize="off" spellcheck="off" type="text" #building />
<!-- <div class=" md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
Building Name is required
</div>
</div> -->
<input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark"
placeholder="Landmark" />
<ion-grid>
......
src/app/nearby/nearby.page.scss
......@@ -6,7 +6,7 @@
width: 100%;
height: 100%;
.map-inner {
height: calc(100% - 348px);
height: calc(100% - 324px);
position: relative;
.map-pin {
position: absolute;
......@@ -15,8 +15,10 @@
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 20px;
height: 40px;
img {
margin-top: -23px;
margin-top: -20px;
display: block;
}
}
}
......@@ -74,6 +76,7 @@
margin: 0px;
padding: 0px;
font-weight: 800;
margin-bottom: 20px;
}
input {
width: 100%;
......@@ -166,7 +169,7 @@
}
}
.map-inner {
height: calc(100% - 235px);
height: calc(100% - 250px);
}
}
}
\ No newline at end of file
src/app/nearby/nearby.page.ts
......@@ -33,6 +33,7 @@ export class NearbyPage implements OnInit {
uid: string;
type: any;
loader: boolean;
@ViewChild('building', { static: false })
public searchElementRef: ElementRef;
newCenterLat: number;
......@@ -67,6 +68,20 @@ export class NearbyPage implements OnInit {
this.mapsAPILoader.load().then(() => {
this.setCurrentLocation();
this.geoCoder = new google.maps.Geocoder();
const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, {
types: ['address']
});
autocomplete.addListener('place_changed', () => {
this.ngZone.run(() => {
const place: google.maps.places.PlaceResult = autocomplete.getPlace();
if (place.geometry === undefined || place.geometry === null) {
return;
}
this.latitude = place.geometry.location.lat();
this.longitude = place.geometry.location.lng();
this.zoom = 16;
});
});
});
}
// google maps zoom level
......@@ -75,14 +90,14 @@ export class NearbyPage implements OnInit {
console.log('map-called');
if ('geolocation' in navigator) {
console.log(navigator);
this.latitude = -33.87276;
this.longitude = 151.20534;
this.zoom = 8;
/* this.latitude = -33.87276;
this.longitude = 151.20534; */
this.zoom = 24;
this.getAddress(this.latitude, this.longitude);
navigator.geolocation.getCurrentPosition(position => {
this.latitude = position.coords.latitude;
this.longitude = position.coords.longitude;
this.zoom = 8;
this.zoom = 24;
this.getAddress(this.latitude, this.longitude);
});
}
......@@ -104,7 +119,7 @@ export class NearbyPage implements OnInit {
console.log(status);
if (status === 'OK') {
if (results[0]) {
this.zoom = 12;
this.zoom = 24;
this.address = results[0].formatted_address;
console.log(this.address);
} else {
......@@ -144,8 +159,8 @@ export class NearbyPage implements OnInit {
console.log(data);
const postData: Address = {
address: this.address,
addressType: data.addressType,
building: data.building,
addressType: '',
building: this.searchElementRef.nativeElement.value,
landmark: data.landmark !== undefined ? data.landmark : '',
defaultVal: 0,
uid: this.uid,
......
src/app/orderplaced/orderplaced.page.html
......@@ -115,7 +115,8 @@
</div>
<h5 *ngIf="data.deliveryAddress">
{{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}},
{{data.deliveryAddress.addressType}}
<!-- ,<br />{{data.deliveryAddress.address}} -->,
<br /> {{data.deliveryAddress.building}}<span
*ngIf="data.deliveryAddress.landmark && data.deliveryAddress.landmark!==''"><br />,
{{data.deliveryAddress.landmark}}</span>
......
src/config/center.service.ts
......@@ -56,7 +56,7 @@ export class CenterService {
}
public async getNearBy(latitude, longitude, distance) {
console.log(distance);
console.log(latitude, longitude, distance);
const This = this;
const state = true;
......@@ -103,7 +103,7 @@ export class CenterService {
};
this.nearcenters.push(center);
});
// console.log(this.nearcenters);
console.log(this.nearcenters);
} else {
// alert('No Orders Found');
}
......
src/index.html
......@@ -19,7 +19,7 @@
<body>
<script
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBnCzDk6ec1OJFcW5FYgxP3LWVHMNumGDM&libraries=geometry"></script>
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBnCzDk6ec1OJFcW5FYgxP3LWVHMNumGDM&libraries=geometry,places"></script>
<app-root></app-root>
</body>
......
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