highperfocused/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2025-03-26 17:51:45 +01:00
Code Issues Packages Projects Releases Wiki Activity

Enhancement: "Load more" is now "Load all"

Browse Source 
fixes #117
This commit is contained in:
softsimon 2020-09-29 15:05:52 +07:00
parent dfaa73803e
commit 0f72030d5e
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
2 changed files with 9 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/app/components/transactions-list/transactions-list.component.html
View File

@ -17,7 +17,7 @@
<div class="col">
<table class="table table-borderless smaller-text table-xs" style="margin: 0;">
<tbody>
<tr *ngFor="let vin of getFilteredTxVin(tx); trackBy: trackByIndexFn">
<tr *ngFor="let vin of (tx['@vinLimit'] ? tx.vin.slice(0, 10) : tx.vin); trackBy: trackByIndexFn">
<td class="arrow-td">
<ng-template [ngIf]="vin.prevout === null && !vin.is_pegin" [ngIfElse]="hasPrevout">
<i class="arrow grey"></i>
@ -61,9 +61,9 @@
</ng-template>
</td>
</tr>
<tr *ngIf="tx.vin.length > tx['@vinLength']">
<tr *ngIf="tx.vin.length > 10 && tx['@vinLimit']">
<td colspan="3" class="text-center">
<button class="btn btn-sm btn-primary mt-2" (click)="loadMoreVin(tx)">Load more ({{ tx.vin.length - tx['@vinLength'] }})</button>
<button class="btn btn-sm btn-primary mt-2" (click)="tx['@vinLimit'] = false;">Load all ({{ tx.vin.length - 10 }})</button>
</td>
</tr>
</tbody>
@ -73,7 +73,7 @@
<div class="col mobile-bottomcol">
<table class="table table-borderless smaller-text table-xs" style="margin: 0;">
<tbody>
<tr *ngFor="let vout of getFilteredTxVout(tx); let vindex = index; trackBy: trackByIndexFn">
<tr *ngFor="let vout of (tx['@voutLimit'] ? tx.vout.slice(0, 10) : tx.vout); let vindex = index; trackBy: trackByIndexFn">
<td>
<a *ngIf="vout.scriptpubkey_address; else scriptpubkey_type" [routerLink]="['/address/' | relativeUrl, vout.scriptpubkey_address]" title="{{ vout.scriptpubkey_address }}">
<span class="d-block d-lg-none">{{ vout.scriptpubkey_address | shortenString : 16 }}</span>
@ -111,9 +111,9 @@
</ng-template>
</td>
</tr>
<tr *ngIf="tx.vout.length > tx['@voutLength']">
<tr *ngIf="tx.vout.length > 10 && tx['@voutLimit']">
<td colspan="3" class="text-center">
<button class="btn btn-sm btn-primary mt-2" (click)="loadMoreVout(tx)">Load more ({{ tx.vout.length - tx['@voutLength'] }})</button>
<button class="btn btn-sm btn-primary mt-2" (click)="tx['@voutLimit'] = false;">Load all ({{ tx.vout.length - 10 }})</button>
</td>
</tr>
</tbody>

24
frontend/src/app/components/transactions-list/transactions-list.component.ts
View File

@ -51,8 +51,8 @@ export class TransactionsListComponent implements OnInit, OnChanges {
}
const observableObject = {};
this.transactions.forEach((tx, i) => {
tx['@voutLength'] = 10;
tx['@vinLength'] = 10;
tx['@voutLimit'] = true;
tx['@vinLimit'] = true;
if (this.outspends[i]) {
return;
}
@ -88,28 +88,10 @@ export class TransactionsListComponent implements OnInit, OnChanges {
this.stateService.viewFiat$.next(oldvalue);
}
trackByFn(index: number, tx: Transaction) {
trackByFn(index: number, tx: Transaction): string {
return tx.txid + tx.status.confirmed;
}
loadMoreVin(tx: Transaction) {
tx['@vinLength'] += 10;
this.ref.markForCheck();
}
loadMoreVout(tx: Transaction) {
tx['@voutLength'] += 10;
this.ref.markForCheck();
}
getFilteredTxVin(tx: Transaction) {
return tx.vin.slice(0, tx['@vinLength']);
}
getFilteredTxVout(tx: Transaction) {
return tx.vout.slice(0, tx['@voutLength']);
}
trackByIndexFn(index: number) {
return index;
}