Add invoicing functionality for orders

This commit is contained in:
Rene Vergara 2022-05-23 15:52:55 -05:00
parent 37715c1902
commit 796c39bec2
Signed by: pitmutt
GPG key ID: 65122AD495A7F5B2
7 changed files with 130 additions and 3 deletions

View file

@ -40,6 +40,7 @@ import { ReceiptComponent } from './receipt/receipt.component';
import { ReceiptQRComponent } from './receipt-qr/receipt-qr.component'; import { ReceiptQRComponent } from './receipt-qr/receipt-qr.component';
import { InvoiceComponent } from './invoice/invoice.component'; import { InvoiceComponent } from './invoice/invoice.component';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { PromptInvoiceComponent } from './prompt-invoice/prompt-invoice.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -62,7 +63,8 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
TermsComponent, TermsComponent,
ReceiptComponent, ReceiptComponent,
ReceiptQRComponent, ReceiptQRComponent,
InvoiceComponent InvoiceComponent,
PromptInvoiceComponent
], ],
imports: [ imports: [
BrowserModule, BrowserModule,

View file

@ -31,6 +31,9 @@
<td> <td>
<button mat-raised-button class="text" (click)="cancelOrder()">Cancel</button> <button mat-raised-button class="text" (click)="cancelOrder()">Cancel</button>
</td> </td>
<td>
<button mat-raised-button class="text" (click)="invoice()"><fa-icon [icon]="faInvoice" size="2x"></fa-icon> Invoice</button>
</td>
<td align="right"> <td align="right">
<button mat-raised-button class="text" color="primary" (click)="checkout()">Checkout</button> <button mat-raised-button class="text" color="primary" (click)="checkout()">Checkout</button>
</td> </td>

View file

@ -3,11 +3,12 @@ import { MatDialog, MatDialogConfig} from '@angular/material/dialog';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
import { Order } from './order.model'; import { Order } from './order.model';
import { FullnodeService } from '../fullnode.service'; import { FullnodeService } from '../fullnode.service';
import { UserService } from '../user.service';
import { OrderService } from './order.service'; import { OrderService } from './order.service';
import { CancelComponent } from '../cancel/cancel.component'; import { CancelComponent } from '../cancel/cancel.component';
import { CheckoutComponent} from '../checkout/checkout.component'; import { CheckoutComponent} from '../checkout/checkout.component';
import { PromptInvoiceComponent } from '../prompt-invoice/prompt-invoice.component';
import { ReceiptQRComponent} from '../receipt-qr/receipt-qr.component'; import { ReceiptQRComponent} from '../receipt-qr/receipt-qr.component';
import { faFileInvoiceDollar } from '@fortawesome/free-solid-svg-icons';
@Component({ @Component({
selector: 'app-order', selector: 'app-order',
@ -16,6 +17,7 @@ import { ReceiptQRComponent} from '../receipt-qr/receipt-qr.component';
}) })
export class OrderComponent implements OnInit{ export class OrderComponent implements OnInit{
faInvoice = faFileInvoiceDollar;
public order: Order = { public order: Order = {
address: '', address: '',
session: '', session: '',
@ -84,7 +86,7 @@ export class OrderComponent implements OnInit{
checkout() { checkout() {
var zec = this.total/this.price; var zec = this.total/this.price;
this.order.totalZec = parseFloat(zec.toFixed(6)); this.order.totalZec = parseFloat(zec.toFixed(8));
const dialogConfig = new MatDialogConfig(); const dialogConfig = new MatDialogConfig();
dialogConfig.disableClose = true; dialogConfig.disableClose = true;
@ -118,6 +120,27 @@ export class OrderComponent implements OnInit{
}); });
} }
invoice() {
var zec = this.total/this.price;
this.order.totalZec = parseFloat(zec.toFixed(8));
const dialogConfig = new MatDialogConfig();
dialogConfig.disableClose = true;
dialogConfig.autoFocus = true;
dialogConfig.data = {
orderId: this.order._id
};
const dialogRef = this.dialog.open(PromptInvoiceComponent, dialogConfig);
dialogRef.afterClosed().subscribe((val) => {
if (val) {
this.orderService.closeOrder();
} else {
console.log('Returning to order');
}
});
}
getCurrency(){ getCurrency(){
return this.order.currency.toUpperCase(); return this.order.currency.toUpperCase();
} }

View file

@ -0,0 +1,3 @@
.text {
font-family: 'Spartan', sans-serif;
}

View file

@ -0,0 +1,25 @@
<div align="center" mat-dialog-title class="text">
Send the invoice link to your client:
</div>
<mat-dialog-content class="text">
{{invoiceUrl}} <button mat-raised-button (click)="copyUrl()"><mat-icon class="icon">content_copy</mat-icon></button>
</mat-dialog-content>
<mat-dialog-actions>
<table cellspacing="0" width="100%">
<tr>
<td>
<button mat-raised-button class="text" color="primary" (click)="confirm()">
<mat-icon class="icon">verified_user</mat-icon>Sent!
</button>
</td>
<td align="right">
<button mat-raised-button class="text" (click)="close()">
<mat-icon class="icon">close</mat-icon>Cancel
</button>
</td>
</tr>
</table>
</mat-dialog-actions>

View file

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { PromptInvoiceComponent } from './prompt-invoice.component';
describe('PromptInvoiceComponent', () => {
let component: PromptInvoiceComponent;
let fixture: ComponentFixture<PromptInvoiceComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ PromptInvoiceComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(PromptInvoiceComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View file

@ -0,0 +1,46 @@
import { Inject, Component, OnInit} from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
var URLSafeBase64 = require('urlsafe-base64');
var Buffer = require('buffer/').Buffer;
@Component({
selector: 'app-prompt-invoice',
templateUrl: './prompt-invoice.component.html',
styleUrls: ['./prompt-invoice.component.css']
})
export class PromptInvoiceComponent implements OnInit {
orderId: string;
invoiceUrl: string;
constructor(
private dialogRef: MatDialogRef<PromptInvoiceComponent>,
@Inject(MAT_DIALOG_DATA) public data: {orderId: string}
) {
this.orderId = data.orderId;
this.invoiceUrl = 'https://app.zgo.cash/invoice/'+this.orderId;
}
ngOnInit(): void {
}
confirm() {
this.dialogRef.close(true);
}
close() {
this.dialogRef.close(false);
}
copyUrl() {
if (!navigator.clipboard) {
alert("Copy functionality not supported");
}
try {
navigator.clipboard.writeText(this.invoiceUrl);
} catch (err) {
console.error("Error", err);
}
}
}