From 4c2f3f0f8d01764435075344408385454bc1cfd6 Mon Sep 17 00:00:00 2001
From: alisa <alisa@side.one>
Date: Fri, 28 Apr 2023 22:00:15 +0800
Subject: [PATCH] fix: number to percent

---
 src/components/CardParameter.vue     | 19 ++++++++++++++++++-
 src/modules/[chain]/params/index.vue |  4 ----
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/components/CardParameter.vue b/src/components/CardParameter.vue
index 97bc1907..a301393a 100644
--- a/src/components/CardParameter.vue
+++ b/src/components/CardParameter.vue
@@ -1,10 +1,27 @@
 <script lang="ts" setup>
 import type { PropType } from 'vue';
+import { useFormatter } from "@/stores";
 const props = defineProps({
   cardItem: {
     type: Object as PropType<{ title: string; items: Array<any> }>,
   },
 });
+
+const formatter = useFormatter()
+function calculateValue(value: any){
+  if (Array.isArray(value) ){
+    return (value[0] && value[0].amount)|| '-'
+  }
+  const newValue =  Number(value)
+  if(`${newValue}` === 'NaN' || typeof(value) === 'boolean'){
+    return value
+  }
+  
+  if (newValue < 1 && newValue > 0) {
+    return formatter.formatDecimalToPercent(value)
+  }
+  return newValue
+}
 </script>
 <template>
   <div
@@ -21,7 +38,7 @@ const props = defineProps({
         class="rounded-sm bg-active px-4 py-2"
       >
         <div class="text-xs mb-2 text-secondary">{{ item?.subtitle }}</div>
-        <div class="text-base text-main">{{ Array.isArray(item?.value) ? (item?.value[0] && item?.value[0].amount)|| '-':`${Number(item?.value)}` === 'NaN' ? item?.value : Number(item?.value)}}</div>
+        <div class="text-base text-main">{{ calculateValue(item?.value) }}</div>
       </div>
     </div>
   </div>
diff --git a/src/modules/[chain]/params/index.vue b/src/modules/[chain]/params/index.vue
index 42f9c33f..51e49eef 100644
--- a/src/modules/[chain]/params/index.vue
+++ b/src/modules/[chain]/params/index.vue
@@ -51,10 +51,6 @@ onMounted(() => {
             <ArrayObjectElement :value="store.nodeVersion?.items" :thead="false"/>
         </div>
  
-    <!-- Application Version -->
-    <!-- <TableParameter :tableItem="store.appVersion" /> -->
-    <!-- Node Information -->
-    <!-- <TableParameter :tableItem="store.nodeVersion" /> -->
   </div>
 </template>