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.
59 lines
1.7 KiB
59 lines
1.7 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 cursor-pointer"
|
|
v-for="(item, index) in sequence"
|
|
:key="index"
|
|
>
|
|
<div v-if="isTooltips.includes(sequence[index])">
|
|
<el-tooltip effect="dark" :content="tooltipsData[item]" placement="top">
|
|
<span
|
|
:class="[item === 'time' ? 'text-gray-7D7D7E' : 'text-white']"
|
|
class="text-white text-[14px] font-medium"
|
|
>{{ (values && values[item]) || '-' }}
|
|
</span>
|
|
</el-tooltip>
|
|
</div>
|
|
<div v-else>
|
|
<span
|
|
:v-if="!isTooltips.includes(sequence[index])"
|
|
:class="[item === 'time' ? 'text-gray-7D7D7E' : 'text-white']"
|
|
class="text-white text-[14px] font-medium"
|
|
>{{ values?.[item] }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-show="!last"
|
|
class="mx-[34px]"
|
|
style="border-bottom: 1px solid #3b3b3c"
|
|
/>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { defineProps, ref, watchEffect } from 'vue'
|
|
import type { PropType } from 'vue'
|
|
import TableTypes from '../table'
|
|
const props = defineProps({
|
|
sequence: Array as any,
|
|
values: Object as PropType<TableTypes.tRow['values']>,
|
|
last: Boolean,
|
|
})
|
|
// 需要加上tooltip的数据
|
|
const isTooltips = ['txnHash', 'from', 'to']
|
|
const tooltipsData = ref()
|
|
|
|
watchEffect(() => {
|
|
tooltipsData.value = {
|
|
txnHash: props.values?.txnHashTooltip,
|
|
from: props.values?.fromTooltip,
|
|
to: props.values?.toTooltip,
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped></style>
|
|
|