Files
web/src/components/TokenRow.vue
2023-11-01 00:33:53 -04:00

46 lines
1.3 KiB
Vue

<template>
<tr>
<td>
<v-avatar v-if="imageSrc" :image="imageSrc"/>
</td>
<td class="d-none d-sm-table-cell">{{ token.name || '' }}</td>
<td class="text-right">{{ fixed }}</td>
<td class="text-left">{{ token.symbol }}</td>
<!-- todo price and value columns -->
<td>
<v-menu>
<template v-slot:activator="{ props }">
<v-btn variant="plain" v-bind="props" icon="mdi-menu"/> <!-- mdi-dots-vertical -->
</template>
<v-list>
<v-list-subheader :title="token.symbol"/>
<v-list-item title="Withdraw" key="withdraw" value="withdraw" prepend-icon="mdi-arrow-down-bold"
@click="()=>onWithdraw(token.address)"/>
</v-list>
</v-menu>
</td>
</tr>
</template>
<script setup>
import {useStore} from "@/store/store";
import {getToken} from "@/blockchain/token.js";
import {FixedNumber} from "ethers";
import {computed, ref} from "vue";
const s = useStore()
const props = defineProps(['addr', 'amount', 'onWithdraw'])
const token = await getToken(props.addr)
const fixed = computed(() => FixedNumber.fromValue(props.amount, token.decimals, {
width: 256,
decimals: token.decimals
}))
const imageSrc = computed(() => null)
const withdrawing = ref(false)
</script>
<style scoped lang="scss">
@use "src/styles/vars" as *;
</style>