You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.6 KiB
63 lines
1.6 KiB
<template>
|
|
<div
|
|
class="flex flex-1 flex-row justify-between items-center py-[16px] pl-[18px] border-b border-b-black-3B3B3C"
|
|
>
|
|
<div>
|
|
<p class="text-white text-[16px] font-medium">{{ title }}</p>
|
|
<p
|
|
class="text-gray-BBB text-[14px] font-normal mt-[12px] cursor-pointer"
|
|
@click="handleRouter(`/tx/${value1}`)"
|
|
>
|
|
{{ value1 }}
|
|
</p>
|
|
<div
|
|
class="text-gray-BBB text-[14px] font-normal flex flex-row items-center mt-[12px]"
|
|
>
|
|
<p
|
|
class="mr-[10px] cursor-pointer"
|
|
@click="handleRouter(`/tokens/${value2}`)"
|
|
>
|
|
{{ value2 }}
|
|
</p>
|
|
<Icons url="chevron_right" :size="16" />
|
|
<p
|
|
class="ml-[10px] cursor-pointer"
|
|
@click="handleRouter(`/tokens/${value3}`)"
|
|
>
|
|
{{ value3 }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="flex flex-row items-center w-[87px] rounded-[4px] px-[12px] py-[4px] bg-green-2EAA7D"
|
|
:class="state === 'Success' ? 'bg-green-2EAA7D' : 'bg-red-C4403E'"
|
|
>
|
|
<Icons
|
|
:url="state === 'Success' ? 'check_circle' : 'cancel'"
|
|
:size="12"
|
|
/>
|
|
<p class="text-[12px] font-normal align-middle text-white ml-[2px]">
|
|
{{ state }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Icons from '@src/components/icons/index.vue'
|
|
import { useRouter } from 'vue-router'
|
|
defineProps({
|
|
title: [String, Number],
|
|
value1: String,
|
|
value2: String,
|
|
value3: String,
|
|
state: String,
|
|
route: Function,
|
|
})
|
|
const router = useRouter()
|
|
const handleRouter = (route: string) => {
|
|
router.replace(route)
|
|
}
|
|
</script>
|
|
|
|
<style scoped></style>
|
|
|