feat: account vchip ui refactor

This commit is contained in:
Alisa | Side.one 2023-05-12 21:26:36 +08:00
parent d984bac2d4
commit 53481bad37
2 changed files with 34 additions and 15 deletions

View File

@ -130,9 +130,12 @@ loadAccount(props.address);
${{ 0 }} ${{ 0 }}
</VListItemSubtitle> </VListItemSubtitle>
<template #append> <template #append>
<VChip color="primary">{{ <div class="text-xs truncate relative py-2 px-4 rounded-full w-fit text-primary mr-2">
format.calculatePercent(v.amount, totalAmount) <span class="inset-x-0 inset-y-0 opacity-10 absolute bg-primary"></span>
}}</VChip> {{
format.calculatePercent(v.amount, totalAmount)
}}
</div>
</template> </template>
</VListItem> </VListItem>
<VListItem v-for="v in delegations"> <VListItem v-for="v in delegations">
@ -149,9 +152,12 @@ loadAccount(props.address);
${{ 0 }} ${{ 0 }}
</VListItemSubtitle> </VListItemSubtitle>
<template #append> <template #append>
<VChip color="primary">{{ <div class="text-xs truncate relative py-2 px-4 rounded-full w-fit text-primary mr-2">
format.calculatePercent(v.balance.amount, totalAmount) <span class="inset-x-0 inset-y-0 opacity-10 absolute bg-primary"></span>
}}</VChip> {{
format.calculatePercent(v.balance.amount, totalAmount)
}}
</div>
</template> </template>
</VListItem> </VListItem>
<VListItem v-for="v in rewards.total"> <VListItem v-for="v in rewards.total">
@ -168,9 +174,12 @@ loadAccount(props.address);
${{ 0 }} ${{ 0 }}
</VListItemSubtitle> </VListItemSubtitle>
<template #append> <template #append>
<VChip color="primary">{{ <div class="text-xs truncate relative py-2 px-4 rounded-full w-fit text-primary mr-2">
format.calculatePercent(v.amount, totalAmount) <span class="inset-x-0 inset-y-0 opacity-10 absolute bg-primary"></span>
}}</VChip> {{
format.calculatePercent(v.amount, totalAmount)
}}
</div>
</template> </template>
</VListItem> </VListItem>
@ -193,9 +202,12 @@ loadAccount(props.address);
${{ 0 }} ${{ 0 }}
</VListItemSubtitle> </VListItemSubtitle>
<template #append> <template #append>
<VChip color="primary">{{ <div class="text-xs truncate relative py-2 px-4 rounded-full w-fit text-primary mr-2">
format.calculatePercent(unbondingTotal, totalAmount) <span class="inset-x-0 inset-y-0 opacity-10 absolute bg-primary"></span>
}}</VChip> {{
format.calculatePercent(unbondingTotal, totalAmount)
}}
</div>
</template> </template>
</VListItem> </VListItem>
</VList> </VList>

View File

@ -49,10 +49,17 @@ const messages = computed(() => {
<tr> <tr>
<td>Status</td> <td>Status</td>
<td> <td>
<VChip v-if="tx.tx_response.code === 0" color="success" <VChip color="primary">oioio</VChip>
>Success</VChip <div
class="text-xs truncate relative py-2 px-4 rounded-full w-fit mr-2"
:class="`text-${tx.tx_response.code === 0 ? 'success': 'error'}`"
> >
<span v-else><VChip color="error">Failded</VChip></span> <span
class="inset-x-0 inset-y-0 opacity-10 absolute"
:class="`bg-${tx.tx_response.code === 0 ? 'success': 'error'}`"
></span>
{{ tx.tx_response.code === 0 ? 'Success': 'Failded' }}
</div>
</td> </td>
</tr> </tr>
<tr> <tr>