RanchiMall/flosight-api
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add expand toggle; add expanded output attributes

Browse Source
This commit is contained in:
Darren Nelsen 2017-08-08 13:11:36 -04:00
parent 3b873f4841
commit 269bbfe549
3 changed files with 33 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/src/components/transaction/transaction.html
View File

@ -1,7 +1,7 @@
<ion-grid> <ion-grid>
<ion-row> <ion-row>
<ion-col col-8> <ion-col col-8>
<span><a (click)="goToTx(tx.txid)">{{ tx.txid }}</a></span> <ion-icon name="add-circle" [hidden]="expanded" (click)="toggleExpanded()"></ion-icon><ion-icon name="remove-circle" [hidden]="!expanded" (click)="toggleExpanded()"></ion-icon> <span class="ellipsis"><a (click)="goToTx(tx.txid)">{{ tx.txid }}</a></span>
</ion-col> </ion-col>
<ion-col col-4 text-right> <ion-col col-4 text-right>
<div [hidden]="!tx.firstSeenTs"> <div [hidden]="!tx.firstSeenTs">
@ -33,17 +33,22 @@
</ion-col> </ion-col>
<ion-col col-2 text-center> <ion-col col-2 text-center>
<div> <ion-icon name="arrow-forward"></ion-icon>
&gt;
</div>
</ion-col> </ion-col>
<ion-col col-5> <ion-col col-5>
<ion-list> <ion-list>
<ion-item *ngFor="let vout of tx.vout"> <ion-item *ngFor="let vout of tx.vout">
<a (click)="goToAddress(getAddress(vout))">{{ getAddress(vout) }}</a> <div>
<div item-end> <p><a (click)="goToAddress(getAddress(vout))">{{ getAddress(vout) }}</a></p>
{{ vout.value + ' BTC' }} <span [hidden]="!vout.spentTxId">(S)</span><span [hidden]="vout.spentTxId">(U)</span> <div [hidden]="!expanded">
<p><b>Type</b> {{vout.scriptPubKey.type}}</p>
<p><b>scriptPubKey</b><br><span class="ellipsis">{{vout.scriptPubKey.asm}}</span></p>
</div> </div>
</div>
<div item-end>
{{ vout.value + ' BTC' }} <span [hidden]="!vout.spentTxId">(S)</span><span [hidden]="vout.spentTxId">(U)</span>
</div>
</ion-item> </ion-item>
</ion-list> </ion-list>
</ion-col> </ion-col>
@ -51,7 +56,7 @@
<ion-row> <ion-row>
<ion-col col-6> <ion-col col-6>
<span [hidden]="tx.isCoinBase">Fee {{ tx.fees + 'BTC' }}</span> <span [hidden]="tx.isCoinBase">Fee {{ tx.fees + ' BTC' }}</span>
</ion-col> </ion-col>
<ion-col col-6 text-right> <ion-col col-6 text-right>
{{ tx.confirmations }} Confirmations {{ tx.confirmations }} Confirmations

15
app/src/components/transaction/transaction.scss
View File

@ -1,3 +1,18 @@
transaction { transaction {
ion-grid {
background-color: #F4F4F4;
border: 1px solid #eee;
border-radius: 2px;
ion-row {
border: 1px solid #eee;
}
}
.ellipsis {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
} }

5
app/src/components/transaction/transaction.ts
View File

@ -14,6 +14,7 @@ import { NavController } from 'ionic-angular';
}) })
export class TransactionComponent { export class TransactionComponent {
public expanded: boolean = false;
@Input() public tx: any = {}; @Input() public tx: any = {};
constructor(private navCtrl: NavController) { constructor(private navCtrl: NavController) {
@ -38,4 +39,8 @@ export class TransactionComponent {
'addrStr': addrStr 'addrStr': addrStr
}); });
} }
public toggleExpanded(): void {
this.expanded = !this.expanded;
}
} }