From 1eef681329ba54fd87831d4bfc4de72ed0c973bf Mon Sep 17 00:00:00 2001
From: kj1352 <nikhilkj24@gmail.com>
Date: Fri, 16 Oct 2020 19:19:40 +0530
Subject: [PATCH] Profile page UI fixes

---
 src/app/orders/orders.component.html |  6 ++--
 src/app/orders/orders.component.ts   | 29 +++++++++++++++--
 src/app/profile/profile.page.html    | 14 +++++----
 src/app/profile/profile.page.scss    | 47 +++++++++++++++-------------
 4 files changed, 63 insertions(+), 33 deletions(-)

diff --git a/src/app/orders/orders.component.html b/src/app/orders/orders.component.html
index ed15219..6b16501 100644
--- a/src/app/orders/orders.component.html
+++ b/src/app/orders/orders.component.html
@@ -1,12 +1,12 @@
 <div class="heading-holder">
 	<div class="name"> MY ORDERS </div>
-	<ion-button fill="clear"> SORT / FILTER </ion-button>
+	<!-- <ion-button fill="clear"> SORT / FILTER </ion-button> -->
 </div>
 
 <ul class="orders">
 	<li *ngFor="let userOrder of userOrders" class="order" (click)="selected_order = order">
 		<div class="order-mall" *ngFor="let order of userOrder.orderedlist">
-			<div class="heading"> Order ID: {{ order.orderedlist_id }} </div>
+			<div class="heading"> Order ID: {{ userOrder.orders_id }} </div>
 			<div class="time-details">
 				Pickup on {{ getFormattedDate(order.pickup_time, 'DD MMMM YYYY @ hh:mm A') }}
 			</div>
@@ -40,7 +40,7 @@
 			</p>
 
 			<div class="action-buttons-holder">
-				<ion-button shape="round"> Reorder </ion-button>
+				<ion-button shape="round" (click)="reOrder(userOrder.orderedlist)"> Reorder </ion-button>
 				<ion-button shape="round" fill="outline" (click)="show_rate_modal = true"> Rate &amp; Review </ion-button>
 			</div>
 		</div>
diff --git a/src/app/orders/orders.component.ts b/src/app/orders/orders.component.ts
index b77da60..8c56cd7 100644
--- a/src/app/orders/orders.component.ts
+++ b/src/app/orders/orders.component.ts
@@ -1,6 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 import { OrderService } from '../services/order.service';
 import * as moment from 'moment';
+import { ICart } from '../cart/cart.page';
+import { Router } from '@angular/router';
 
 @Component({
     selector: 'app-orders',
@@ -13,9 +15,13 @@ export class OrdersComponent implements OnInit {
 	selected_rating: number = 0;
     userInfo: any;
     show_rate_modal: boolean = false;
+    userCart: ICart = {
+        orderedlist: []
+    };
 
     constructor(
-		private orderService: OrderService,
+        private orderService: OrderService,
+        private router: Router
     ) { }
 
     ngOnInit() {
@@ -30,6 +36,25 @@ export class OrdersComponent implements OnInit {
 
 	getFormattedDate(date, format) {
 		return moment(date).format(format);
-	}
+    }
+    
+    reOrder(orderedlist: any) {
+        // for (let i = 0; i < orderedlist.length; i += 1) {
+        //     this.userCart.orderedlist.push({
+        //         mall_id: orderedlist[i].mall_id,
+        //         outlet_id: orderedlist[i].mall_id,
+        //         menuitem_id: '',
+        //         quantity: '',
+        //         pickup_time: string,
+        //         take_away: true,
+        //         order_status: false,
+        //         total_price: 0,
+        //         soft_delete: false,
+        //     })
+        // }        
+        // localStorage.userCart = JSON.stringify(this.userCart);
+        // this.router.navigate(['/cart']);
+        // console.log(this.userCart);
+    }
 
 }
diff --git a/src/app/profile/profile.page.html b/src/app/profile/profile.page.html
index e823689..4fb7941 100644
--- a/src/app/profile/profile.page.html
+++ b/src/app/profile/profile.page.html
@@ -2,16 +2,18 @@
     <section class="profile">
         <div class="profile-details-holder">
             <figure class="profile-image">
-
+                <img src="assets/custom/name.svg" alt="">
             </figure>
             <div class="content">
                 <h5> {{ userInfo.name }}
-                    <ion-button fill="clear" color="light" size="small"> Edit </ion-button>
+                    <button fill="clear" color="light"> Edit </button>
                 </h5>
-                <ul class="contact">
-                    <li> {{ userInfo.mobile }} </li>
-                    <li> {{ userInfo.email }} </li>
-                </ul>
+                <p>
+                    {{ userInfo.mobile }}
+                </p>
+                <p>
+                    {{ userInfo.email }}
+                </p>
             </div>
         </div>
         <div class="location-details">
diff --git a/src/app/profile/profile.page.scss b/src/app/profile/profile.page.scss
index 630a7ec..0a1f2b9 100644
--- a/src/app/profile/profile.page.scss
+++ b/src/app/profile/profile.page.scss
@@ -11,13 +11,19 @@
         align-items: stretch;
         justify-content: space-between;
         border-bottom: 1px solid var(--brand-blue);
-        padding-bottom: 15px;
+        padding-bottom: 5px;
 
         .profile-image {
             width: 40px;
             height: 40px;
             border-radius: 50%;
-            background-color: white;
+            background-color: transparent;
+            
+
+            img {
+                width: 100%;
+                height: 100%;
+            }
         }
 
         h5 {
@@ -26,29 +32,26 @@
             display: flex;
             align-items: center;
             justify-content: space-between;
-
-            ion-button {
-                margin: 0;
-                font-size: 10px;
+            position: relative;
+
+            button {
+                position: absolute;
+                right: 0;
+                top: 0;
+                font-size: 14px;
+                color: white;
+                background-color: transparent;
+                border: 1px solid white;
+                border-radius: 5px;
+                width: 50px;
+                height: 35px;
             }
         }
 
-        .contact {
-            padding: 0;
-            margin: 10px 0 0;
-            font-size: 10px;
-            display: flex;
-            justify-content: space-between;
-            flex-wrap: wrap;
-            width: 90%;
-
-            li {
-                width: 48%;
-            }
-
-            li:first-child {
-                list-style: none;
-            }
+        p {
+            font-size: 12px;
+            width: 100%;
+            margin: 10px auto;
         }
 
         .content {