feat: add carrier orders list

packages/carrier-mobile-ionic/src/app/app.module.ts

@@ -27,6 +27,7 @@ import { AppRoutingModule } from './app-routing.module';
 import { RouteReuseStrategy } from '@angular/router';
 import { AppComponent } from './app.component';
 import { MenuModule } from 'components/menu/menu.module';
+import { OrdersListModule } from 'components/orders-list/orders-list.module';
 
 @NgModule({
 	schemas: [NO_ERRORS_SCHEMA],
@@ -49,6 +50,7 @@ import { MenuModule } from 'components/menu/menu.module';
 		}),
 		HttpClientModule,
 		PipesModule,
+		OrdersListModule,
 	],
 	bootstrap: [AppComponent],
 	entryComponents: [AppComponent],

packages/carrier-mobile-ionic/src/assets/i18n/en.json

@@ -10,6 +10,7 @@
 	},
 	"MENU": {
 		"MAIN": "Main",
+		"ORDERS_LIST": "Orders List",
 		"DELIVERIES": "Deliveries",
 		"SETTINGS": "Settings",
 		"LANGUAGE": "Language",
@@ -80,5 +81,9 @@
 	},
 	"LIST_VIEW": {
 		"YOU_NAVIGATED_HERE_FROM": "You navigated here from"
+	},
+	"ORDERS_LIST": {
+		"TITLE": "Select Order for Delivery ... ",
+		"BACK": "BACK"
 	}
 }

packages/carrier-mobile-ionic/src/components/menu/menu.component.html

@@ -27,7 +27,12 @@ <h1 class="title header-bar-big-title">
 							{{ 'MENU.MAIN' | translate }}
 						</ion-label>
 					</ion-item>
-
+					<ion-item button (click)="openOrdersListModal()">
+						<ion-icon name="documents-outline"></ion-icon>
+						<ion-label>
+							{{ 'MENU.ORDERS_LIST' | translate }}
+						</ion-label>
+					</ion-item>
 					<ion-item
 						routerLink="/deliveries"
 						routerDirection="root"

packages/carrier-mobile-ionic/src/components/menu/menu.component.ts

@@ -1,6 +1,8 @@
 import { Component } from '@angular/core';
 import { Store } from 'services/store.service';
 import { environment } from 'environments/environment';
+import { ModalController } from '@ionic/angular';
+import { OrdersListComponent } from '../orders-list/orders-list.component';
 
 @Component({
 	selector: 'e-cu-menu',
@@ -10,7 +12,7 @@ import { environment } from 'environments/environment';
 export class MenuComponent {
 	companyName: string;
 
-	constructor(private store: Store) {
+	constructor(private store: Store, private modalCtrl: ModalController) {
 		this.companyName = environment.APP_NAME;
 	}
 
@@ -19,4 +21,12 @@ export class MenuComponent {
 	}
 
 	menuOpened() {}
+
+	async openOrdersListModal() {
+		const modal = await this.modalCtrl.create({
+			component: OrdersListComponent,
+			cssClass: 'orders-list-modal',
+		});
+		await modal.present();
+	}
 }

packages/carrier-mobile-ionic/src/components/orders-list/orders-list.component.html

@@ -0,0 +1,53 @@
+<ion-header>
+	<ion-toolbar color="primary">
+		<ion-title>{{ 'ORDERS_LIST.TITLE' | translate }}</ion-title>
+	</ion-toolbar>
+</ion-header>
+
+<ion-content fullscreen color="light">
+	<ion-card button *ngFor="let order of filteredList">
+		<ion-card-content (click)="selectNewOrder(order.id)">
+			<ion-item>
+				<ion-avatar slot="start">
+					<img [src]="order.warehouse.logo" />
+				</ion-avatar>
+				<ion-label>
+					<p>Restorant: {{ order.warehouse.name }}</p>
+					<p>
+						Phone: {{ order.warehouse.contactPhone || 'Missing' }}
+					</p>
+					<p>
+						Email: {{ order.warehouse.cantactEmail || 'Missing' }}
+					</p>
+				</ion-label>
+			</ion-item>
+
+			<ion-item>
+				<ion-avatar slot="start">
+					<img [src]="order.user.image" />
+				</ion-avatar>
+				<ion-label>
+					<p>
+						Name: {{ order.user.firstName }}
+						{{ order.user.lastName }}
+					</p>
+					<p>Phone: {{ order.user.phone || 'Missing' }}</p>
+					<p>Email: {{ order.user.email || 'Missing' }}</p>
+					<p>Adress: {{ order.user.fullAddress || 'Missing' }}</p>
+				</ion-label>
+			</ion-item>
+			<ion-item lines="none"
+				><ion-label color="tertiary" slot="end"
+					><h1>Tital Price: {{ order.totalPrice }}$</h1></ion-label
+				>
+			</ion-item>
+		</ion-card-content>
+	</ion-card>
+	<h1 *ngIf="!filteredList.length" class="no-orders">Not found orders...</h1>
+</ion-content>
+
+<ion-tab-bar slot="bottom" color="primary">
+	<ion-tab-button (click)="closeOrderListModal()" tab="schedule">
+		<ion-label>{{ 'ORDERS_LIST.BACK' | translate }}</ion-label>
+	</ion-tab-button>
+</ion-tab-bar>

packages/carrier-mobile-ionic/src/components/orders-list/orders-list.component.scss

@@ -0,0 +1,4 @@
+.no-orders {
+	text-align: center;
+	padding: 1rem 0;
+}

packages/carrier-mobile-ionic/src/components/orders-list/orders-list.component.ts

@@ -0,0 +1,106 @@
+import { Component, OnInit, NgZone } from '@angular/core';
+import { ModalController } from '@ionic/angular';
+import { GeoLocationOrdersService } from '../../services/geo-location-order.service';
+import { CarrierRouter } from '@modules/client.common.angular2/routers/carrier-router.service';
+import { Store } from 'services/store.service';
+import { GeoLocationService } from '../../services/geo-location.service';
+import { Geolocation } from '@ionic-native/geolocation/ngx';
+import IGeoLocation from '@modules/server.common/interfaces/IGeoLocation';
+import { OrderRouter } from '@modules/client.common.angular2/routers/order-router.service';
+import IOrder from '@modules/server.common/interfaces/IOrder';
+import { CarrierOrdersRouter } from '@modules/client.common.angular2/routers/carrier-orders-router.service';
+import { Router } from '@angular/router';
+
+@Component({
+	selector: 'orders-list-modal',
+	templateUrl: './orders-list.component.html',
+	styleUrls: ['./orders-list.component.scss'],
+})
+export class OrdersListComponent implements OnInit {
+	filteredList = [];
+	private carrier;
+	private carrier$;
+	private orders$;
+
+	constructor(
+		private modalCtrl: ModalController,
+		private geoLocationOrdersService: GeoLocationOrdersService,
+		private carrierRouter: CarrierRouter,
+		private store: Store,
+		private geolocation: Geolocation,
+		private geoLocationService: GeoLocationService,
+		private orderRouter: OrderRouter,
+		private carrierOrdersRouter: CarrierOrdersRouter,
+
+		private ngZone: NgZone,
+		private router: Router
+	) {}
+
+	ngOnInit() {
+		this.loadOrderslist();
+	}
+
+	filterOrdersList(orders) {
+		this.filteredList = [].concat(orders);
+	}
+
+	async loadOrderslist() {
+		this.carrier$ = this.carrierRouter
+			.get(this.store.carrierId)
+			.subscribe(async (carrier) => {
+				this.carrier = carrier;
+				const position = this.geoLocationService.defaultLocation()
+					? this.geoLocationService.defaultLocation()
+					: await this.geolocation.getCurrentPosition();
+
+				let dbGeoInput = {
+					loc: {
+						type: 'Point',
+						coordinates: [
+							position.coords.longitude,
+							position.coords.latitude,
+						],
+					},
+				} as IGeoLocation;
+
+				this.orders$ = this.geoLocationOrdersService
+					.getOrdersForWork(
+						dbGeoInput,
+						carrier.skippedOrderIds,
+						{
+							limit: 10,
+						},
+						{
+							isCancelled: false,
+						}
+					)
+					.subscribe((list) => {
+						this.filterOrdersList(list);
+					});
+			});
+	}
+
+	selectNewOrder(id) {
+		//checking if selected order is started
+		//its not possible to take 2 orders a the same time for now
+
+		const status = this.store.selectedOrder.carrierStatus;
+		if (status !== 0) {
+			//todo add message popup error
+			alert('You are already in delivery ...');
+		} else {
+			this.store.orderId = id;
+		}
+		this.closeOrderListModal();
+	}
+
+	async closeOrderListModal() {
+		this.destroyAll();
+		await this.modalCtrl.dismiss();
+	}
+
+	destroyAll() {
+		this.carrier$ ? this.carrier$.unsubscribe() : null;
+		this.orders$ ? this.orders$.unsubscribe() : null;
+	}
+}

packages/carrier-mobile-ionic/src/components/orders-list/orders-list.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IonicModule } from '@ionic/angular';
+import { OrdersListComponent } from './orders-list.component';
+import { GeoLocationOrdersService } from '../../services/geo-location-order.service';
+import { Geolocation } from '@ionic-native/geolocation/ngx';
+import { GeoLocationService } from '../../services/geo-location.service';
+import { TranslateModule } from '@ngx-translate/core';
+
+@NgModule({
+	imports: [CommonModule, IonicModule, TranslateModule.forChild()],
+	declarations: [OrdersListComponent],
+	entryComponents: [OrdersListComponent],
+	exports: [OrdersListComponent],
+	providers: [GeoLocationOrdersService, Geolocation, GeoLocationService],
+})
+export class OrdersListModule {}

packages/carrier-mobile-ionic/src/pages/main/drive-to-warehouse/drive-to-warehouse.ts

@@ -37,6 +37,7 @@ export class DriveToWarehousePage implements OnInit {
 
 	carrier$;
 	order$;
+	orderId$;
 
 	constructor(
 		private orderRouter: OrderRouter,
@@ -77,9 +78,11 @@ export class DriveToWarehousePage implements OnInit {
 				if (this.order$) {
 					await this.order$.unsubscribe();
 				}
+				//	The previous way of getting selected order by orederId
+				//	const orderId = localStorage.getItem('orderId');
+				//	if (orderId) { code }
 
-				const orderId = localStorage.getItem('orderId');
-				if (orderId) {
+				this.orderId$ = this.store.orderId$.subscribe((orderId) => {
 					this.order$ = this.orderRouter
 						.get(orderId, {
 							populateWarehouse: true,
@@ -112,7 +115,7 @@ export class DriveToWarehousePage implements OnInit {
 							this.carrierMap.setCenter(origin);
 							this.carrierMap.drawRoute(origin, destination);
 						});
-				}
+				});
 			});
 	}
 

packages/carrier-mobile-ionic/src/services/geo-location-order.service.ts

@@ -45,4 +45,96 @@ export class GeoLocationOrdersService {
 				share()
 			);
 	}
+
+	getOrdersForWork(
+		geoLocation: IGeoLocation,
+		skippedOrderIds: string[] = [],
+		options: { sort?: string; skip?: number; limit?: number } = {
+			sort: 'asc',
+		},
+		searchObj?: {
+			isCancelled?: boolean;
+			byRegex?: Array<{ key: string; value: string }>;
+		}
+	) {
+		return this.apollo
+			.watchQuery<{ getOrdersForWork: Order[] }>({
+				query: gql`
+					query GetOrdersForWork(
+						$geoLocation: GeoLocationFindInput!
+						$skippedOrderIds: [String!]!
+						$options: GeoLocationOrdersOptions
+						$searchObj: SearchOrdersForWork
+					) {
+						getOrdersForWork(
+							geoLocation: $geoLocation
+							skippedOrderIds: $skippedOrderIds
+							options: $options
+							searchObj: $searchObj
+						) {
+							id
+							carrierStatus
+							carrierStatusText
+							warehouseStatusText
+							createdAt
+							isConfirmed
+							isCancelled
+							isPaid
+							isCompleted
+							totalPrice
+							orderType
+							deliveryTime
+							finishedProcessingTime
+							startDeliveryTime
+							deliveryTimeEstimate
+							orderNumber
+
+							products {
+								count
+							}
+
+							user {
+								id
+								firstName
+								lastName
+								image
+								phone
+								email
+								fullAddress
+								geoLocation {
+									loc {
+										type
+										coordinates
+									}
+									streetAddress
+									house
+									postcode
+									countryName
+									city
+								}
+							}
+							warehouse {
+								id
+								name
+								logo
+								contactPhone
+								contactEmail
+								geoLocation {
+									house
+									postcode
+									countryName
+									city
+								}
+							}
+						}
+					}
+				`,
+				variables: { geoLocation, skippedOrderIds, options, searchObj },
+				pollInterval: 1000,
+			})
+			.valueChanges.pipe(
+				map((res) => res.data.getOrdersForWork),
+				share()
+			);
+	}
 }