Add invoicing functionality for orders
This commit is contained in:
parent
37715c1902
commit
796c39bec2
7 changed files with 130 additions and 3 deletions
|
@ -40,6 +40,7 @@ import { ReceiptComponent } from './receipt/receipt.component';
|
|||
import { ReceiptQRComponent } from './receipt-qr/receipt-qr.component';
|
||||
import { InvoiceComponent } from './invoice/invoice.component';
|
||||
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
||||
import { PromptInvoiceComponent } from './prompt-invoice/prompt-invoice.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
|
@ -62,7 +63,8 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|||
TermsComponent,
|
||||
ReceiptComponent,
|
||||
ReceiptQRComponent,
|
||||
InvoiceComponent
|
||||
InvoiceComponent,
|
||||
PromptInvoiceComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
|
|
|
@ -31,6 +31,9 @@
|
|||
<td>
|
||||
<button mat-raised-button class="text" (click)="cancelOrder()">Cancel</button>
|
||||
</td>
|
||||
<td>
|
||||
<button mat-raised-button class="text" (click)="invoice()"><fa-icon [icon]="faInvoice" size="2x"></fa-icon> Invoice</button>
|
||||
</td>
|
||||
<td align="right">
|
||||
<button mat-raised-button class="text" color="primary" (click)="checkout()">Checkout</button>
|
||||
</td>
|
||||
|
|
|
@ -3,11 +3,12 @@ import { MatDialog, MatDialogConfig} from '@angular/material/dialog';
|
|||
import { Observable } from 'rxjs';
|
||||
import { Order } from './order.model';
|
||||
import { FullnodeService } from '../fullnode.service';
|
||||
import { UserService } from '../user.service';
|
||||
import { OrderService } from './order.service';
|
||||
import { CancelComponent } from '../cancel/cancel.component';
|
||||
import { CheckoutComponent} from '../checkout/checkout.component';
|
||||
import { PromptInvoiceComponent } from '../prompt-invoice/prompt-invoice.component';
|
||||
import { ReceiptQRComponent} from '../receipt-qr/receipt-qr.component';
|
||||
import { faFileInvoiceDollar } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
@Component({
|
||||
selector: 'app-order',
|
||||
|
@ -16,6 +17,7 @@ import { ReceiptQRComponent} from '../receipt-qr/receipt-qr.component';
|
|||
})
|
||||
|
||||
export class OrderComponent implements OnInit{
|
||||
faInvoice = faFileInvoiceDollar;
|
||||
public order: Order = {
|
||||
address: '',
|
||||
session: '',
|
||||
|
@ -84,7 +86,7 @@ export class OrderComponent implements OnInit{
|
|||
|
||||
checkout() {
|
||||
var zec = this.total/this.price;
|
||||
this.order.totalZec = parseFloat(zec.toFixed(6));
|
||||
this.order.totalZec = parseFloat(zec.toFixed(8));
|
||||
const dialogConfig = new MatDialogConfig();
|
||||
|
||||
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(){
|
||||
return this.order.currency.toUpperCase();
|
||||
}
|
||||
|
|
3
src/app/prompt-invoice/prompt-invoice.component.css
Normal file
3
src/app/prompt-invoice/prompt-invoice.component.css
Normal file
|
@ -0,0 +1,3 @@
|
|||
.text {
|
||||
font-family: 'Spartan', sans-serif;
|
||||
}
|
25
src/app/prompt-invoice/prompt-invoice.component.html
Normal file
25
src/app/prompt-invoice/prompt-invoice.component.html
Normal 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>
|
25
src/app/prompt-invoice/prompt-invoice.component.spec.ts
Normal file
25
src/app/prompt-invoice/prompt-invoice.component.spec.ts
Normal 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();
|
||||
});
|
||||
});
|
46
src/app/prompt-invoice/prompt-invoice.component.ts
Normal file
46
src/app/prompt-invoice/prompt-invoice.component.ts
Normal 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);
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue