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.
 
 
 
 
 

78 lines
2.0 KiB

<template>
<div
:class="last ? 'rounded-b-[10px]' : ''"
class="flex flex-1 flex-row bg-black-19191A hover:bg-black-272728 items-center py-[24px] px-[34px] cursor-pointer"
>
<div
class="flex flex-1 justify-start"
v-for="(item, index) in sequence"
:key="index"
>
<div
:class="
item === 'smartContract'
? 'bg-gray-303031 px-[12px] py-[4px] rounded-[4px]'
: ''
"
>
<span
v-if="item !== 'result'"
:class="colorSequence[index] || 'text-white'"
class="text-[14px] font-medium"
@click="handleClick(link?.[index])"
>
{{ values[item] }}
</span>
<div
v-else
class="px-[12px] py-[4px] rounded-[4px] w-[87px] flex flex-row items-center"
:class="values.isSuccess ? 'bg-green-2EAA7D' : 'bg-red-C4403E'"
>
<Icons
:url="values.isSuccess ? 'check_circle' : 'cancel'"
:size="12"
/>
<span
:class="colorSequence[index] || 'text-white'"
class="text-[12px] font-medium ml-[2px]"
>{{ values[item] }}
</span>
</div>
</div>
</div>
</div>
<div
v-if="!last"
class="mx-[34px]"
style="border-bottom: 1px solid #3b3b3c"
/>
</template>
<script setup lang="ts">
import type { PropType } from 'vue'
import TableTypes from '../table'
import Icons from '@src/components/icons/index.vue'
import { useRouter } from 'vue-router'
const props = defineProps({
sequence: {
type: Array as PropType<TableTypes.tRow['sequence']>,
required: true,
},
values: {
type: Object as PropType<TableTypes.tRow['values']>,
required: true,
},
colorSequence: {
type: Array as PropType<TableTypes.tRow['colorSequence']>,
required: true,
},
link: Array,
last: Boolean,
})
const router = useRouter()
const handleClick = (route: any) => {
route && router.replace(`/${route}/${props.values.txnContractAddress}`)
}
</script>
<style lang="scss" scoped></style>