diff --git a/lnbits/core/static/js/node.js b/lnbits/core/static/js/node.js index 82e6b1c82..c7dad9acb 100644 --- a/lnbits/core/static/js/node.js +++ b/lnbits/core/static/js/node.js @@ -176,3 +176,93 @@ Vue.component('lnbits-node-info', { ` }) + +Vue.component('lnbits-stat', { + props: ['title', 'amount', 'msat', 'btc'], + computed: { + value: function () { + return ( + this.amount ?? + (this.btc + ? LNbits.utils.formatSat(this.btc) + : LNbits.utils.formatMsat(this.msat)) + ) + } + }, + template: ` + + +
+ {{ title }} +
+
+ {{ value }} + sats + BTC +
+ + + ` +}) + +Vue.component('lnbits-channel-balance', { + props: ['balance', 'color'], + methods: { + formatMsat: function (msat) { + return LNbits.utils.formatMsat(msat) + } + }, + template: ` +
+
+ + Local: {{ formatMsat(balance.local_msat) }} + sats + + + Remote: {{ formatMsat(balance.remote_msat) }} + sats + +
+ + +
+ + {{ balance.alias }} + +
+ +
+ ` +}) + +Vue.component('lnbits-date', { + props: ['ts'], + computed: { + date: function () { + return Quasar.utils.date.formatDate( + new Date(this.ts * 1000), + 'YYYY-MM-DD HH:mm' + ) + }, + dateFrom: function () { + return moment(this.date).fromNow() + } + }, + template: ` +
+ {{ this.date }} + {{ this.dateFrom }} +
+ ` +}) diff --git a/lnbits/core/templates/node/index.html b/lnbits/core/templates/node/index.html index e1b0f6a44..be6c71f04 100644 --- a/lnbits/core/templates/node/index.html +++ b/lnbits/core/templates/node/index.html @@ -47,126 +47,6 @@ Vue.component(VueQrcode.name, VueQrcode) Vue.use(VueQrcodeReader) - {% raw %} - Vue.component('lnbits-stat', - { - props: ['title', 'amount', 'msat', 'btc'], - computed: { - value: function () { - return this.amount ?? (this.btc ? LNbits.utils.formatSat(this.btc) : LNbits.utils.formatMsat(this.msat)) - } - }, - template: ` - - -
- {{ title }} -
-
- {{ value }} - sats - BTC -
- - - ` - } - ) - - - Vue.component('lnbits-channel-balance', - { - props: ['balance', 'color'], - methods: { - formatMsat: function (msat) { - return LNbits.utils.formatMsat(msat) - } - }, - template: ` -
-
- - Local: {{ formatMsat(balance.local_msat) }} - sats - - - Remote: {{ formatMsat(balance.remote_msat) }} - sats - -
- - -
- - {{ balance.alias }} - -
- -
- ` - } - ) - - Vue.component('lnbits-date', - { - props: ['ts'], - computed: { - date: function () { - return Quasar.utils.date.formatDate( - new Date(this.ts * 1000), - 'YYYY-MM-DD HH:mm' - ) - }, - dateFrom: function () { - return moment(this.date).fromNow() - } - }, - template: ` -
- {{ this.date }} - {{ this.dateFrom }} -
- ` - } - ) - - - Vue.component('lnbits-date', - { - props: ['ts'], - computed: { - date: function () { - return Quasar.utils.date.formatDate( - new Date(this.ts * 1000), - 'YYYY-MM-DD HH:mm' - ) - }, - dateFrom: function () { - return moment(this.date).fromNow() - } - }, - template: ` -
- {{ this.date }} - {{ this.dateFrom }} -
- ` - } - ) - - {% endraw %} - - new Vue({ el: '#vue', config: { @@ -190,13 +70,12 @@ filter: '' }, - activeBalance: {}, ranks: {}, peers: { data: [], - filter: '', + filter: '' }, connectPeerDialog: { @@ -315,7 +194,7 @@ label: this.$t('amount') + ' (' + LNBITS_DENOMINATION + ')', field: row => this.formatMsat(row.amount), sortable: true - }, + } ], pagination: { rowsPerPage: 10, @@ -346,9 +225,11 @@ return !_.isEqual(this.settings, this.formData) }, filteredChannels: function () { - return this.stateFilters ? this.channels.data.filter(channel => { - return this.stateFilters.find(({value}) => value == channel.state) - }) : this.channels.data + return this.stateFilters + ? this.channels.data.filter(channel => { + return this.stateFilters.find(({value}) => value == channel.state) + }) + : this.channels.data }, totalBalance: function () { return this.filteredChannels.reduce( @@ -360,7 +241,7 @@ }, {local_msat: 0, remote_msat: 0, total_msat: 0} ) - }, + } }, methods: { formatMsat: function (msat) { @@ -369,29 +250,27 @@ api: function (method, url, options) { const params = new URLSearchParams(options?.query) params.set('usr', this.g.user.id) - return LNbits.api.request(method, `/node/api/v1${url}?${params}`, {}, options?.data) + return LNbits.api + .request(method, `/node/api/v1${url}?${params}`, {}, options?.data) .catch(error => { LNbits.utils.notifyApiError(error) }) }, getChannels: function () { - return this.api('GET', '/channels') - .then(response => { - this.channels.data = response.data - }) + return this.api('GET', '/channels').then(response => { + this.channels.data = response.data + }) }, getInfo: function () { - return this.api('GET', '/info') - .then(response => { - this.info = response.data - this.channel_stats = response.data.channel_stats - }) + return this.api('GET', '/info').then(response => { + this.info = response.data + this.channel_stats = response.data.channel_stats + }) }, get1MLStats: function () { - return this.api('GET', '/rank') - .then(response => { - this.ranks = response.data - }) + return this.api('GET', '/rank').then(response => { + this.ranks = response.data + }) }, getPayments: function (props) { if (props) { @@ -400,13 +279,12 @@ let pagination = this.paymentsTable.pagination const query = { limit: pagination.rowsPerPage, - offset: ((pagination.page - 1) * pagination.rowsPerPage) ?? 0, + offset: (pagination.page - 1) * pagination.rowsPerPage ?? 0 } - return this.api('GET', '/payments', {query}) - .then(response => { - this.paymentsTable.data = response.data.data - this.paymentsTable.pagination.rowsNumber = response.data.total - }) + return this.api('GET', '/payments', {query}).then(response => { + this.paymentsTable.data = response.data.data + this.paymentsTable.pagination.rowsNumber = response.data.total + }) }, getInvoices: function (props) { if (props) { @@ -415,44 +293,40 @@ let pagination = this.invoiceTable.pagination const query = { limit: pagination.rowsPerPage, - offset: ((pagination.page - 1) * pagination.rowsPerPage) ?? 0, + offset: (pagination.page - 1) * pagination.rowsPerPage ?? 0 } - return this.api('GET', '/invoices', {query}) - .then(response => { - this.invoiceTable.data = response.data.data - this.invoiceTable.pagination.rowsNumber = response.data.total - }) + return this.api('GET', '/invoices', {query}).then(response => { + this.invoiceTable.data = response.data.data + this.invoiceTable.pagination.rowsNumber = response.data.total + }) }, getPeers: function () { - return this.api('GET', '/peers') - .then(response => { - this.peers.data = response.data - console.log('peers', this.peers) - }) + return this.api('GET', '/peers').then(response => { + this.peers.data = response.data + console.log('peers', this.peers) + }) }, connectPeer: function () { console.log('peer', this.connectPeerDialog) - this.api('POST', '/peers', {data: this.connectPeerDialog.data}) - .then(() => { + this.api('POST', '/peers', {data: this.connectPeerDialog.data}).then( + () => { this.connectPeerDialog.show = false this.getPeers() - }) + } + ) }, - disconnectPeer: function(id) { + disconnectPeer: function (id) { LNbits.utils - .confirmDialog( - 'Do you really wanna disconnect this peer?' - ) + .confirmDialog('Do you really wanna disconnect this peer?') .onOk(() => { - this.api('DELETE', `/peers/${id}`) - .then(response => { - this.$q.notify({ - message: 'Disconnected', - icon: null - }) - this.needsRestart = true - this.getPeers() + this.api('DELETE', `/peers/${id}`).then(response => { + this.$q.notify({ + message: 'Disconnected', + icon: null }) + this.needsRestart = true + this.getPeers() + }) }) }, openChannel: function () { @@ -467,14 +341,19 @@ }, showCloseChannelDialog: function (channel) { this.closeChannelDialog.show = true - this.closeChannelDialog.data = {force: false, short_id: channel.short_id, ...channel.point} + this.closeChannelDialog.data = { + force: false, + short_id: channel.short_id, + ...channel.point + } }, closeChannel: function () { - this.api('DELETE', '/channels', {query: this.closeChannelDialog.data}) - .then(response => { - this.closeChannelDialog.show = false - this.getChannels() - }) + this.api('DELETE', '/channels', { + query: this.closeChannelDialog.data + }).then(response => { + this.closeChannelDialog.show = false + this.getChannels() + }) }, showOpenChannelDialog: function (peer_id) { this.openChannelDialog.show = true @@ -489,9 +368,7 @@ this.transactionDetailsDialog.data = details console.log('details', details) }, - exportCSV: function () { - - }, + exportCSV: function () {}, shortenNodeId } }) diff --git a/lnbits/core/templates/node/public.html b/lnbits/core/templates/node/public.html index 957a2c19a..b25b123b4 100644 --- a/lnbits/core/templates/node/public.html +++ b/lnbits/core/templates/node/public.html @@ -56,11 +56,6 @@ context %} {% block page %} Vue.component(VueQrcode.name, VueQrcode) Vue.use(VueQrcodeReader) - {% raw %} - - {% endraw %} - - new Vue({ el: '#vue', config: { @@ -109,7 +104,7 @@ context %} {% block page %} {label: 'Pending', value: 'pending', color: 'orange'}, {label: 'Inactive', value: 'inactive', color: 'grey'}, {label: 'Closed', value: 'closed', color: 'red'} - ], + ] } }, created: function () { @@ -124,18 +119,16 @@ context %} {% block page %} return LNbits.api.request(method, '/node/public/api/v1' + url, {}, data) }, getInfo: function () { - this.api('GET', '/info', {}) - .then(response => { - this.info = response.data - this.channel_stats = response.data.channel_stats - }) + this.api('GET', '/info', {}).then(response => { + this.info = response.data + this.channel_stats = response.data.channel_stats + }) }, get1MLStats: function () { - this.api('GET', '/rank', {}) - .then(response => { - this.ranks = response.data - }) - }, + this.api('GET', '/rank', {}).then(response => { + this.ranks = response.data + }) + } } })