feat: add interface request and html dom

This commit is contained in:
alisa
2023-04-26 21:05:20 +08:00
parent b0b7066e10
commit 51f95e187f
2 changed files with 54 additions and 15 deletions
+34 -6
View File
@@ -1,16 +1,44 @@
<script lang="ts" setup>
import { useParamStore } from '@/stores';
import { ref, onMounted } from 'vue'
const store = useParamStore()
const chain = ref(store.chain)
onMounted(() => {
// fetch the data
// store.handleBaseBlockLatest()
store.initial()
console.log(4444)
})
</script>
<template>
<div class="bg-card px-4 pt-3 pb-4 rounded-sm">
<div class="text-base mb-3 text-main">Minting Parameters</div>
<div class="grid grid-cols-5 gap-4">
<div v-for="item in 10" :key="item" class="rounded-sm bg-active px-4 py-2">
<div class="text-xs mb-2 text-secondary">Blocks Per Year</div>
<div class="text-base text-main">4,360,000</div>
<div>
<!-- Chain ID -->
<div class="bg-card px-4 pt-3 pb-4 rounded-sm">
<div class="text-base mb-3 text-main">{{ chain.title }}</div>
<div class="grid grid-cols-5 gap-4">
<div v-for="(item,index) of chain.items" :key="index" 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>
</div>
</div>
<div class="h-6"></div>
<!-- Staking Parameters -->
<div class="bg-card px-4 pt-3 pb-4 rounded-sm">
<div class="text-base mb-3 text-main">{{ store.staking.title }}</div>
<div class="grid grid-cols-5 gap-4">
<div v-for="(item,index) of store.staking.items" :key="index" 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>
</div>
</div>
</div>
</template>
<route>
{