Index: src/app/app.routes.ts =================================================================== --- src/app/app.routes.ts (revision a06ddbe11299c978028d0fd2a9863f92a3f8cca4) +++ src/app/app.routes.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -8,4 +8,11 @@ import { DriverDashboardComponent } from './driver/driver-dashboard/driver-dashboard.component'; import { AdminDashboardComponent } from './admin/admin-dashboard/admin-dashboard.component'; + +import { CustomerOrdersComponent } from './customer/customer-orders/customer-orders.component'; +import { CreateOrderComponent } from './customer/create-order/create-order.component'; +import { CustomerDeliveriesComponent } from './customer/customer-deliveries/customer-deliveries.component'; +import { CustomerProformasComponent } from './customer/customer-proformas/customer-proformas.component'; +import { CustomerProfileComponent } from './customer/customer-profile/customer-profile.component'; + import { AddDriverComponent } from './admin/add-driver/add-driver.component'; import { AddVehicleComponent } from './admin/add-vehicle/add-vehicle.component'; @@ -13,5 +20,7 @@ import { AddManagerComponent } from './admin/add-manager/add-manager.component'; + export const routes: Routes = [ + // CUSTOMER ROUTES { path: 'customer/dashboard', @@ -21,4 +30,36 @@ }, { + + path: 'customer/orders', + component: CustomerOrdersComponent, + canActivate: [authGuard], + data: { roles: ['ROLE_CUSTOMER'] }, + }, + { + path: 'customer/orders/add', + component: CreateOrderComponent, + canActivate: [authGuard], + data: { roles: ['ROLE_CUSTOMER'] }, + }, + { + path: 'customer/deliveries', + component: CustomerDeliveriesComponent, + canActivate: [authGuard], + data: { roles: ['ROLE_CUSTOMER'] }, + }, + { + path: 'customer/proFormas', + component: CustomerProformasComponent, + canActivate: [authGuard], + data: { roles: ['ROLE_CUSTOMER'] }, + }, + { + path: 'customer/profile', + component: CustomerProfileComponent, + canActivate: [authGuard], + data: { roles: ['ROLE_CUSTOMER'] }, + }, + // MANAGER ROUTES + { path: 'manager/dashboard', component: ManagerDashboardComponent, @@ -26,4 +67,5 @@ data: { roles: ['ROLE_MANAGER'] }, }, + // DRIVER ROUTES { path: 'driver/dashboard', @@ -32,4 +74,5 @@ data: { roles: ['ROLE_DRIVER'] }, }, + // ADMIN ROUTES { path: 'admin/dashboard', Index: src/app/customer/create-order/create-order.component.html =================================================================== --- src/app/customer/create-order/create-order.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/create-order/create-order.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,110 @@ + +
+

Place Your Order

+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+ Article Image +
+
{{ a.name }}
+

+ Manufacturer: {{ a.manufacturer }}
+ Price: ${{ a.price.toFixed(2) }}
+ In Stock: {{ a.quantity }} +

+
+
+ +
+
+
+
+ + +

Order Summary

+ + + + + + + + + + + + + + + + + + + + + +
ArticleUnit PriceManufacturerQuantityLine TotalAction
{{ it.articleName }}${{ it.unitPrice.toFixed(2) }}{{ it.manufacturerName }}{{ it.quantity }}${{ (it.unitPrice * it.quantity).toFixed(2) }} + +
+ +
+ + ${{ totalSum.toFixed(2) }} +
+ +
+ + +
+ + +
Index: src/app/customer/create-order/create-order.component.spec.ts =================================================================== --- src/app/customer/create-order/create-order.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/create-order/create-order.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CreateOrderComponent } from './create-order.component'; + +describe('CreateOrderComponent', () => { + let component: CreateOrderComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CreateOrderComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CreateOrderComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); Index: src/app/customer/create-order/create-order.component.ts =================================================================== --- src/app/customer/create-order/create-order.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/create-order/create-order.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,113 @@ +import { CommonModule } from '@angular/common'; +import { HttpClient } from '@angular/common/http'; +import { Component, OnInit } from '@angular/core'; +import { FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; +import { Router } from '@angular/router'; +import { NavbarComponent } from '../../navbar/navbar.component'; +import { Category, Manufacturer, Article, OrderItem } from '../../models'; +import { OrderService } from '../../services/order.service'; + +@Component({ + selector: 'app-create-order', + imports: [CommonModule, ReactiveFormsModule, NavbarComponent], + templateUrl: './create-order.component.html', + styleUrl: './create-order.component.css', +}) +export class CreateOrderComponent implements OnInit { + form!: FormGroup; + categories: Category[] = []; + manufacturers: Manufacturer[] = []; + articles: Article[] = []; + displayed: Article[] = []; + orderItems: OrderItem[] = []; + totalSum = 0; + proForma = false; + + constructor( + private http: HttpClient, + private router: Router, + private fb: FormBuilder, + private svc: OrderService + ) {} + + ngOnInit() { + this.form = this.fb.group({ + category: [''], + manufacturer: [''], + search: [''], + }); + + this.svc.listCategories().subscribe((c) => (this.categories = c)); + this.svc.listManufacturers().subscribe((m) => (this.manufacturers = m)); + this.svc.listArticles().subscribe((a) => { + this.articles = a; + this.applyFilter(); + }); + + this.form.valueChanges.subscribe(() => this.applyFilter()); + } + + applyFilter() { + const { category, manufacturer, search } = this.form.value; + + const term = (search || '').toLowerCase(); + + this.displayed = this.articles.filter((a) => { + return ( + (!category || a.categoryId === +category) && + (!manufacturer || a.manufacturerId === +manufacturer) && + (!term || a.name.toLowerCase().includes(term)) + ); + }); + } + + addArticle(a: Article) { + const qty = Number(prompt(`Quantity for ${a.name}:`, '1')); + + if (!qty || qty < 1 || qty > a.quantity) { + alert('invalid quantity'); + return; + } + this.orderItems.push({ + articleId: a.id, + articleName: a.name, + manufacturerName: a.manufacturer, + unitPrice: a.price, + quantity: qty, + }); + + this.updateTotal(); + } + + removeItem(i: number) { + this.orderItems.splice(i, 1); + this.updateTotal(); + } + + updateTotal() { + this.totalSum = this.orderItems.reduce( + (sum, it) => sum + it.unitPrice * it.quantity, + 0 + ); + } + + toggleProForma(event: any) { + this.proForma = event.target.checked; + } + + placeOrder() { + if (this.orderItems.length === 0) { + alert('Add at least one item'); + return; + } + this.svc.placeOrder(this.orderItems, this.proForma).subscribe({ + next: () => { + alert('Order placed!'); + this.orderItems = []; + this.updateTotal(); + this.router.navigate(['/customer/dashboard']); + }, + error: () => alert('Error'), + }); + } +} Index: src/app/customer/customer-deliveries/customer-deliveries.component.html =================================================================== --- src/app/customer/customer-deliveries/customer-deliveries.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-deliveries/customer-deliveries.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,1 @@ +

customer-deliveries works!

Index: src/app/customer/customer-deliveries/customer-deliveries.component.spec.ts =================================================================== --- src/app/customer/customer-deliveries/customer-deliveries.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-deliveries/customer-deliveries.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CustomerDeliveriesComponent } from './customer-deliveries.component'; + +describe('CustomerDeliveriesComponent', () => { + let component: CustomerDeliveriesComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CustomerDeliveriesComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CustomerDeliveriesComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); Index: src/app/customer/customer-deliveries/customer-deliveries.component.ts =================================================================== --- src/app/customer/customer-deliveries/customer-deliveries.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-deliveries/customer-deliveries.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-customer-deliveries', + imports: [], + templateUrl: './customer-deliveries.component.html', + styleUrl: './customer-deliveries.component.css' +}) +export class CustomerDeliveriesComponent { + +} Index: src/app/customer/customer-orders/customer-orders.component.html =================================================================== --- src/app/customer/customer-orders/customer-orders.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-orders/customer-orders.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,1 @@ +

customer-orders works!

Index: src/app/customer/customer-orders/customer-orders.component.spec.ts =================================================================== --- src/app/customer/customer-orders/customer-orders.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-orders/customer-orders.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CustomerOrdersComponent } from './customer-orders.component'; + +describe('CustomerOrdersComponent', () => { + let component: CustomerOrdersComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CustomerOrdersComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CustomerOrdersComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); Index: src/app/customer/customer-orders/customer-orders.component.ts =================================================================== --- src/app/customer/customer-orders/customer-orders.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-orders/customer-orders.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-customer-orders', + imports: [], + templateUrl: './customer-orders.component.html', + styleUrl: './customer-orders.component.css' +}) +export class CustomerOrdersComponent { + +} Index: src/app/customer/customer-profile/customer-profile.component.html =================================================================== --- src/app/customer/customer-profile/customer-profile.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-profile/customer-profile.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,1 @@ +

customer-profile works!

Index: src/app/customer/customer-profile/customer-profile.component.spec.ts =================================================================== --- src/app/customer/customer-profile/customer-profile.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-profile/customer-profile.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CustomerProfileComponent } from './customer-profile.component'; + +describe('CustomerProfileComponent', () => { + let component: CustomerProfileComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CustomerProfileComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CustomerProfileComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); Index: src/app/customer/customer-profile/customer-profile.component.ts =================================================================== --- src/app/customer/customer-profile/customer-profile.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-profile/customer-profile.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-customer-profile', + imports: [], + templateUrl: './customer-profile.component.html', + styleUrl: './customer-profile.component.css' +}) +export class CustomerProfileComponent { + +} Index: src/app/customer/customer-proformas/customer-proformas.component.html =================================================================== --- src/app/customer/customer-proformas/customer-proformas.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-proformas/customer-proformas.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,1 @@ +

customer-proformas works!

Index: src/app/customer/customer-proformas/customer-proformas.component.spec.ts =================================================================== --- src/app/customer/customer-proformas/customer-proformas.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-proformas/customer-proformas.component.spec.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CustomerProformasComponent } from './customer-proformas.component'; + +describe('CustomerProformasComponent', () => { + let component: CustomerProformasComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [CustomerProformasComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(CustomerProformasComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); Index: src/app/customer/customer-proformas/customer-proformas.component.ts =================================================================== --- src/app/customer/customer-proformas/customer-proformas.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/customer/customer-proformas/customer-proformas.component.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-customer-proformas', + imports: [], + templateUrl: './customer-proformas.component.html', + styleUrl: './customer-proformas.component.css' +}) +export class CustomerProformasComponent { + +} Index: src/app/models/article.model.ts =================================================================== --- src/app/models/article.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/models/article.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,10 @@ +export interface Article { + id: number; + name: string; + categoryId: number; + manufacturerId: number; + manufacturer: string; + price: number; + quantity: number; + image?: string; +} Index: src/app/models/category.model.ts =================================================================== --- src/app/models/category.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/models/category.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,4 @@ +export interface Category { + id: number; + name: string; +} Index: src/app/models/index.ts =================================================================== --- src/app/models/index.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/models/index.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,4 @@ +export * from './category.model'; +export * from './manufacturer.model'; +export * from './article.model'; +export * from './order-item.model'; Index: src/app/models/manufacturer.model.ts =================================================================== --- src/app/models/manufacturer.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/models/manufacturer.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,4 @@ +export interface Manufacturer { + id: number; + name: string; +} Index: src/app/models/order-item.model.ts =================================================================== --- src/app/models/order-item.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) +++ src/app/models/order-item.model.ts (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -0,0 +1,7 @@ +export interface OrderItem { + articleId: number; + articleName: string; + manufacturerName: string; + unitPrice: number; + quantity: number; +} Index: src/app/navbar/navbar.component.html =================================================================== --- src/app/navbar/navbar.component.html (revision a06ddbe11299c978028d0fd2a9863f92a3f8cca4) +++ src/app/navbar/navbar.component.html (revision 95b0e0e553b2e5d068b676bf2d8319b7a5f018f9) @@ -12,26 +12,37 @@