From acfa292e91f218f376b5d425303e9e4e445df551 Mon Sep 17 00:00:00 2001
From: Pham Tu <tubackkhoa@gmail.com>
Date: Thu, 25 Jan 2024 18:33:39 +0700
Subject: [PATCH] fix format decimal

---
 src/modules/[chain]/account/[address].vue | 61 ++++++++++++++---------
 src/stores/useFormatter.ts                |  9 ++--
 2 files changed, 43 insertions(+), 27 deletions(-)

diff --git a/src/modules/[chain]/account/[address].vue b/src/modules/[chain]/account/[address].vue
index b0e66e32..991e28a5 100644
--- a/src/modules/[chain]/account/[address].vue
+++ b/src/modules/[chain]/account/[address].vue
@@ -81,20 +81,23 @@ const totalAmount = computed(() => {
 const totalValue = computed(() => {
   let value = 0;
   delegations.value?.forEach((x) => {
-    value += format.tokenValueNumber(x.balance);
+    value += format.tokenValueNumber(x.balance, 1e18);
   });
   rewards.value?.total?.forEach((x) => {
-    value += format.tokenValueNumber(x);
+    value += format.tokenValueNumber(x, 1e18);
   });
   balances.value?.forEach((x) => {
-    value += format.tokenValueNumber(x);
+    value += format.tokenValueNumber(x, 1e18);
   });
   unbonding.value?.forEach((x) => {
     x.entries?.forEach((y) => {
-      value += format.tokenValueNumber({
-        amount: y.balance,
-        denom: stakingStore.params.bondDenom,
-      });
+      value += format.tokenValueNumber(
+        {
+          amount: y.balance,
+          denom: stakingStore.params.bondDenom,
+        },
+        1e18
+      );
     });
   });
   return format.formatNumber(value, '0,0.00');
@@ -264,7 +267,7 @@ function mapAmount(events: readonly Event[]) {
               </div>
               <div class="flex-1">
                 <div class="text-sm font-semibold">
-                  {{ format.formatToken(delegationItem?.balance) }}
+                  {{ format.formatToken2(delegationItem?.balance) }}
                 </div>
                 <div class="text-xs">
                   {{
@@ -304,7 +307,7 @@ function mapAmount(events: readonly Event[]) {
               </div>
               <div class="flex-1">
                 <div class="text-sm font-semibold">
-                  {{ format.formatToken(rewardItem) }}
+                  {{ format.formatToken2(rewardItem, 1e18) }}
                 </div>
                 <div class="text-xs">
                   {{ format.calculatePercent(rewardItem.amount, totalAmount) }}
@@ -316,7 +319,7 @@ function mapAmount(events: readonly Event[]) {
                 <span
                   class="inset-x-0 inset-y-0 opacity-10 absolute bg-primary dark:invert text-sm"
                 ></span
-                >${{ format.tokenValue(rewardItem) }}
+                >${{ format.tokenValue(rewardItem, 1e18) }}
               </div>
             </div>
             <!-- mdi-account-arrow-right -->
@@ -336,10 +339,13 @@ function mapAmount(events: readonly Event[]) {
               <div class="flex-1">
                 <div class="text-sm font-semibold">
                   {{
-                    format.formatToken({
-                      amount: String(unbondingTotal),
-                      denom: stakingStore.params.bondDenom,
-                    })
+                    format.formatToken2(
+                      {
+                        amount: String(unbondingTotal),
+                        denom: stakingStore.params.bondDenom,
+                      },
+                      1e18
+                    )
                   }}
                 </div>
                 <div class="text-xs">
@@ -353,10 +359,13 @@ function mapAmount(events: readonly Event[]) {
                   class="inset-x-0 inset-y-0 opacity-10 absolute bg-primary dark:invert"
                 ></span>
                 ${{
-                  format.tokenValue({
-                    amount: String(unbondingTotal),
-                    denom: stakingStore.params.bondDenom,
-                  })
+                  format.tokenValue(
+                    {
+                      amount: String(unbondingTotal),
+                      denom: stakingStore.params.bondDenom,
+                    },
+                    1e18
+                  )
                 }}
               </div>
             </div>
@@ -426,7 +435,11 @@ function mapAmount(events: readonly Event[]) {
                     rewards?.rewards?.find(
                       (x) =>
                         x.validatorAddress === v.delegation.validatorAddress
-                    )?.reward
+                    )?.reward,
+                    undefined,
+                    undefined,
+                    undefined,
+                    1e18
                   )
                 }}
               </td>
@@ -531,7 +544,9 @@ function mapAmount(events: readonly Event[]) {
                       denom: stakingStore.params.bondDenom,
                     },
                     true,
-                    '0,0.[00]'
+                    '0,0.[00]',
+                    undefined,
+                    1e18
                   )
                 }}
               </td>
@@ -599,8 +614,7 @@ function mapAmount(events: readonly Event[]) {
                 <Icon v-else icon="mdi-multiply" class="text-error text-lg" />
               </td>
               <td class="py-3">
-                {{ format.toLocaleDate(v.timestamp) }}
-                <span class="text-xs"
+                <span v-if="v.timestamp" class="text-xs"
                   >({{ format.toDay(v.timestamp, 'from') }})</span
                 >
               </td>
@@ -659,8 +673,7 @@ function mapAmount(events: readonly Event[]) {
                 <Icon v-else icon="mdi-multiply" class="text-error text-lg" />
               </td>
               <td class="py-3">
-                {{ format.toLocaleDate(v.timestamp) }}
-                <span class="text-xs"
+                <span v-if="v.timestamp" class="text-xs"
                   >({{ format.toDay(v.timestamp, 'from') }})</span
                 >
               </td>
diff --git a/src/stores/useFormatter.ts b/src/stores/useFormatter.ts
index dd7a1b87..8acaa30f 100644
--- a/src/stores/useFormatter.ts
+++ b/src/stores/useFormatter.ts
@@ -115,9 +115,11 @@ export const useFormatter = defineStore('formatter', {
     showChanges(v?: number) {
       return v !== 0 ? numeral(v).format('+0,0.[00]') : '';
     },
-    tokenValue(token?: Coin) {
+    tokenValue(token?: Coin, decimal?: number) {
       if (token) {
-        return numeral(this.tokenValueNumber(token)).format('0,0.[00]');
+        return numeral(this.tokenValueNumber(token, decimal)).format(
+          '0,0.[00]'
+        );
       }
       return '';
     },
@@ -132,7 +134,7 @@ export const useFormatter = defineStore('formatter', {
       }
       return 0;
     },
-    tokenValueNumber(token?: Coin) {
+    tokenValueNumber(token?: Coin, decimal?: number) {
       if (!token || !token.denom) return 0;
       // find the symbol,
       const symbol =
@@ -144,6 +146,7 @@ export const useFormatter = defineStore('formatter', {
       // cacualte amount of symbol
       const amount = Number(token.amount) / 10 ** exponent;
       const value = amount * this.price(token.denom);
+      if (decimal) return value / decimal;
       return value;
     },
     formatTokenAmount(