<template>
    <view class="flex flex-col bg-white rounded-[16rpx] mb-[20rpx]">
        <view
            class="flex justify-between px-[24rpx] py-[12rpx] border-b border-solid border-[#F3F3F3]"
        >
            <slot name="title" />
        </view>
        <view class="px-[24rpx] py-[16rpx] flex flex-col gap-[16rpx]">
            <slot name="content" />
        </view>
        <slot name="action" v-if="isSlotAction" />
    </view>
</template>

<script setup lang="ts">
import { computed } from 'vue'
import { useSlots } from 'vue'

defineProps({
    cardInfo: {
        type: Object,
        default: () => ({})
    }
})
const slots = useSlots()
const isSlotAction = computed(() => slots.action)
</script>
<style scoped></style>
