optimize UI

src/libs/data/data.js

@@ -269,16 +269,14 @@ export function formatTokenDenom(tokenDenom) {
 }
 
 export function formatTokenAmount(tokenAmount, fraction = 2, denom = 'uatom') {
-  let decimals = 1000000n
+  let amount
   if (denom.startsWith('rowan')) {
-    decimals = 1000000000000000000n
+    // eslint-disable-next-line no-undef
+    amount = Number(BigInt(Number(tokenAmount)) / 1000000000000000000n)
+    // }
+  } else {
+    amount = Number(tokenAmount) / 1000000
   }
-  let ta = tokenAmount
-  if (typeof tokenAmount === 'string' && tokenAmount.indexOf('.') > 0) {
-    ta = tokenAmount.substring(0, tokenAmount.indexOf('.'))
-  }
-  // eslint-disable-next-line no-undef
-  const amount = Number(BigInt(ta) / decimals)
   if (amount > 10) {
     return parseFloat(amount.toFixed(fraction))
   }
@@ -287,7 +285,7 @@ export function formatTokenAmount(tokenAmount, fraction = 2, denom = 'uatom') {
 
 export function formatToken(token, IBCDenom = {}) {
   if (token) {
-    return `${formatTokenAmount(token.amount, 2, token.denom)} ${formatTokenDenom(IBCDenom[token.denom] || token.denom)}`
+    return `${formatTokenAmount(token.amount, 0, token.denom)} ${formatTokenDenom(IBCDenom[token.denom] || token.denom)}`
   }
   return token
 }

src/views/WalletAccounts.vue

@@ -170,18 +170,10 @@
                           :key="i"
                           class="d-flex justify-content-between align-items-center"
                         >
-                          <div class="ml-25 font-weight-bolder text-uppercase text-success">
-                            <b-avatar
-                              variant="light-success"
-                              rounded
-                              title="Balance"
-                            >
-                              <feather-icon
-                                icon="CreditCardIcon"
-                                size="16"
-                                class="d-none d-md-block"
-                              />
-                            </b-avatar>
+                          <div
+                            class="ml-25 font-weight-bolder text-uppercase text-success"
+                            title="Balance"
+                          >
                             {{ formatDenom(b.denom) }}
                             <small
                               :class="priceColor(b.denom)"
@@ -198,18 +190,10 @@
                           :key="`d-${i}`"
                           class="d-flex justify-content-between align-items-center"
                         >
-                          <div class="ml-25 font-weight-bolder text-uppercase text-primary">
-                            <b-avatar
-                              variant="light-primary"
-                              rounded
-                              title="Delegations"
-                            >
-                              <feather-icon
-                                icon="LockIcon"
-                                size="16"
-                                class="d-none d-md-block"
-                              />
-                            </b-avatar>
+                          <div
+                            class="ml-25 font-weight-bolder text-uppercase text-primary"
+                            title="Delegations"
+                          >
                             {{ formatDenom(b.denom) }}
                             <small
                               :class="priceColor(b.denom)"
@@ -556,7 +540,7 @@ export default {
     },
     formatChanges(denom) {
       const price = this.getChanges(denom)
-      return `${parseFloat(price.toFixed(2))}%`
+      return price === 0 ? '' : `${parseFloat(price.toFixed(2))}%`
     },
     formatBalance(v) {
       let total = 0