<template>
    <div class="card-container">
        <!--  生成中  -->
        <template v-if="status === 1 || status === 0">
            <InProgress></InProgress>
        </template>
        <!--  成功  -->
        <template v-if="status === 3">
            <Success :value="value"></Success>
        </template>
        <!--  失败  -->
        <template v-if="status === 2">
            <Fail :value="value"></Fail>
        </template>
    </div>
</template>

<script lang="ts" setup>
import InProgress from './in-progress.vue'
import Success from './success.vue'
import Fail from './fail.vue'

const props = withDefaults(
    defineProps<{
        value?: any
        status: number
    }>(),
    {
        value: '',
        status: 0
    }
)
</script>

<style>
.card-container {
    margin-top: 30rpx;
    width: 100%;
    min-height: 780rpx;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 3px 10px #ebeefd;
}
</style>

