feat: tab pill

This commit is contained in:
alisa
2023-04-27 19:41:06 +08:00
parent bc66c57eba
commit be885dde89
3 changed files with 35 additions and 36 deletions
+25 -26
View File
@@ -1,36 +1,35 @@
<script lang="ts" setup>
import { useGovStore } from '@/stores';
import ProposalListItem from '@/components/ProposalListItem.vue';
import { ref, onMounted } from 'vue'
const tab = ref("")
const store = useGovStore()
onMounted(()=>{
store.fetchProposals('2')
})
import { ref, onMounted } from 'vue';
const tab = ref('');
const store = useGovStore();
onMounted(() => {
store.fetchProposals('2');
});
</script>
<template>
<div>
<VTabs v-model="tab">
<VTab value="2">Voting</VTab>
<VTab value="3" @click="store.fetchProposals('3')">Passed</VTab>
<VTab value="4" @click="store.fetchProposals('4')">Rejected</VTab>
</VTabs>
<VWindow v-model="tab" class="mt-5">
<VWindowItem value="2">
<ProposalListItem :proposals="store?.proposals['2']"/>
</VWindowItem>
<div>
<VTabs v-model="tab" class="v-tabs-pill">
<VTab value="2">Voting</VTab>
<VTab value="3" @click="store.fetchProposals('3')">Passed</VTab>
<VTab value="4" @click="store.fetchProposals('4')">Rejected</VTab>
</VTabs>
<VWindow v-model="tab" class="mt-5">
<VWindowItem value="2">
<ProposalListItem :proposals="store?.proposals['2']" />
</VWindowItem>
<VWindowItem value="3">
<ProposalListItem :proposals="store?.proposals['3']"/>
</VWindowItem>
<VWindowItem value="3">
<ProposalListItem :proposals="store?.proposals['3']" />
</VWindowItem>
<VWindowItem value="4">
<ProposalListItem :proposals="store?.proposals['4']"/>
</VWindowItem>
</VWindow>
</div>
<VWindowItem value="4">
<ProposalListItem :proposals="store?.proposals['4']" />
</VWindowItem>
</VWindow>
</div>
</template>
<route>
{
@@ -38,4 +37,4 @@ onMounted(()=>{
i18n: 'governance'
}
}
</route>
</route>