From 230a81eda089cf8bc921b4deec303b6c60e55db1 Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Sat, 19 Mar 2022 20:21:26 +0100 Subject: [PATCH] Add transactions details for all wallets --- .../plugins/core/wallet/wallet-app.src.js | 367 +++++++++++++++++- 1 file changed, 360 insertions(+), 7 deletions(-) diff --git a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js index 94d2756b..4fb59af1 100644 --- a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js +++ b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js @@ -706,6 +706,156 @@ class MultiWallet extends LitElement { + +
+

Transaction Details

+
+
+
+ Transaction Type +
+
+ PAYMENT + ${this.selectedTransaction.btcTxnFlow === 'OUT' ? html`OUT` : html`IN`} +
+ Sender +
+
+ ${this.selectedTransaction.btcSender} +
+ Receiver +
+
+ ${this.selectedTransaction.btcReceiver} +
+ Transaction Fee +
+
+ ${(this.selectedTransaction.feeAmount / 1e8).toFixed(8)} BTC +
+ Total Amount +
+
+ ${(this.selectedTransaction.totalAmount / 1e8).toFixed(8)} BTC +
+ Time +
+
${new Date(this.selectedTransaction.timestamp).toString()}
+ Transaction Hash +
+
+ ${this.selectedTransaction.txHash} +
+
+ + Close + + + + +
+

Transaction Details

+
+
+
+ Transaction Type +
+
+ PAYMENT + ${this.selectedTransaction.ltcTxnFlow === 'OUT' ? html`OUT` : html`IN`} +
+ Sender +
+
+ ${this.selectedTransaction.ltcSender} +
+ Receiver +
+
+ ${this.selectedTransaction.ltcReceiver} +
+ Transaction Fee +
+
+ ${(this.selectedTransaction.feeAmount / 1e8).toFixed(8)} LTC +
+ Total Amount +
+
+ ${(this.selectedTransaction.totalAmount / 1e8).toFixed(8)} LTC +
+ Time +
+
${new Date(this.selectedTransaction.timestamp).toString()}
+ Transaction Hash +
+
+ ${this.selectedTransaction.txHash} +
+
+ + Close + + + + +
+

Transaction Details

+
+
+
+ Transaction Type +
+
+ PAYMENT + ${this.selectedTransaction.dogeTxnFlow === 'OUT' ? html`OUT` : html`IN`} +
+ Sender +
+
+ ${this.selectedTransaction.dogeSender} +
+ Receiver +
+
+ ${this.selectedTransaction.dogeReceiver} +
+ Transaction Fee +
+
+ ${(this.selectedTransaction.feeAmount / 1e8).toFixed(8)} DOGE +
+ Total Amount +
+
+ ${(this.selectedTransaction.totalAmount / 1e8).toFixed(8)} DOGE +
+ Time +
+
${new Date(this.selectedTransaction.timestamp).toString()}
+ Transaction Hash +
+
+ ${this.selectedTransaction.txHash} +
+
+ + Close + + +
@@ -1642,7 +1792,7 @@ class MultiWallet extends LitElement { } const sortedTransactions = txs.sort(compareFn) - + console.log(sortedTransactions) if (this._selectedWallet == coin) { this.wallets.get(this._selectedWallet).transactions = sortedTransactions } @@ -1704,8 +1854,35 @@ class MultiWallet extends LitElement { this.transactionsGrid.addEventListener( 'click', (e) => { - let myItem = this.transactionsGrid.getEventContext(e).item - this.showTransactionDetails(myItem, this.wallets.get(this._selectedWallet).transactions) + let qortItem = this.transactionsGrid.getEventContext(e).item + this.showQortTransactionDetails(qortItem, this.wallets.get(this._selectedWallet).transactions) + }, + { passive: true } + ) + } else if (coin === 'btc') { + this.transactionsGrid.addEventListener( + 'click', + (e) => { + let btcItem = this.transactionsGrid.getEventContext(e).item + this.showBtcTransactionDetails(btcItem, this.wallets.get(this._selectedWallet).transactions) + }, + { passive: true } + ) + } else if (coin === 'ltc') { + this.transactionsGrid.addEventListener( + 'click', + (e) => { + let ltcItem = this.transactionsGrid.getEventContext(e).item + this.showLtcTransactionDetails(ltcItem, this.wallets.get(this._selectedWallet).transactions) + }, + { passive: true } + ) + } else if (coin === 'doge') { + this.transactionsGrid.addEventListener( + 'click', + (e) => { + let dogeItem = this.transactionsGrid.getEventContext(e).item + this.showDogeTransactionDetails(dogeItem, this.wallets.get(this._selectedWallet).transactions) }, { passive: true } ) @@ -1718,8 +1895,12 @@ class MultiWallet extends LitElement { async renderTransactions() { if (this._selectedWallet === 'qort') { render(this.renderQortTransactions(this.wallets.get(this._selectedWallet).transactions, this._selectedWallet), this.transactionsDOM) - } else { - render(this.renderBTCLikeTransactions(this.wallets.get(this._selectedWallet).transactions, this._selectedWallet), this.transactionsDOM) + } else if (this._selectedWallet === 'btc') { + render(this.renderBtcTransactions(this.wallets.get(this._selectedWallet).transactions, this._selectedWallet), this.transactionsDOM) + } else if (this._selectedWallet === 'ltc') { + render(this.renderLtcTransactions(this.wallets.get(this._selectedWallet).transactions, this._selectedWallet), this.transactionsDOM) + } else if (this._selectedWallet === 'doge') { + render(this.renderDogeTransactions(this.wallets.get(this._selectedWallet).transactions, this._selectedWallet), this.transactionsDOM) } } @@ -1780,7 +1961,137 @@ class MultiWallet extends LitElement { ` } - renderBTCLikeTransactions(transactions, coin) { + renderBtcTransactions(transactions, coin) { + return html` +
Address has no transactions yet.
+ + { + render(html`check`, root) + }} + > + + { + render(html` PAYMENT ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`OUT` : html`IN`} `, root) + }} + > + + { + render(html`${data.item.inputs[0].address}`, root) + }} + > + + { + render(html`${data.item.outputs[0].address}`, root) + }} + > + + + { + const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8) + render(html`${amount}`, root) + }} + > + + { + const time = new Date(data.item.timestamp * 1000) + render(html` `, root) + }} + > + + +
+ ` + } + + renderLtcTransactions(transactions, coin) { + return html` +
Address has no transactions yet.
+ + { + render(html`check`, root) + }} + > + + { + render(html` PAYMENT ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`OUT` : html`IN`} `, root) + }} + > + + { + render(html`${data.item.inputs[0].address}`, root) + }} + > + + { + render(html`${data.item.outputs[0].address}`, root) + }} + > + + + { + const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8) + render(html`${amount}`, root) + }} + > + + { + const time = new Date(data.item.timestamp * 1000) + render(html` `, root) + }} + > + + +
+ ` + } + + renderDogeTransactions(transactions, coin) { return html`
Address has no transactions yet.
@@ -1963,7 +2274,7 @@ class MultiWallet extends LitElement { ` } - showTransactionDetails(myTransaction, allTransactions) { + showQortTransactionDetails(myTransaction, allTransactions) { allTransactions.forEach((transaction) => { if (myTransaction.signature === transaction.signature) { let txnFlow = myTransaction.creatorAddress === this.wallets.get('qort').wallet.address ? 'OUT' : 'IN' @@ -1975,6 +2286,48 @@ class MultiWallet extends LitElement { }) } + showBtcTransactionDetails(myTransaction, allTransactions) { + allTransactions.forEach((transaction) => { + if (myTransaction.txHash === transaction.txHash) { + let btcTxnFlow = myTransaction.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? 'OUT' : 'IN' + let btcSender = myTransaction.inputs[0].address + let btcReceiver = myTransaction.outputs[0].address + this.selectedTransaction = { ...transaction, btcTxnFlow, btcSender, btcReceiver } + if (this.selectedTransaction.txHash.length != 0) { + this.shadowRoot.querySelector('#showBtcTransactionDetailsDialog').show() + } + } + }) + } + + showLtcTransactionDetails(myTransaction, allTransactions) { + allTransactions.forEach((transaction) => { + if (myTransaction.txHash === transaction.txHash) { + let ltcTxnFlow = myTransaction.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? 'OUT' : 'IN' + let ltcSender = myTransaction.inputs[0].address + let ltcReceiver = myTransaction.outputs[0].address + this.selectedTransaction = { ...transaction, ltcTxnFlow, ltcSender, ltcReceiver } + if (this.selectedTransaction.txHash.length != 0) { + this.shadowRoot.querySelector('#showLtcTransactionDetailsDialog').show() + } + } + }) + } + + showDogeTransactionDetails(myTransaction, allTransactions) { + allTransactions.forEach((transaction) => { + if (myTransaction.txHash === transaction.txHash) { + let dogeTxnFlow = myTransaction.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? 'OUT' : 'IN' + let dogeSender = myTransaction.inputs[0].address + let dogeReceiver = myTransaction.outputs[0].address + this.selectedTransaction = { ...transaction, dogeTxnFlow, dogeSender, dogeReceiver } + if (this.selectedTransaction.txHash.length != 0) { + this.shadowRoot.querySelector('#showDogeTransactionDetailsDialog').show() + } + } + }) + } + isEmptyArray(arr) { if (!arr) { return true