| | |
| | | <template> |
| | | <el-scrollbar> |
| | | <div |
| | | class="bedside-auxiliary-screen-card" |
| | | :style="{ |
| | | '--bg-color': props.backgroundColor, |
| | | }" |
| | | > |
| | | <div class="card-header"> |
| | | <img :src="props.icon" class="card-icon" alt="" srcset="" /> |
| | | <span class="card-title">{{ props.title }}</span> |
| | | </div> |
| | | <div class="card-main"> |
| | | <el-scrollbar class="card-main"> |
| | | <slot /> |
| | | </el-scrollbar> |
| | | </div> |
| | | <div |
| | | class="bedside-auxiliary-screen-card" |
| | | :style="{ |
| | | '--bg-color': props.backgroundColor, |
| | | }" |
| | | > |
| | | <div class="card-header" :class="props.headerClassName"> |
| | | <img :src="props.icon" class="card-icon" alt="" srcset="" /> |
| | | <span class="card-title">{{ props.title }}</span> |
| | | </div> |
| | | </el-scrollbar> |
| | | <div class="card-main"> |
| | | <slot /> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts" setup name="Card"> |
| | |
| | | title: string; // 标题 |
| | | icon: string; |
| | | height?: number; |
| | | headerClassName?: string; // 头部类名 |
| | | } |
| | | const props = defineProps<Props>(); |
| | | </script> |