From 934e28446c56548ed86cb67cf0b36c4a7844793a Mon Sep 17 00:00:00 2001 From: Rene Vergara Date: Fri, 25 Mar 2022 18:57:02 -0500 Subject: [PATCH] Begin receipt component --- backend/app.js | 25 +++++++ src/app/app-routing.module.ts | 2 + src/app/app.module.ts | 4 +- src/app/receipt.service.spec.ts | 16 +++++ src/app/receipt.service.ts | 84 +++++++++++++++++++++++ src/app/receipt/receipt.component.css | 30 ++++++++ src/app/receipt/receipt.component.html | 23 +++++++ src/app/receipt/receipt.component.spec.ts | 25 +++++++ src/app/receipt/receipt.component.ts | 26 +++++++ 9 files changed, 234 insertions(+), 1 deletion(-) create mode 100644 src/app/receipt.service.spec.ts create mode 100644 src/app/receipt.service.ts create mode 100644 src/app/receipt/receipt.component.css create mode 100644 src/app/receipt/receipt.component.html create mode 100644 src/app/receipt/receipt.component.spec.ts create mode 100644 src/app/receipt/receipt.component.ts diff --git a/backend/app.js b/backend/app.js index 61f2603..973f55a 100644 --- a/backend/app.js +++ b/backend/app.js @@ -521,6 +521,31 @@ app.get('/api/allorders', (req, res, next) => { } }); +app.get('/api/receipt', (req, res, next) => { + console.log('Get /api/receipt'); + if (req.query.id.length > 0) { + const order = ordermodel.findOne({_id: req.query.id}).then((documents) => { + if (documents != null) { + console.log(documents); + res.status(200).json({ + message: 'order found!', + order: documents + }); + } else { + res.status(204).json({ + message: 'no order found!', + order: null + }); + } + }); + } else { + res.status(204).json({ + message: 'no session received', + order: null + }); + } +}); + app.get('/api/order', (req, res, next) => { console.log('Get /api/order'); if (req.query.session.length > 0) { diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 1e62d63..e9b73dd 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,6 +1,7 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { ViewerComponent } from './viewer/viewer.component'; +import { ReceiptComponent } from './receipt/receipt.component'; import { LoginComponent } from './login/login.component'; import { BusinessComponent } from './business/business.component'; import { ListOrdersComponent } from './listorders/listorders.component'; @@ -13,6 +14,7 @@ const routes: Routes = [ { path: 'shop', component: ViewerComponent, canActivate: [AuthGuardService]}, { path: 'orders', component: ListOrdersComponent, canActivate: [AuthGuardService]}, { path: 'biz', component: BusinessComponent, canActivate: [AuthGuardService]}, + { path: 'receipt/:orderId', component: ReceiptComponent}, { path: 'login', component: LoginComponent, resolve: { response: NodeResolverService}} ]; diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 7992df6..caa0121 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -36,6 +36,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { BusinessComponent } from './business/business.component'; import { SearchOptionsPipe } from './searchoptions.pipe'; import { TermsComponent } from './terms/terms.component'; +import { ReceiptComponent } from './receipt/receipt.component'; @NgModule({ declarations: [ @@ -55,7 +56,8 @@ import { TermsComponent } from './terms/terms.component'; ListOrdersComponent, BusinessComponent, SearchOptionsPipe, - TermsComponent + TermsComponent, + ReceiptComponent ], imports: [ BrowserModule, diff --git a/src/app/receipt.service.spec.ts b/src/app/receipt.service.spec.ts new file mode 100644 index 0000000..88f1f9d --- /dev/null +++ b/src/app/receipt.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { ReceiptService } from './receipt.service'; + +describe('ReceiptService', () => { + let service: ReceiptService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(ReceiptService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/receipt.service.ts b/src/app/receipt.service.ts new file mode 100644 index 0000000..e28723b --- /dev/null +++ b/src/app/receipt.service.ts @@ -0,0 +1,84 @@ +import { Injectable } from '@angular/core'; +import { Subject, BehaviorSubject, Observable } from 'rxjs'; +import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http'; +import { Order } from './order/order.model'; + +@Injectable({ + providedIn: 'root' +}) +export class ReceiptService { + beUrl = 'http://localhost:3000/'; + private dataStore: {order: Order, owner: Owner } = { + owner: { + _id: '', + name: '', + address: '', + currency: 'usd', + tax: false, + taxValue: 0, + vat: false, + vatValue: 0, + first: '', + last: '', + email: '', + street: '', + city: '', + state: '', + postal: '', + phone: '', + paid: false, + website: '', + country: '', + zats: false + }, + order: { + address: '', + session: '', + timestamp: '', + closed: false, + currency: '', + price: 0, + total: 0, + totalZec: 0, + lines: [ + { + qty: 1, + name: '', + cost:0 + } + ] + } + }; + private _orderUpdated: BehaviorSubject = new BehaviorSubject(this.dataStore.order); + public readonly orderUpdate: Observable = this._orderUpdated.asObservable(); + public ownerUpdate: Observable; + private apiKey = 'Le2adeic8Thah4Aeng4daem6i'; + private reqHeaders: HttpHeaders; + + constructor( + private http: HttpClient, + public userService: UserService + ) { + this.reqHeaders = new HttpHeaders().set('Authorization', this.apiKey); + this.ownerUpdate = userService.ownerUpdate; + this.ownerUpdate.subscribe((owner) => { + this.dataStore.owner = owner; + }); + } + + getOrderById(id:string) { + const params = new HttpParams().append('id', id); + let obs = this.http.get<{message: string, order: any}>(this.beUrl+'api/order', { headers:this.reqHeaders, params:params, observe: 'response'}); + + obs.subscribe((OrderDataResponse) => { + if (OrderDataResponse.status == 200) { + this.dataStore.order = OrderDataResponse.body!.order; + this._orderUpdated.next(Object.assign({}, this.dataStore).order); + } else { + console.log('No order found'); + } + }); + + return obs; + } +} diff --git a/src/app/receipt/receipt.component.css b/src/app/receipt/receipt.component.css new file mode 100644 index 0000000..4f0d6ea --- /dev/null +++ b/src/app/receipt/receipt.component.css @@ -0,0 +1,30 @@ +* { + font-family: 'Spartan', sans-serif; +} + +.spacer{ + flex: 1 1 auto; +} +.mat-card{ + font-family: 'Spartan', sans-serif; + border: 1px solid #FF7522; + width: 80%; + text-align: left; + margin: 5px; + max-width: 500px; +} +.mat-card-title{ + font-size: 16px; + font-weight: 700; +} +.mat-card-subtitle{ + font-size: 12px; + font-weight: 200; +} +.mat-card-content{ + font-size: 14px; + text-align: justify; +} +span.tt{ + font-family: 'Roboto-Mono', monospace; +} diff --git a/src/app/receipt/receipt.component.html b/src/app/receipt/receipt.component.html new file mode 100644 index 0000000..56360b4 --- /dev/null +++ b/src/app/receipt/receipt.component.html @@ -0,0 +1,23 @@ + + + + + + +

Name

+
+
+
+ + + Receipt + + + Date + + +

receipt works! orderID:{{orderId}}

+ +
+
+
diff --git a/src/app/receipt/receipt.component.spec.ts b/src/app/receipt/receipt.component.spec.ts new file mode 100644 index 0000000..646d211 --- /dev/null +++ b/src/app/receipt/receipt.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ReceiptComponent } from './receipt.component'; + +describe('ReceiptComponent', () => { + let component: ReceiptComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ ReceiptComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(ReceiptComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/receipt/receipt.component.ts b/src/app/receipt/receipt.component.ts new file mode 100644 index 0000000..7a0988e --- /dev/null +++ b/src/app/receipt/receipt.component.ts @@ -0,0 +1,26 @@ +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { Order} from '../order/order.model'; +import { OrderService } from '../order/order.service'; + +@Component({ + selector: 'app-receipt', + templateUrl: './receipt.component.html', + styleUrls: ['./receipt.component.css'] +}) +export class ReceiptComponent implements OnInit { + orderId; + //order:Order; + + constructor( + private _ActiveRoute:ActivatedRoute, + public orderService: OrderService + ) { + this.orderId = this._ActiveRoute.snapshot.paramMap.get("orderId"); + + } + + ngOnInit(): void { + } + +}