Merge pull request #1274 from ever-co/feat/maximum-delivery-radius (8c88619c) · Commits · Isfand Yar Khan / ever-demand

packages/admin-web-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/delivery-areas/warehouse-manage-tabs-delivery-areas.component.html

+21 −0

Original line number	Diff line number	Diff line
		@@ -192,3 +192,24 @@
		</div>
		</div>
		</div>
		<div class="max-distance form-group" [formGroup]="form">
		<div class="number-input">
		<span>Maximum Delivery Radius (meters): </span>

		<input
		class="form-control"
		(change)="onMaxDistanceChange()"
		formControlName="maxDistance"
		type="number"
		placeholder="Radius"
		/>
		</div>
		<div class="checkbox">
		<nb-checkbox
		formControlName="showOnMap"
		(change)="onMaxDistanceChange()"
		status="success"
		>Show in map</nb-checkbox
		>
		</div>
		</div>

packages/admin-web-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/delivery-areas/warehouse-manage-tabs-delivery-areas.component.scss

+18 −0

Original line number	Diff line number	Diff line
		@@ -96,3 +96,21 @@
		}
		}
		}

		.max-distance {
		margin-bottom: 1rem;
		display: flex;
		width: 70%;
		align-items: center;
		justify-content: center;
		padding: 1rem;
		.number-input {
		margin-right: 2rem;
		display: flex;
		align-items: center;
		input {
		margin-left: 1rem;
		max-width: 8rem;
		}
		}
		}

packages/admin-web-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/delivery-areas/warehouse-manage-tabs-delivery-areas.component.ts

+47 −1

Original line number	Diff line number	Diff line
		import { Component, OnInit, ViewChild, Input, OnDestroy } from '@angular/core';
		import { Observable, Subject } from 'rxjs';
		import { takeUntil } from 'rxjs/operators';
		import { takeUntil, first } from 'rxjs/operators';
		import { FormGroup, FormBuilder } from '@angular/forms';

		@Component({
		@@ -46,6 +46,9 @@ export class WarehouseManageTabsDeliveryAreasComponent

		private _ngDestroy$ = new Subject<void>();

		private _storeLocation;
		private _maxDistanceZone;

		constructor(private fb: FormBuilder) {}

		ngOnInit() {
		@@ -58,9 +61,17 @@ export class WarehouseManageTabsDeliveryAreasComponent
		// would be used in the parent component and injected into this.form
		return formBuilder.group({
		deliveryAreas: '',
		maxDistance: 0,
		showOnMap: false,
		});
		}

		get maxDistance() {
		return this.form.get('maxDistance').value;
		}
		set maxDistance(distance) {
		this.form.get('maxDistance').setValue(distance);
		}
		get deliveryZones() {
		return this.form.get('deliveryAreas').value;
		}
		@@ -74,6 +85,7 @@ export class WarehouseManageTabsDeliveryAreasComponent
		const geoJSON = {
		type: 'FeatureCollection',
		features: [],
		maxDistance: this.maxDistance,
		};

		const features = [];
		@@ -127,6 +139,15 @@ export class WarehouseManageTabsDeliveryAreasComponent
		}

		setValue(data) {
		this.maxDistance = data.maxDistance;
		this.mapCoordEvent.pipe(first()).subscribe((location) => {
		if (location && this.form.get('showOnMap').value) {
		this._maxDistanceZone = this.createMaxDistanceCircle(
		location,
		data.maxDistance
		);
		}
		});
		// add type
		if (data && data.features.length > 0) {
		data.features.forEach((feature) => {
		@@ -401,6 +422,7 @@ export class WarehouseManageTabsDeliveryAreasComponent
		map: this._map,
		position: location,
		});
		this._storeLocation = location;
		});
		}

		@@ -420,6 +442,30 @@ export class WarehouseManageTabsDeliveryAreasComponent
		google.maps.event.addListener(this._map, 'click', this._clearSelection);
		}

		onMaxDistanceChange() {
		if (this._maxDistanceZone) {
		this.deleteZone(this._maxDistanceZone);
		}
		if (this._storeLocation && this.form.get('showOnMap').value) {
		this._maxDistanceZone = this.createMaxDistanceCircle(
		this._storeLocation,
		this.maxDistance
		);
		}
		}

		createMaxDistanceCircle(center, maxDistance) {
		const zone = new google.maps.Circle({
		center: center,
		radius: maxDistance,
		strokeWeight: 0.9,
		fillOpacity: 0.05,
		fillColor: '#000000',
		map: this._map,
		});
		return zone;
		}

		ngOnDestroy() {
		this._ngDestroy$.next();
		this._ngDestroy$.complete();

packages/admin-web-angular/src/app/@shared/warehouse/forms/warehouse-manage-tabs/warehouse-manage-tabs.component.ts

+1 −0

Original line number	Diff line number	Diff line
		@@ -163,5 +163,6 @@ export class WarehouseManageTabsComponent {
		this.tabSet.tabs._results[2].activeValue = false;
		this.tabSet.tabs._results[3].activeValue = false;
		this.tabSet.tabs._results[4].activeValue = false;
		this.tabSet.tabs._results[5].activeValue = false;
		}
		}