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.
46 lines
1.3 KiB
46 lines
1.3 KiB
<template>
|
|
<div
|
|
class="flex flex-1 flex-col justify-between items-center py-[20px] border-b border-b-black-3B3B3C"
|
|
>
|
|
<div class="flex flex-1 w-full">
|
|
<div class="flex flex-1 flex-row w-full items-center justify-between">
|
|
<p class="text-white text-[16px] font-medium">{{ title }}</p>
|
|
<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>
|
|
</div>
|
|
<p class="text-gray-BBB text-[14px] font-normal mt-[12px] break-all">
|
|
{{ value1 }}
|
|
</p>
|
|
<div
|
|
class="text-gray-BBB text-[14px] font-normal flex flex-1 w-full flex-col mt-[12px]"
|
|
>
|
|
<p class="break-all">{{ value2 }}</p>
|
|
<Icons url="chevron_right" :size="16" />
|
|
<p class="break-all">{{ value3 }}</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Icons from '@src/components/icons/index.vue'
|
|
defineProps({
|
|
title: String,
|
|
value1: String,
|
|
value2: String,
|
|
value3: String,
|
|
state: String,
|
|
})
|
|
</script>
|
|
|
|
<style scoped></style>
|
|
|