46 lines
1.4 KiB
Vue
46 lines
1.4 KiB
Vue
<template>
|
|
<tr>
|
|
<td>
|
|
<v-avatar v-if="imageSrc" :image="imageSrc" size="x-small"/>
|
|
</td>
|
|
<td class="d-none d-sm-table-cell">{{ token?.n || '' }}</td>
|
|
<td class="text-right">{{ fixed }}</td>
|
|
<td class="text-left">{{ token?.s }}</td>
|
|
<!-- todo price and value columns -->
|
|
<td>
|
|
<v-menu>
|
|
<template v-slot:activator="{ props }">
|
|
<v-btn variant="plain" v-bind="props" icon="mdi-dots-vertical"/>
|
|
</template>
|
|
<v-list v-if="token">
|
|
<v-list-subheader :title="token.s"/>
|
|
<v-list-item title="Withdraw" key="withdraw" value="withdraw" prepend-icon="mdi-arrow-down-bold"
|
|
@click="()=>onWithdraw(token)"/>
|
|
</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} from "vue";
|
|
|
|
const s = useStore()
|
|
const props = defineProps(['chainId', 'addr', 'amount', 'onWithdraw'])
|
|
const token = await getToken(props.chainId, props.addr)
|
|
console.log('TokenRow token is', token)
|
|
const fixed = computed(() => token ? FixedNumber.fromValue(props.amount, token.d, {
|
|
width: 256,
|
|
decimals: token.d
|
|
}) : null)
|
|
const imageSrc = computed(() => token ? token.image : null)
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@use "src/styles/vars" as *;
|
|
|
|
</style>
|