feat: format code

2023-04-25 21:57:52 +08:00
parent b8b5602194
commit 9fa425df53
7 changed files with 286 additions and 187 deletions
@@ -1,73 +1,86 @@
 <script lang="ts" setup>
-import { useBlockModule } from './block'
+import { useBlockModule } from './block';
 import { computed, ref } from '@vue/reactivity';
 import { useFormatter } from '@/stores';
-const props = defineProps(["height", "chain"]);
+const props = defineProps(['height', 'chain']);

-const store = useBlockModule()
+const store = useBlockModule();
 // store.fetchBlock(props.height)
-const tab = ref('blocks')
+const tab = ref('blocks');

-const format = useFormatter()
+const format = useFormatter();
 </script>
 <template>
-    
-    <VCard>
-        <VCardTitle class="d-flex justify-space-between">
-            <VTabs v-model="tab">
-                <VTab value="blocks">Blocks</VTab>
-                <VTab value="transactions">Transactions</VTab>
-            </VTabs>
-        </VCardTitle>
-        <VWindow v-model="tab">
-            <VWindowItem value="blocks">
-                <VTable>
-                    <thead>
-                        <tr>
-                            <th>Height</th><th>Hash</th><th>Proposer</th><th>Txs</th><th>Time</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr v-for="item in store.recents">
-                            <td class="text-sm text-primary"><RouterLink :to="`/${props.chain}/block/${item.block?.header?.height}`">{{ item.block?.header?.height }}</RouterLink></td>
-                            <td>{{ item.block_id?.hash }}</td>
-                            <td>{{ format.validator(item.block?.header?.proposer_address) }}</td>
-                            <td>{{ item.block?.data?.txs.length }}</td>
-                            <td>{{ format.toDay(item.block?.header?.time, 'from') }}</td>
-                        </tr>
-                    </tbody>
-                </VTable>
-            </VWindowItem>
-            <VWindowItem value="transactions">
-                <VTable>
-                    <thead>
-                        <tr>
-                            <th>Hash</th><th>Messages</th><th>Fees</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr v-for="item in store.txsInRecents">
-                            <td><RouterLink :to="`/${props.chain}/tx/${item.hash}`">{{ item.hash }}</RouterLink></td>
-                            <td>{{ format.messages(item.tx.body.messages) }}</td>
-                            <td>{{ format.formatTokens(item.tx.authInfo.fee?.amount) }}</td>
-                        </tr>
-                    </tbody>
-                </VTable>
+  <VCard>
+    <VCardTitle class="d-flex justify-space-between">
+      <VTabs v-model="tab">
+        <VTab value="blocks">Blocks</VTab>
+        <VTab value="transactions">Transactions</VTab>
+      </VTabs>
+    </VCardTitle>
+    <VWindow v-model="tab">
+      <VWindowItem value="blocks">
+        <VTable>
+          <thead>
+            <tr>
+              <th>Height</th>
+              <th>Hash</th>
+              <th>Proposer</th>
+              <th>Txs</th>
+              <th>Time</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="item in store.recents">
+              <td class="text-sm text-primary">
+                <RouterLink
+                  :to="`/${props.chain}/block/${item.block?.header?.height}`"
+                  >{{ item.block?.header?.height }}</RouterLink
+                >
+              </td>
+              <td>{{ item.block_id?.hash }}</td>
+              <td>
+                {{ format.validator(item.block?.header?.proposer_address) }}
+              </td>
+              <td>{{ item.block?.data?.txs.length }}</td>
+              <td>{{ format.toDay(item.block?.header?.time, 'from') }}</td>
+            </tr>
+          </tbody>
+        </VTable>
+      </VWindowItem>
+      <VWindowItem value="transactions">
+        <VTable>
+          <thead>
+            <tr>
+              <th>Hash</th>
+              <th>Messages</th>
+              <th>Fees</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="item in store.txsInRecents">
+              <td>
+                <RouterLink :to="`/${props.chain}/tx/${item.hash}`">{{
+                  item.hash
+                }}</RouterLink>
+              </td>
+              <td>{{ format.messages(item.tx.body.messages) }}</td>
+              <td>{{ format.formatTokens(item.tx.authInfo.fee?.amount) }}</td>
+            </tr>
+          </tbody>
+        </VTable>

-                <VCardItem>
-                    <v-alert
-                        type="info"
-                        text="Only show txs in recent blocks"
-                        variant="tonal"
-                    ></v-alert>
-                </VCardItem>
-            </VWindowItem>
-        </VWindow>
-        <VCardActions>
-
-        </VCardActions>
-    </VCard>
- 
+        <VCardItem>
+          <v-alert
+            type="info"
+            text="Only show txs in recent blocks"
+            variant="tonal"
+          ></v-alert>
+        </VCardItem>
+      </VWindowItem>
+    </VWindow>
+    <VCardActions> </VCardActions>
+  </VCard>
 </template>

 <route>
@@ -76,4 +89,4 @@ const format = useFormatter()
        i18n: 'blocks'
      }
    }
-  </route>
+  </route>