cart

Author: akingeniero

code/frontend/e2e/src/app.e2e-spec.ts

@@ -21,10 +21,10 @@ import { EditUserComponent } from './components/users/edit-user.component';
 import { GamePageComponent } from './components/games/game-page.component';
 import { NgImageSliderModule } from 'ng-image-slider';
 import { ControlPanelComponent } from './components/games/control-panel.component';
-import { AddGameComponent } from './components/games/add-game.component';
+import { CartComponent } from './components/users/cart.component';
 
 @NgModule({
-  declarations: [AppComponent, BookDetailComponent, BookListComponent, BookFormComponent, LoginComponent, NavbarComponent, RegisterComponent, AppFooterComponent, GamesComponent, SideBlockComponent, ProfileComponent, ErrorComponent, EditUserComponent, GamePageComponent, ControlPanelComponent, AddGameComponent],
+  declarations: [AppComponent, BookDetailComponent, BookListComponent, BookFormComponent, LoginComponent, NavbarComponent, RegisterComponent, AppFooterComponent, GamesComponent, SideBlockComponent, ProfileComponent, ErrorComponent, EditUserComponent, GamePageComponent, ControlPanelComponent, CartComponent],
   imports: [BrowserModule, FormsModule, HttpClientModule, routing, NgbModule, NgImageSliderModule],
   bootstrap: [AppComponent]
 })

code/frontend/e2e/src/app.po.ts

@@ -11,6 +11,7 @@ import { ErrorComponent } from './components/error/error.component';
 import { EditUserComponent } from './components/users/edit-user.component';
 import { GamePageComponent } from './components/games/game-page.component';
 import { ControlPanelComponent } from './components/games/control-panel.component';
+import { CartComponent } from './components/users/cart.component';
 
 const appRoutes = [
     { path: 'login', component: LoginComponent },
@@ -21,6 +22,7 @@ const appRoutes = [
     { path: 'editProfile/:id', component: EditUserComponent, canActivate: [AuthGuard]},
     { path: 'game/:id', component: GamePageComponent},
     { path: 'controlPanel', component: ControlPanelComponent, canActivate: [RoleGuard]},
+    { path: 'cart/:id', component: CartComponent, canActivate: [AuthGuard]},
     { path: '**', redirectTo: 'error/404' }
 ]
 

code/frontend/src/app/app.module.ts

@@ -34,7 +34,7 @@
                   <li><a role="button" (click)="myProfile()">Profile <span
                         class="badge pull-right bg-warning">13</span></a>
                   </li>
-                  <li><a href="/cart/{{currentUser.id}}">My Cart <span class="badge pull-right bg-default">3</span></a>
+                  <li><a (click)="cart()" role="button">My Cart <span class="badge pull-right bg-default">3</span></a>
                   </li>
                   <li class="divider"></li>
 
@@ -47,7 +47,7 @@
             </li>
 
             <li class="dropdown dropdown-hover dropdown-cart nav-item">
-              <a class="fa fa-shopping-cart nav-link" role="button">
+              <a class="fa fa-shopping-cart nav-link" role="button" (click)="cart()">
               </a>
               <div class="dropdown-menu dropdown-menu-right dropdown-menu-scrollable" style="width: 300px;">
                 <ng-template [ngIf]="this.loginService.getCurrentCart().numberOfElements > 0">
@@ -75,20 +75,22 @@ <h4 class="ellipsis"><a href="/game/{{game.id}}">{{game.name}}</a></h4>
 
 
 
-                  <div class="ml-20 mr-20 pull-left" *ngIf="!this.loginService.getCurrentCart().last"><strong>View cart to see all the games</strong> </div>
+                  <div class="ml-20 mr-20 pull-left" *ngIf="!this.loginService.getCurrentCart().last"><strong>View cart
+                      to see all the games</strong> </div>
 
                   <div class="ml-20 mr-20 pull-left"><strong>Subtotal:</strong> <span
                       class="amount">${{totalPrice()}}</span>
                   </div>
                   <div class="btn-group pull-right m-15">
-                    <a href="/cart/{{currentUser.id}}" class="btn btn-default btn-sm">View Cart</a>
+                    <a role="button" (click)="cart()" class="btn btn-default btn-sm">View Cart</a>
                     <a href="/checkout/{{currentUser.id}}" class="btn btn-default btn-sm">Checkout</a>
                   </div>
                 </ng-template>
 
 
                 <div class="ml-20 mr-20 pull-right" *ngIf="this.loginService.getCurrentCart().numberOfElements === 0">
-                  <strong>The cart is empty</strong></div>
+                  <strong>The cart is empty</strong>
+                </div>
 
               </div>
             </li>

code/frontend/src/app/app.routing.ts

@@ -95,4 +95,8 @@ export class NavbarComponent {
   controlPanel(){
     this.router.navigate(['/controlPanel']);
   }
+
+  cart(){
+    this.router.navigate(['/cart/' + this.loginService.currentUser().id]);
+  }
 }