fix balance calculation vue glitch.

lnbits/core/static/js/wallet.js

@@ -175,22 +175,20 @@ new Vue({
       disclaimerDialog: {
         show: false,
         location: window.location
-      }
+      },
+      balance: 0
     }
   },
   computed: {
+    formattedBalance: function () {
+      return LNbits.utils.formatSat(this.balance || this.g.wallet.sat)
+    },
     filteredPayments: function () {
       var q = this.paymentsTable.filter
       if (!q || q === '') return this.payments
 
       return LNbits.utils.search(this.payments, q)
     },
-    balance: function () {
-      return this.apiBalance || this.g.wallet.sat
-    },
-    fbalance: function () {
-      return LNbits.utils.formatSat(this.balance)
-    },
     canPay: function () {
       if (!this.send.invoice) return false
       return this.send.invoice.sat <= this.balance
@@ -382,6 +380,16 @@ new Vue({
             })
         })
     },
+    fetchBalance: function () {
+      var self = this
+      LNbits.api.getWallet(self.g.wallet).then(function (response) {
+        self.balance = Math.round(response.data.balance / 1000)
+        EventHub.$emit('update-wallet-balance', [
+          self.g.wallet.id,
+          self.balance
+        ])
+      })
+    },
     checkPendingPayments: function () {
       var dismissMsg = this.$q.notify({
         timeout: 0,
@@ -399,18 +407,11 @@ new Vue({
   },
   watch: {
     payments: function () {
-      var self = this
+      this.fetchBalance()
-
-      LNbits.api.getWallet(self.g.wallet).then(function (response) {
-        self.apiBalance = Math.round(response.data.balance / 1000)
-        EventHub.$emit('update-wallet-balance', [
-          self.g.wallet.id,
-          self.balance
-        ])
-      })
     }
   },
   created: function () {
+    this.fetchBalance()
     this.fetchPayments()
     setTimeout(this.checkPendingPayments(), 1200)
   },

lnbits/core/templates/core/wallet.html

@@ -7,7 +7,7 @@
     <q-card>
       <q-card-section>
         <h3 class="q-my-none">
-          <strong>{% raw %}{{ fbalance }}{% endraw %}</strong> sat
+          <strong>{% raw %}{{ formattedBalance }}{% endraw %}</strong> sat
         </h3>
       </q-card-section>
       <div class="row q-pb-md q-px-md q-col-gutter-md">