data2/Single_application.git

			@@ -1,18 +1,21 @@
			<template>
			<el-scrollbar
			<div
			class="bedside-auxiliary-screen-card"
			:style="{
			'--bg-color': props.backgroundColor,
			}"
			>
			<div class="card-header">
			<div class="card-header" :class="props.headerClassName">
			<img :src="props.icon" class="card-icon" alt="" srcset="" />
			<span class="card-title">{{ props.title }}</span>
			<span class="card-right-text" v-if="$slots.right">
			<slot name="right" />
			</span>
			</div>
			<el-scrollbar class="card-main">
			<div class="card-main">
			<slot />
			</el-scrollbar>
			</el-scrollbar>
			</div>
			</div>
			</template>

			<script lang="ts" setup name="Card">
			@@ -21,6 +24,7 @@
			title: string; // 标题
			icon: string;
			height?: number;
			headerClassName?: string; // 头部类名
			}
			const props = defineProps<Props>();
			</script>
			@@ -38,8 +42,10 @@
			background-color: var(--bg-color, #70a3dd);
			overflow: hidden;
			overflow-y: auto;
			height: 100%;

			.card-header {
			position: relative;
			flex: 0 0 6px;
			display: flex;
			align-items: center;
			@@ -63,6 +69,19 @@
			overflow: hidden;
			text-overflow: ellipsis;
			}
			.card-right-text {
			position: absolute;
			right: 0;
			top: 50%;
			transform: translateY(-50%);
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			font-size: 4px;
			color: #333333;
			line-height: 5px;
			text-align: right;
			font-style: normal;
			}
			}

			.card-main {
			@@ -76,4 +95,10 @@
			overflow: hidden;
			}
			}
			:deep(.el-scrollbar__view) {
			min-height: 0;
			height: 100%;
			overflow: hidden;
			overflow-y: auto;
			}
			</style>