From c8ce479f43820be206b1363799ea074a1c7bdd14 Mon Sep 17 00:00:00 2001
From: zhangchen <1652267879@qq.com>
Date: 星期二, 08 七月 2025 13:28:29 +0800
Subject: [PATCH] ID1825-暂存
---
src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue | 46 +++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 41 insertions(+), 5 deletions(-)
diff --git a/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue b/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
index e661e2f..a70ca62 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
@@ -1,17 +1,53 @@
<template>
- <div class="bedside-auxiliary-screen-card"></div>
+ <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">
+
+ </div>
+ </div>
</template>
<script lang="ts" setup name="Card">
interface Props {
- backgrondColor: string; // 背景颜色
- title: string; // 标题
-
+ backgroundColor: string; // 背景颜色
+ title: string; // 标题
+ icon: string;
}
+const props = defineProps<Props>();
</script>
<style lang="less" scoped>
.bedside-auxiliary-screen-card {
-
+ padding: 3px 4px;
+ border-radius: 2px;
+ background-color: var(--bg-color, #70a3dd);
+ .card-header {
+ display: flex;
+ align-items: center;
+ margin-bottom: 2px;
+ .card-icon {
+ width: 6px;
+ height: 6px;
+ margin-right: 2px;
+ }
+ .card-title {
+ flex: 1;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 500;
+ font-size: 4px;
+ color: #333333;
+ text-align: left;
+ font-style: normal;
+ white-space: nowrap; // 不换行
+ overflow: hidden; // 隐藏超出部分
+ text-overflow: ellipsis; // 显示省略号
+ }
+ }
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0