diff --git a/backend/app.js b/backend/app.js
index 973f55a..5018927 100644
--- a/backend/app.js
+++ b/backend/app.js
@@ -540,7 +540,7 @@ app.get('/api/receipt', (req, res, next) => {
});
} else {
res.status(204).json({
- message: 'no session received',
+ message: 'no valid ID received',
order: null
});
}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index caa0121..aa6000d 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -37,6 +37,7 @@ import { BusinessComponent } from './business/business.component';
import { SearchOptionsPipe } from './searchoptions.pipe';
import { TermsComponent } from './terms/terms.component';
import { ReceiptComponent } from './receipt/receipt.component';
+import { ReceiptQRComponent } from './receipt-qr/receipt-qr.component';
@NgModule({
declarations: [
@@ -57,7 +58,8 @@ import { ReceiptComponent } from './receipt/receipt.component';
BusinessComponent,
SearchOptionsPipe,
TermsComponent,
- ReceiptComponent
+ ReceiptComponent,
+ ReceiptQRComponent
],
imports: [
BrowserModule,
diff --git a/src/app/order/order.component.ts b/src/app/order/order.component.ts
index b63308d..69ce473 100644
--- a/src/app/order/order.component.ts
+++ b/src/app/order/order.component.ts
@@ -7,6 +7,7 @@ import { UserService } from '../user.service';
import { OrderService } from './order.service';
import { CancelComponent } from '../cancel/cancel.component';
import { CheckoutComponent} from '../checkout/checkout.component';
+import { ReceiptQRComponent} from '../receipt-qr/receipt-qr.component';
@Component({
selector: 'app-order',
@@ -97,8 +98,20 @@ export class OrderComponent implements OnInit{
const dialogRef = this.dialog.open(CheckoutComponent, dialogConfig);
dialogRef.afterClosed().subscribe((val) => {
if (val) {
+ const dialogConfig2 = new MatDialogConfig();
+ dialogConfig2.disableClose = true;
+ dialogConfig2.autoFocus = true;
+ dialogConfig2.data = {
+ order: this.order._id
+ };
console.log('Payment confirmed!');
this.orderService.closeOrder();
+ const dialogRef2 = this.dialog.open(ReceiptQRComponent, dialogConfig2);
+ dialogRef2.afterClosed().subscribe( val => {
+ if (val) {
+ console.log('Receipt closed.');
+ }
+ });
} else {
console.log('Returning to order');
}
diff --git a/src/app/receipt-qr/receipt-qr.component.css b/src/app/receipt-qr/receipt-qr.component.css
new file mode 100644
index 0000000..ef8f0ab
--- /dev/null
+++ b/src/app/receipt-qr/receipt-qr.component.css
@@ -0,0 +1,4 @@
+
+.text {
+ font-family: 'Spartan', sans-serif;
+}
diff --git a/src/app/receipt-qr/receipt-qr.component.html b/src/app/receipt-qr/receipt-qr.component.html
new file mode 100644
index 0000000..0533f99
--- /dev/null
+++ b/src/app/receipt-qr/receipt-qr.component.html
@@ -0,0 +1,13 @@
+
+
Scan for your Receipt
+
+
+
+
+
+
+
+
+
diff --git a/src/app/receipt-qr/receipt-qr.component.spec.ts b/src/app/receipt-qr/receipt-qr.component.spec.ts
new file mode 100644
index 0000000..3f54f57
--- /dev/null
+++ b/src/app/receipt-qr/receipt-qr.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ReceiptQRComponent } from './receipt-qr.component';
+
+describe('ReceiptQRComponent', () => {
+ let component: ReceiptQRComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ ReceiptQRComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ReceiptQRComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/receipt-qr/receipt-qr.component.ts b/src/app/receipt-qr/receipt-qr.component.ts
new file mode 100644
index 0000000..bf3f3aa
--- /dev/null
+++ b/src/app/receipt-qr/receipt-qr.component.ts
@@ -0,0 +1,38 @@
+import { Inject, Component, OnInit, ViewEncapsulation} from '@angular/core';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
+import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
+
+var QRCode = require('easyqrcodejs');
+
+@Component({
+ selector: 'app-receipt-qr',
+ templateUrl: './receipt-qr.component.html',
+ styleUrls: ['./receipt-qr.component.css']
+})
+export class ReceiptQRComponent implements OnInit {
+ receiptUrl: SafeUrl;
+ codeString: string = '';
+
+ constructor(
+ private dialogRef: MatDialogRef,
+ private sanitizer: DomSanitizer,
+ @Inject(MAT_DIALOG_DATA) public data: { order: string}
+ ) {
+ this.codeString = `https://zgo.cash/receipt/${data.order}`;
+ this.receiptUrl = this.sanitizer.bypassSecurityTrustUrl(this.codeString);
+ }
+
+ ngOnInit(): void {
+ var qrcode = new QRCode(document.getElementById("receipt-qr"), {
+ text: this.codeString,
+ logo: "/assets/zgo-prp.png",
+ logoWidth: 80,
+ logoHeight: 80
+ });
+
+ }
+
+ close() {
+ this.dialogRef.close(true);
+ }
+}
diff --git a/src/app/receipt.service.ts b/src/app/receipt.service.ts
index e28723b..7999d03 100644
--- a/src/app/receipt.service.ts
+++ b/src/app/receipt.service.ts
@@ -2,6 +2,8 @@ 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';
+import { Owner } from './owner.model';
+import { UserService } from './user.service';
@Injectable({
providedIn: 'root'
@@ -51,7 +53,9 @@ export class ReceiptService {
};
private _orderUpdated: BehaviorSubject = new BehaviorSubject(this.dataStore.order);
public readonly orderUpdate: Observable = this._orderUpdated.asObservable();
- public ownerUpdate: Observable;
+ public _nameUpdated: BehaviorSubject = new BehaviorSubject(this.dataStore.owner.name);
+ public readonly nameUpdate: Observable= this._nameUpdated.asObservable();
+ public readonly ownerUpdate;
private apiKey = 'Le2adeic8Thah4Aeng4daem6i';
private reqHeaders: HttpHeaders;
@@ -61,19 +65,21 @@ export class ReceiptService {
) {
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'});
+ let obs = this.http.get<{message: string, order: any}>(this.beUrl+'api/receipt', { 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);
+ this.userService.getOwner(this.dataStore.order.address);
+ this.ownerUpdate.subscribe((owner) => {
+ this.dataStore.owner = owner;
+ this._nameUpdated.next(Object.assign({}, this.dataStore).owner.name);
+ });
} else {
console.log('No order found');
}
@@ -81,4 +87,5 @@ export class ReceiptService {
return obs;
}
+
}
diff --git a/src/app/receipt/receipt.component.css b/src/app/receipt/receipt.component.css
index 4f0d6ea..150ba86 100644
--- a/src/app/receipt/receipt.component.css
+++ b/src/app/receipt/receipt.component.css
@@ -28,3 +28,9 @@
span.tt{
font-family: 'Roboto-Mono', monospace;
}
+img.total{
+ margin-bottom:-2px;
+}
+.small{
+ font-size: 10px;
+}
diff --git a/src/app/receipt/receipt.component.html b/src/app/receipt/receipt.component.html
index 56360b4..bf950f6 100644
--- a/src/app/receipt/receipt.component.html
+++ b/src/app/receipt/receipt.component.html
@@ -4,19 +4,40 @@
- Name
+ {{name}}
- Receipt
+ Total: {{order.totalZec | number: '1.0-6'}}
- Date
+ {{order.timestamp | date}}
-receipt works! orderID:{{orderId}}
+ Order ID: {{orderId}}
+ Zcash Price: {{order.price | currency: order.currency.toUpperCase()}}
+
+
+
+
+ Item
+ |
+
+ Qty.
+ |
+
+ Price ({{order.currency.toUpperCase()}})
+ |
+
+
+ {{item.name}} |
+ {{item.qty}} |
+ {{(item.qty * item.cost) | currency: order.currency.toUpperCase()}} |
+
+
+
diff --git a/src/app/receipt/receipt.component.ts b/src/app/receipt/receipt.component.ts
index 7a0988e..67e9038 100644
--- a/src/app/receipt/receipt.component.ts
+++ b/src/app/receipt/receipt.component.ts
@@ -1,7 +1,8 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Order} from '../order/order.model';
-import { OrderService } from '../order/order.service';
+import { ReceiptService } from '../receipt.service';
+import { Observable } from 'rxjs';
@Component({
selector: 'app-receipt',
@@ -10,14 +11,42 @@ import { OrderService } from '../order/order.service';
})
export class ReceiptComponent implements OnInit {
orderId;
- //order:Order;
+ public orderUpdate: Observable
;
+ public nameUpdate: Observable;
+ name: string = '';
+ order:Order = {
+ address: '',
+ session: '',
+ timestamp: '',
+ closed: false,
+ currency: '',
+ price: 0,
+ total: 0,
+ totalZec: 0,
+ lines: [
+ {
+ qty: 1,
+ name: '',
+ cost:0
+ }
+ ]
+ };
constructor(
private _ActiveRoute:ActivatedRoute,
- public orderService: OrderService
+ public receiptService: ReceiptService
) {
this.orderId = this._ActiveRoute.snapshot.paramMap.get("orderId");
+ this.orderUpdate = receiptService.orderUpdate;
+ this.nameUpdate = receiptService.nameUpdate;
+ receiptService.getOrderById(this.orderId!);
+ this.orderUpdate.subscribe(order => {
+ this.order = order;
+ });
+ this.nameUpdate.subscribe(name => {
+ this.name = name;
+ });
}
ngOnInit(): void {
diff --git a/src/assets/logo.png b/src/assets/logo.png
deleted file mode 100644
index 5c1d436..0000000
Binary files a/src/assets/logo.png and /dev/null differ
diff --git a/src/assets/zgo-prp.png b/src/assets/zgo-prp.png
new file mode 100644
index 0000000..75944c9
Binary files /dev/null and b/src/assets/zgo-prp.png differ