Get Malls by food type + reset password API parameter changes

src/app/cart/cart.page.html

@@ -14,49 +14,51 @@
         </ion-button>
     </div>
 
-    <ul class="cart-item-list" *ngFor="let outlet of cart_outlets">
-		<header class="outlet"> {{ getMallDetails(outlet.mall_id).mall.mall_name }} &gt; {{ getOutletDetails(outlet).outlet_name }} </header>
-
-        <li class="cart-item" *ngFor="let item of userCart.orderedlist; let i = index;" [ngClass]="{'show' : item.outlet_id === outlet.outlet_id && item.mall_id === outlet.mall_id }">
-            <header *ngIf="getItemDetails(item)"> {{ i + 1 }}. {{ getItemDetails(item).menu_item_name }} </header>
-            <ul class="breakups" *ngIf="!show_order_details && getItemDetails(item)">
-                <li>
-                    <label>
-                        {{ item.quantity }} X &#8377; {{ getItemDetails(item).item_price - getItemDetails(item).item_discount }}
-                    </label>
-                    <span class="total"> &#8377;  {{ item.total_price }} </span>
-                </li>
-                <li>
-                    <label> Pickup Time </label>
-    				<ion-item class="time-holder">
-    					{{ getFormatterDateTime(item.pickup_time, 'hh:mm a') }}
-    					<a> Schedule time </a>
-    					<ion-datetime displayFormat="hh:mm a" [(ngModel)]="item.pickup_time"
-    					placeholder="Select Date"></ion-datetime>
-    				</ion-item>
-                </li>
-            </ul>
-
-            <ul class="breakups" *ngIf="show_order_details">
-                <li>
-                    <label> Quantity </label>
-                    <div class="quantity-scale-holder">
-                        <button (click)="decrementCartCount(item.outlet_id, item.menuitem_id, item.mall_id)"> <ion-icon name="remove"></ion-icon> </button>
-                        <div class="quantity"> {{ item.quantity }} </div>
-                        <button (click)="incrementCartCount(item.outlet_id, item.menuitem_id, item.mall_id)"> <ion-icon name="add"></ion-icon> </button>
-                    </div>
-                </li>
-                <li>
-                    <label> Takeaway </label>
-                    <div class="toggle">
-                        <ion-toggle [(ngModel)]="item.take_away"></ion-toggle>
-                    </div>
-                </li>
-            </ul>
-
-            <ion-button fill="outline" shape="round" class="add-on-button show" (click)="openInstantMenu(outlet)"> Add on </ion-button>
-        </li>
-    </ul>
+    <ng-container *ngIf="allMalls.length > 0">
+        <ul class="cart-item-list" *ngFor="let outlet of cart_outlets">
+            <header class="outlet"> {{ getMallDetails(outlet.mall_id).mall.mall_name }} &gt; {{ getOutletDetails(outlet).outlet_name }} </header>
+    
+            <li class="cart-item" *ngFor="let item of userCart.orderedlist; let i = index;" [ngClass]="{'show' : item.outlet_id === outlet.outlet_id && item.mall_id === outlet.mall_id }">
+                <header *ngIf="getItemDetails(item)"> {{ i + 1 }}. {{ getItemDetails(item).menu_item_name }} </header>
+                <ul class="breakups" *ngIf="!show_order_details && getItemDetails(item)">
+                    <li>
+                        <label>
+                            {{ item.quantity }} X &#8377; {{ getItemDetails(item).item_price - getItemDetails(item).item_discount }}
+                        </label>
+                        <span class="total"> &#8377;  {{ item.total_price }} </span>
+                    </li>
+                    <li>
+                        <label> Pickup Time </label>
+                        <ion-item class="time-holder">
+                            {{ getFormatterDateTime(item.pickup_time, 'hh:mm a') }}
+                            <a> Schedule time </a>
+                            <ion-datetime displayFormat="hh:mm a" [(ngModel)]="item.pickup_time"
+                            placeholder="Select Date"></ion-datetime>
+                        </ion-item>
+                    </li>
+                </ul>
+    
+                <ul class="breakups" *ngIf="show_order_details">
+                    <li>
+                        <label> Quantity </label>
+                        <div class="quantity-scale-holder">
+                            <button (click)="decrementCartCount(item.outlet_id, item.menuitem_id, item.mall_id)"> <ion-icon name="remove"></ion-icon> </button>
+                            <div class="quantity"> {{ item.quantity }} </div>
+                            <button (click)="incrementCartCount(item.outlet_id, item.menuitem_id, item.mall_id)"> <ion-icon name="add"></ion-icon> </button>
+                        </div>
+                    </li>
+                    <li>
+                        <label> Takeaway </label>
+                        <div class="toggle">
+                            <ion-toggle [(ngModel)]="item.take_away"></ion-toggle>
+                        </div>
+                    </li>
+                </ul>
+    
+                <ion-button fill="outline" shape="round" class="add-on-button show" (click)="openInstantMenu(outlet)"> Add on </ion-button>
+            </li>
+        </ul>
+    </ng-container>    
 
     <div class="total-price-breakup">
         <ul class="breakups">

src/app/cart/cart.page.ts

@@ -5,6 +5,7 @@ import { OrderService } from '../services/order.service';
 import { ToastService } from '../services/toast.service';
 import { ModalController } from '@ionic/angular';
 import { InAppBrowserPage } from '../in-app-browser/in-app-browser.page';
+import { MallService } from '../services/mall.service';
 import * as moment from 'moment';
 
 export type ICart = {
@@ -49,7 +50,8 @@ export class CartPage implements OnInit {
 		private orderService: OrderService,
 		private toastService: ToastService,
 		private router: Router,
-        public modalController: ModalController
+        public modalController: ModalController,
+        private mallService: MallService
     ) { }
 
     ngOnInit() {        
@@ -62,8 +64,12 @@ export class CartPage implements OnInit {
 	}
 
     ionViewDidEnter() {
-		this.fetchCartItems();
-        this.allMalls = JSON.parse(localStorage.allMalls);
+        this.fetchCartItems();
+        this.mallService.allMalls().then((response) => {
+            this.allMalls = response;
+        }, (error) => {
+            console.log(error);
+        });
 	}
 
     fetchCartItems() {

src/app/forgot-password/forgot-password.page.ts

@@ -49,7 +49,7 @@ export class ForgotPasswordPage implements OnInit {
     resetPassword() {
         let credentials = {
             email: this.email,
-            login_type: "user",
+            login_type: "USER",
             password: this.newPassword,
             reEnteredPassword: this.newPassword
         };

src/app/malls/malls.page.html

@@ -34,10 +34,14 @@
     </div>
 
     <div class="food-types-holder">
-        <button> <ion-icon src="assets/custom/food-3.svg"></ion-icon> <span> Breakfast </span> </button>
-        <button> <ion-icon src="assets/custom/food-1.svg"></ion-icon> <span> Pizza </span> </button>
-        <button> <ion-icon src="assets/custom/food-2.svg"></ion-icon> <span> Doughnuts </span> </button>
-        <button> <ion-icon src="assets/custom/food-4.svg"></ion-icon> <span> Cake </span> </button>
+        <button (click)="getMallsByFoodType('breakfast')" 
+        [ngClass]="{'active' : selectedFoodType === 'breakfast'}"> <ion-icon src="assets/custom/food-3.svg"></ion-icon> <span> Breakfast </span> </button>
+        <button (click)="getMallsByFoodType('pizza')" 
+        [ngClass]="{'active' : selectedFoodType === 'pizza'}"> <ion-icon src="assets/custom/food-1.svg"></ion-icon> <span> Pizza </span> </button>
+        <button (click)="getMallsByFoodType('donuts')" 
+        [ngClass]="{'active' : selectedFoodType === 'donuts'}"> <ion-icon src="assets/custom/food-2.svg"></ion-icon> <span> Doughnuts </span> </button>
+        <button (click)="getMallsByFoodType('cake')" 
+        [ngClass]="{'active' : selectedFoodType === 'cake'}"> <ion-icon src="assets/custom/food-4.svg"></ion-icon> <span> Cake </span> </button>
     </div>
 
     <div class="results-utilities-holder">

src/app/malls/malls.page.scss

@@ -87,12 +87,24 @@
         background-color: transparent;
         border: 0;
 
+        &.active {
+            ion-icon {
+                box-shadow: 0px 0px 5px var(--brand-blue);
+                border-color: var(--brand-blue);                
+            }
+            span {
+                color: var(--brand-blue);
+            }
+        }
+
         ion-icon {
             background-color: white;
             border-radius: 50%;
             box-shadow: 0px 0px 5px var(--brand-grey);
             padding: 10px;
             font-size: 35px;
+            border: 2px solid transparent;
+            transition: box-shadow 0.3s, border-color 0.3s;
         }
 
         span {
@@ -101,6 +113,7 @@
             color: var(--brand-grey);
             margin-top: 10px;
             letter-spacing: 0.5px;
+            transition: colo 0.3s;
         }
     }
 }

src/app/malls/malls.page.ts

@@ -17,6 +17,7 @@ export class MallsPage implements OnInit {
     showSearchBar: boolean = false;
     selected_sort: string = null;
     searchTerm: string = '';
+    selectedFoodType: string = '';
 
     constructor(
         private mallService: MallService,
@@ -24,6 +25,32 @@ export class MallsPage implements OnInit {
         private toastService: ToastService
     ) { }
 
+    
+    getMallsByFoodType(type: string) {
+        this.selectedFoodType = type;
+        console.log(this.tempMalls);
+        this.mallService.mallsByTypes(type).then((mallsByTypes: Array<any>) => {
+            let malls: any = [];
+            if (mallsByTypes.length > 0) {
+                mallsByTypes.forEach((mallLocations) => {
+                    mallLocations.location.forEach((mall) => {
+                        malls.push(mall);
+                    });
+                });
+
+                this.allMalls = malls;
+                this.tempMalls = malls;
+
+            } else {
+                this.toastService.presentToast("No Malls of the type " + this.selectedFoodType);
+                this.allMalls = [];
+                this.tempMalls = [];
+            }
+        }, () => {
+            this.toastService.presentToast("Failed to get malls of this food type", "warning");
+        });
+    }
+
     ngOnInit() {
         this.getMallsByLocation();
     }
@@ -71,13 +98,7 @@ export class MallsPage implements OnInit {
 
             window.navigator['share'](shareData);
         }
-    }
-
-    getMallsByFoodType(type: string) {
-        this.mallService.mallsByTypes(type).then((data) => {
-            console.log(data);
-        });
-    }
+    }    
 
     getMallsByLocation() {
         if (navigator.geolocation) {

src/app/onboarding/onboarding.page.ts

@@ -107,7 +107,7 @@ export class OnboardingPage implements OnInit {
         this.authService.authenticateUser({ 
             username: this.credentials.username,
             password: this.credentials.password,
-            login_type: 'user'
+            login_type: 'USER'
         }).then((data: any) => {
             localStorage.userInfo = JSON.stringify(data);
             localStorage.access_Token = data.access_Token;

src/app/orders/orders.component.html

@@ -4,7 +4,7 @@
 </div>
 
 <ul class="orders">
-	<li *ngFor="let userOrder of userOrders" class="order" (click)="selected_order = order">
+	<li *ngFor="let userOrder of userOrders" class="order">
 		<div class="order-mall" *ngFor="let order of userOrder.orderedlist">
 			<div class="heading"> Order ID: {{ order.orderedlist_id }} </div>
 			<div class="time-details">
@@ -50,7 +50,7 @@
 
 			<div class="action-buttons-holder">
 				<ion-button shape="round" (click)="reOrder(userOrder.orderedlist)"> Reorder </ion-button>
-				<ion-button shape="round" fill="outline" (click)="selectedOrder = order"> Rate &amp; Review </ion-button>
+				<ion-button shape="round" fill="outline" (click)="selectedOrder = userOrder"> Rate &amp; Review </ion-button>
 			</div>
 		</div>
 	</li>

src/app/orders/orders.component.ts

@@ -12,7 +12,6 @@ import { ToastService } from '../services/toast.service';
 })
 export class OrdersComponent implements OnInit {
 	userOrders: any = [];
-	selected_order: any;
 	userInfo: any;
     userCart: ICart = {
         orderedlist: []
@@ -38,6 +37,7 @@ export class OrdersComponent implements OnInit {
     submitFeedbackForOrder() {
         this.tempReview.app_user.user_id = this.userInfo.id;
         this.selectedOrder.rating = this.tempReview;
+        console.log(this.selectedOrder);
         this.orderService.updateOrder(this.selectedOrder).then(() => {
             this.selectedOrder = null;
             this.tempReview = {