minor css and logout button added now project is complete

Angular-UrbanBazaar/src/app/components/cart/cart.component.html

@@ -8,6 +8,7 @@
                             <th>S.No</th>
                             <th>ProductName</th>
                             <th>ProductPrice</th>
+                            <th>quantity</th>
                             <th>Action</th>
                         </tr>
                     </thead>
@@ -16,8 +17,15 @@
                             <td>{{i+1}}</td>
                             <td>{{c.productname}}</td>
                             <td>{{c.productprice}}</td>
+                            <!-- <td>
+                                <select>
+                                    <option *ngFor="let v of quantity">
+                                        {{v}}
+                                    </option>
+                                </select> 
+                            </td> -->
                             <td>
-                                <button  class="CartButtons" (click)="removeItem(c.cartid)">Delete</button>
+                                <button class="CartButtons" (click)="removeItem(c.cartid)">Delete</button>
                             </td>
                         </tr>
                         <tr>

Angular-UrbanBazaar/src/app/components/cart/cart.component.ts

@@ -14,12 +14,12 @@ import { UserService } from 'src/app/services/user.service';
 })
 export class CartComponent implements OnInit {
 
-  public cartdetails:Cart[];
+  public cartdetails: any[]=[];
   public grandTotal = 0;
   constructor(private cartservice:CartService,private userservice:UserService,private router: Router) { 
-    // this.cartdetails = this.cartservice.showCart();
   }
 
+  // public quantity=[1,2,3,4,5,6,7,8,9,10,11]
   ngOnInit(): void {
     
     this.cartservice.showCart()
@@ -29,16 +29,6 @@ export class CartComponent implements OnInit {
           this.grandTotal+=i.productprice;
         })
     })
-    // let uid = this.userservice.currentUser.userid;
-    // this.cartservice.showCart(uid).subscribe(data1=>{
-    //   this.cartNo = data1.length;
-    //   this.cartdetails = data1;
-
-    //   this.cartdetails.forEach((i,index)=>{
-    //     this.grandTotal = this.
-    //   })
-    // })
-
   }
 
   checkout()

Angular-UrbanBazaar/src/app/components/checkout/checkout.component.css

@@ -2,4 +2,20 @@
     border-radius: 15px;
     border-color:antiquewhite ;
     background-color: beige;
-}
+    padding: 1%;
+    flex: auto;
+    flex-direction: row;
+    position: absolute;
+  top: 1px;
+  right: 39px;
+  }
+.card-table{
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    
+}
+.table{
+    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+}

Angular-UrbanBazaar/src/app/components/checkout/checkout.component.html

@@ -1,23 +1,25 @@
 <ng-container *ngIf="cartdetails.length !=0">
-<div class="container">
-<table>
-    <thead>
-        <tr>
-            <th>S.No</th>
-            <th>ProductName</th>
-            <th>ProductPrice</th>
-        </tr>
-    </thead>
+    <div class="container">
+        <div class="card-table">
+            <table class="table">
+                <thead>
+                    <tr>
+                        <th>S.No</th>
+                        <th>ProductName</th>
+                        <th>ProductPrice</th>
+                    </tr>
+                </thead>
 
-    <tbody>
-        <tr *ngFor="let c of cartdetails; let i = index">
-            <td>{{i+1}}</td>
-            <td>{{c.productname}}</td>
-            <td>{{c.productprice}}</td>
-        </tr>
-        <td><strong>Grand Total : Rs.{{grandTotal}}</strong></td>
-    </tbody>
-</table>
-<button (click)=logout() class="CartButtons">log out</button>
-</div>
-</ng-container>
+                <tbody>
+                    <tr *ngFor="let c of cartdetails; let i = index">
+                        <td>{{i+1}}</td>
+                        <td>{{c.productname}}</td>
+                        <td>{{c.productprice}}</td>
+                    </tr>
+                    <td><strong>Grand Total : Rs.{{grandTotal}}</strong></td>
+                </tbody>
+            </table>
+        </div>
+        <button  class="logout" (click)=logout() class="CartButtons">log out</button>
+    </div>
+</ng-container>

Angular-UrbanBazaar/src/app/components/checkout/checkout.component.ts

@@ -1,7 +1,8 @@
+import { unescapeIdentifier } from '@angular/compiler';
 import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
-import { Cart } from 'src/app/models/cart';
 import { CartService } from 'src/app/services/cart.service';
+import { UserService } from 'src/app/services/user.service';
 
 @Component({
   selector: 'app-checkout',
@@ -9,31 +10,34 @@ import { CartService } from 'src/app/services/cart.service';
   styleUrls: ['./checkout.component.css']
 })
 export class CheckoutComponent implements OnInit {
-  public cartdetails:Cart[];
+  public cartdetails: any[] = [];
   public grandTotal = 0;
-  constructor(private cartservice:CartService,private router: Router) { 
+  constructor(private cartservice: CartService, private router: Router,private userservice:UserService) {
 
   }
+  public uid = (this.userservice.currentUser.userid);
+  uid1 = this.uid.toString()
 
-  logout()
-  {
+
+
+  logout() {
     this.router.navigateByUrl("/");
-    this.cartservice.deleteAll().subscribe(b=>{
-      this.cartdetails.forEach((i,index)=>{
+    this.cartservice.deleteAll().subscribe(b => {
+      this.cartdetails.forEach((i, index) => {
         this.cartdetails.splice(index);
       })
     });
-    // alert("db cleaned")
+     alert("your order have been placed for uid:"+this.uid1+"\n"+"Visit Again !")
   }
 
   ngOnInit(): void {
     this.cartservice.showCart()
-    .subscribe(res=>{
+      .subscribe(res => {
         this.cartdetails = res;
-        this.cartdetails.forEach((i,index)=>{
-          this.grandTotal+=i.productprice;
+        this.cartdetails.forEach((i, index) => {
+          this.grandTotal += i.productprice;
         })
-    })
+      })
   }
 
 }

Angular-UrbanBazaar/src/app/components/page-nav-bar/page-nav-bar.component.css

@@ -10,6 +10,8 @@
   right: 0;
   font-family: sans-serif;
 }
+
+
 .navbar-icon-top .navbar-nav .nav-link > .fa {
   top: 3px;
   line-height: 12px;

Angular-UrbanBazaar/src/app/components/page-nav-bar/page-nav-bar.component.html

@@ -7,7 +7,7 @@
     <div class="collapse navbar-collapse" id="navbarSupportedContent">
         <ul class="navbar-nav mr-auto">
             <li class="nav-item active">
-                <a class="nav-link" href="/home">Home <span class="sr-only">(current)</span></a>
+                <a class="nav-link" routerLink="/home">Home <span class="sr-only">(current)</span></a>
             </li>
 
             <li class="nav-item active">