Order's detail list format updated - paid icon added to list header

This commit is contained in:
Rene Vergara 2022-07-11 22:14:58 -05:00
parent 0f13276817
commit b6b5979d82
9 changed files with 115 additions and 19 deletions

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "zgo",
"version": "1.1.1",
"version": "1.1.2",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "zgo",
"version": "1.1.1",
"version": "1.1.2",
"dependencies": {
"@angular/animations": "~13.0.2",
"@angular/cdk": "^12.2.8",

View file

@ -9,7 +9,7 @@ var Buffer = require('buffer/').Buffer;
@Injectable({providedIn: 'root'})
export class FullnodeService{
beUrl = 'http://localhost:3000/';
beUrl = 'https://test.zgo.cash/';
private dataStore: { height: number, memoList: string[], addr: string, price: number } = { height: 0, memoList: [], addr: '', price:0 };
private _heightUpdated: BehaviorSubject<number> = new BehaviorSubject(this.dataStore.height);
private _memoUpdated: BehaviorSubject<string[]> = new BehaviorSubject(this.dataStore.memoList);
@ -48,7 +48,7 @@ export class FullnodeService{
};
constructor(private http: HttpClient, public userService: UserService){
var auth = 'Basic ' + Buffer.from('user:superSecret').toString('base64');
var auth = 'Basic ' + Buffer.from('user:superSecret2').toString('base64');
this.reqHeaders = new HttpHeaders().set('Authorization', auth);
this.ownerUpdate = userService.ownerUpdate;
this.getAddr();

View file

@ -8,7 +8,7 @@ var Buffer = require('buffer/').Buffer;
@Injectable({providedIn: 'root'})
export class ItemService{
beUrl = 'http://localhost:3000/';
beUrl = 'https://test.zgo.cash/';
private dataStore: { items: Item[] } = { items: [] } ;
private _itemsUpdated: BehaviorSubject<Item[]> = new BehaviorSubject(this.dataStore.items);
public readonly itemsUpdated: Observable<Item[]> = this._itemsUpdated.asObservable();
@ -16,7 +16,7 @@ export class ItemService{
private reqHeaders: HttpHeaders;
constructor(private http: HttpClient){
var auth = 'Basic ' + Buffer.from('user:superSecret').toString('base64');
var auth = 'Basic ' + Buffer.from('user:superSecret2').toString('base64');
this.reqHeaders = new HttpHeaders().set('Authorization', auth);
}

View file

@ -1,32 +1,63 @@
.text{
font-family: 'Spartan', sans-serif;
}
.text2 {
font-family: 'Noto sans';
font-size: 15px;
color: #000080;
text-align: left;
margin-left: 5px;
background: lightgray;
}
.orderheader {
background-color: lightgrey !important;
}
.orderdetail {
font-family: 'Noto sans';
font-size: 15px;
color: #000080;
text-align: left;
margin-left: 5px;
background: lightyellow;
}
.number{
font-family: 'Roboto Mono', monospace;
}
img.icon{
margin-bottom: -2px;
}
.price{
display: flex;
align-items: center;
}
.mini{
font-size: x-small;
align-items: center;
display: flex;
padding: 3px;
}
.small{
font-size: small;
}
.total{
font-size: large;
font-family: 'Roboto Mono', monospace;
}
img.total{
margin-bottom:-2px;
}
.central{
max-width: 450px;
}

View file

@ -12,11 +12,21 @@
<tr>
<td width="50%" align="center">
<h3>Today's Total:</h3>
<p class="total"><img class="total" src="/assets/spartan-zec.png" height="18px" />{{todayTotal | number: '1.0-6'}}</p>
<p class="total">
<img src="/assets/zcash.png"
style='height: 18px;
margin: auto;'/>
{{todayTotal | number: '1.0-6'}}
</p>
</td>
<td width="50%" align="center">
<h3>Overall Total:</h3>
<p class="total"><img class="total" src="/assets/spartan-zec.png" height="18px" />{{total | number: '1.0-6'}}</p>
<p class="total">
<img src="/assets/zcash.png"
style='height: 18px;
margin: auto;'/>
{{total | number: '1.0-6'}}
</p>
</td>
</tr>
</table>
@ -29,16 +39,40 @@
<mat-expansion-panel class="text" *ngFor = "let order of orders">
<mat-expansion-panel-header class="text" >
<mat-panel-title>
<span class="price number"><img src="/assets/spartan-zec.png" height="50%" />{{order.totalZec}}</span>
<span class="price"
style='font-family: Noto sans !important;
font-size: 15px;
font-weight: strong;
color: black !important;
margin: auto;'>
<img src="/assets/zcash.png"
style='height: 18px;
margin: auto; '/>&nbsp;{{order.totalZec | number: '1.0-6'}}
</span>
</mat-panel-title>
<mat-panel-description>
{{order.timestamp | date: 'short'}}
<mat-panel-description>
<fa-icon [icon]="getIcon(order)" [style]="getIconStyle(order)" ></fa-icon>
<div style='font-family: Noto sans !important;
font-size: 15px;
font-weight: strong;
color: black !important;
margin: auto;'>
{{order.timestamp | date: 'short'}}
</div>
</mat-panel-description>
</mat-expansion-panel-header>
<p class="text">Order: {{order._id}}</p>
<p class="text">Zcash price: {{order.price | currency: order.currency.toUpperCase()}}</p>
<div class='orderheader'>
<div class="text2"> <b>Order Id</b>: {{order._id}}</div>
<div class="text2"><b>ZCash price</b>: {{order.price | currency: order.currency.toUpperCase()}}
</div>
</div>
<mat-list>
<!--
<mat-list-item class="text small" *ngFor="let item of order.lines">{{item.qty}} x {{item.name}}</mat-list-item>
-->
<div class="orderdetail" *ngFor="let item of order.lines">
{{ item.name }} Qty.: {{ item.qty }}
</div>
</mat-list>
</mat-expansion-panel>
</mat-accordion>

View file

@ -6,6 +6,12 @@ import { UserService } from '../user.service';
import {Owner} from '../owner.model';
import { OrderService } from '../order/order.service';
import { faTimes } from '@fortawesome/free-solid-svg-icons'
import { faTimesCircle } from '@fortawesome/free-solid-svg-icons'
import { faCheck } from '@fortawesome/free-solid-svg-icons'
import { faCheckCircle } from '@fortawesome/free-solid-svg-icons'
import { faHourglass } from '@fortawesome/free-solid-svg-icons'
@Component({
selector: 'app-list-orders',
templateUrl: './listorders.component.html',
@ -19,6 +25,17 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
public ownerUpdate: Observable<Owner>;
public ordersUpdate: Observable<Order[]>;
// ------------------------------------
//
faTimes = faTimes;
faTimesCircle = faTimesCircle;
faCheck = faCheck;
faCheckCircle = faCheckCircle;
faHourglass = faHourglass;
// -------------------------------------
constructor(
public orderService: OrderService,
public userService: UserService
@ -50,4 +67,18 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
this.total = 0;
this.todayTotal = 0;
}
getIcon(order : Order) {
if( order.paid )
return faCheckCircle;
return faHourglass;
}
getIconStyle(order : Order) {
if( order.paid )
return "font-size: 16px; color: #72cc50; margin: auto;";
return "color: #88293d; cursor: pointer;";
}
}

View file

@ -13,7 +13,7 @@ var Buffer = require('buffer/').Buffer;
@Injectable({providedIn: 'root'})
export class OrderService {
beUrl = 'http://localhost:3000/';
beUrl = 'https://test.zgo.cash/';
private dataStore: {allOrders: Order[], user: User, order: Order, owner: Owner } = {
allOrders: [],
user:{
@ -81,7 +81,7 @@ export class OrderService {
public fullnodeService: FullnodeService,
public userService: UserService
) {
var auth = 'Basic ' + Buffer.from('user:superSecret').toString('base64');
var auth = 'Basic ' + Buffer.from('user:superSecret2').toString('base64');
this.reqHeaders = new HttpHeaders().set('Authorization', auth);
this.userUpdate = userService.userUpdate;
this.ownerUpdate = userService.ownerUpdate;

View file

@ -11,7 +11,7 @@ var Buffer = require('buffer/').Buffer;
providedIn: 'root'
})
export class ReceiptService {
beUrl = 'http://localhost:3000/';
beUrl = 'https://test.zgo.cash/';
private dataStore: {order: Order, owner: Owner } = {
owner: {
_id: '',
@ -67,7 +67,7 @@ export class ReceiptService {
private http: HttpClient,
public userService: UserService
) {
var auth = 'Basic ' + Buffer.from('user:superSecret').toString('base64');
var auth = 'Basic ' + Buffer.from('user:superSecret2').toString('base64');
this.reqHeaders = new HttpHeaders().set('Authorization', auth);
this.ownerUpdate = userService.ownerUpdate;
}

View file

@ -11,7 +11,7 @@ var Buffer = require('buffer/').Buffer;
@Injectable({providedIn: 'root'})
export class UserService{
beUrl = 'http://localhost:3000/';
beUrl = 'https://test.zgo.cash/';
private dataStore: { user: User, owner: Owner, txs: Tx[], countries: Country[]} = {
user: {
address: '',
@ -66,7 +66,7 @@ export class UserService{
private reqHeaders: HttpHeaders;
constructor(private http: HttpClient){
var auth = 'Basic ' + Buffer.from('user:superSecret').toString('base64');
var auth = 'Basic ' + Buffer.from('user:superSecret2').toString('base64');
this.reqHeaders = new HttpHeaders().set('Authorization', auth);
//console.log('US:', this.reqHeaders);
this.session = localStorage.getItem('s4z_token');