feat: Parameters Application Version and Node Information

src/components/CardParameter.vue

@@ -21,8 +21,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">{{ item?.value }}</div>
-        <!-- {{ item }} -->
+        <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>
     </div>
   </div>

src/components/dynamic/ArrayObjectElement.vue

@@ -3,7 +3,7 @@ import { computed } from '@vue/reactivity';
 import DynamicComponent from './DynamicComponent.vue';
 
 const props = defineProps({
-  value: { type: Array<Object>},
+  value: { type: null as any },
   thead: {
     type: Boolean,
     default: true
@@ -22,13 +22,17 @@ const header = computed(() => {
   <VTable v-if="header.length > 0" density="compact" height="300px" fixed-header hover>
     <thead v-if="thead">
       <tr>
-        <th v-for="k in header" class="text-left text-capitalize">{{ k }}</th>
+        <th v-for="(item, index) in header" :key="index" class="text-left text-capitalize">{{ item }}</th>
       </tr>
     </thead>
     <tbody>
-      <tr v-for="v in props.value">
-        <td v-for="k in header"> <DynamicComponent :value="v[k]" /></td>
+      <tr v-for="(item, index) in value" :key="index">
+        <td v-for="(el, key) in header" :key="key"> <DynamicComponent :value="item[el]" /></td>
       </tr>
     </tbody>
   </VTable>
+
+  <div v-else class="h-[300px]">
+
+  </div>
 </template>

src/modules/[chain]/params/index.vue

@@ -2,9 +2,7 @@
 import { useParamStore } from '@/stores';
 import { ref, onMounted } from 'vue'
 import CardParameter from '@/components/CardParameter.vue'
-import TableParameter from '@/components/TableParameter.vue'
 import ArrayObjectElement from '@/components/dynamic/ArrayObjectElement.vue';
-import { sort } from 'semver';
 const store = useParamStore()
 const chain = ref(store.chain)
 onMounted(() => {
@@ -48,7 +46,7 @@ onMounted(() => {
         </div>
         
         <!-- Node Information -->
-        <div class="bg-card px-4 pt-3 pb-4 rounded-sm mt-6">
+        <div class="bg-card px-4 pt-3 pb-4ß rounded-sm mt-6">
             <div class="text-base mb-3 text-main">{{ store.nodeVersion?.title }}</div>
             <ArrayObjectElement :value="store.nodeVersion?.items" :thead="false"/>
         </div>

src/stores/useParamsStore.ts

@@ -143,7 +143,7 @@ export const useParamStore = defineStore("paramstore", {
                 value: value }))
             this.nodeVersion.items = Object.entries(res.default_node_info).map(([key, value]) => ({ subtitle:key,
                 value: value }))
-            console.log('handleAbciInfo', res)
+            console.log('handleAbciInfo', this.nodeVersion.items)
         },
         async getBaseTendermintBlockLatest() {
             return await this.blockchain.rpc.getBaseBlockLatest()

yarn.lock

@@ -7365,7 +7365,7 @@ symbol-observable@^2.0.3:
 
 tailwindcss@^3.3.1:
   version "3.3.1"
-  resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-3.3.1.tgz#b6662fab6a9b704779e48d083a9fef5a81d2b81e"
+  resolved "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.1.tgz#b6662fab6a9b704779e48d083a9fef5a81d2b81e"
   integrity sha512-Vkiouc41d4CEq0ujXl6oiGFQ7bA3WEhUZdTgXAhtKxSy49OmKs8rEfQmupsfF0IGW8fv2iQkp1EVUuapCFrZ9g==
   dependencies:
     arg "^5.0.2"