62 lines
1.8 KiB
HTML
62 lines
1.8 KiB
HTML
<mat-toolbar color="primary">
|
|
<span align="center">
|
|
<img class="logo" src="/assets/logo-new-white.png" height="40px" />
|
|
</span>
|
|
<span class="spacer"></span>
|
|
<span align="center">
|
|
<p class="text">{{name}}</p>
|
|
</span>
|
|
</mat-toolbar>
|
|
<div align="center" *ngIf="!error" id="invoice">
|
|
<mat-card>
|
|
<mat-card-title>
|
|
Total: <img class="total" src="/assets/spartan-zec.png" height="18px" />{{order.totalZec | number: '1.0-6'}}
|
|
</mat-card-title>
|
|
<mat-card-subtitle>
|
|
{{order.timestamp | date}}
|
|
</mat-card-subtitle>
|
|
<mat-card-content>
|
|
<p class="small">Order ID: {{orderId}}</p>
|
|
<p class="small">Zcash Price: {{order.price | currency: order.currency.toUpperCase()}}</p>
|
|
<div align="center">
|
|
<table>
|
|
<tr>
|
|
<th align="left">
|
|
Item
|
|
</th>
|
|
<th align="center">
|
|
Qty.
|
|
</th>
|
|
<th align="right">
|
|
Price ({{order.currency.toUpperCase()}})
|
|
</th>
|
|
</tr>
|
|
<tr *ngFor="let item of order.lines">
|
|
<td align="left">{{item.name}}</td>
|
|
<td align="center">{{item.qty}}</td>
|
|
<td align="right">{{(item.qty * item.cost) | currency: order.currency.toUpperCase()}} </td>
|
|
<tr>
|
|
</table>
|
|
<div class="qrcode" id="payment-qr" *ngIf="!order.paid"></div>
|
|
<span *ngIf="order.paid"><fa-icon [icon]="faCheck" color="primary"></fa-icon>Payment confirmed</span>
|
|
<span *ngIf="!order.paid"><fa-icon [icon]="faHourglass" color="primary"></fa-icon>Payment pending</span>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
</div>
|
|
<div align="center" *ngIf="error">
|
|
<mat-card>
|
|
<mat-card-title>
|
|
Incorrect Invoice ID.
|
|
</mat-card-title>
|
|
<mat-card-content>
|
|
No information available.
|
|
</mat-card-content>
|
|
<mat-card-actions>
|
|
<div align="center">
|
|
<button mat-raised-button [routerLink]="['/']" color="primary">OK</button>
|
|
</div>
|
|
</mat-card-actions>
|
|
</mat-card>
|
|
</div>
|