From d085d0504041e29e82b51a6ade1a183149fc9ffa Mon Sep 17 00:00:00 2001
From: zhangchen <1652267879@qq.com>
Date: 星期二, 09 九月 2025 16:44:55 +0800
Subject: [PATCH] Merge branch 'master' of http://dh.leon056.com:7499/r/data2/Single_application into ID1956-已签到页面改版

---
 src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue |   95 +++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 91 insertions(+), 4 deletions(-)

diff --git a/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue b/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
index e661e2f..f7f3f13 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
@@ -1,17 +1,104 @@
 <template>
-  <div class="bedside-auxiliary-screen-card"></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>
+      <span class="card-right-text" v-if="$slots.right">
+        <slot name="right" />
+      </span>
+    </div>
+    <div class="card-main">
+      <slot />
+    </div>
+  </div>
 </template>
 
 <script lang="ts" setup name="Card">
 interface Props {
-    backgrondColor: string; // 背景颜色
-    title: string; // 标题
-    
+  backgroundColor: string; // 背景颜色
+  title: string; // 标题
+  icon: string;
+  height?: number;
+  headerClassName?: string; // 头部类名
 }
+const props = defineProps<Props>();
 </script>
 
 <style lang="less" scoped>
+* {
+  box-sizing: border-box;
+}
 .bedside-auxiliary-screen-card {
+  display: flex;
+  flex-direction: column;
+  // height: 100%;
+  padding: 3px 4px;
+  border-radius: 2px;
+  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;
+    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;
+    }
+    .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 {
+    flex: 1;
+    overflow: hidden;
+    overflow-y: auto;
+    min-height: 0;
+  }
+  .card-main > * {
+    min-height: 0;
+    overflow: hidden;
+  }
+}
+:deep(.el-scrollbar__view) {
+  min-height: 0;
+  height: 100%;
+  overflow: hidden;
+  overflow-y: auto;
 }
 </style>
\ No newline at end of file

--
Gitblit v1.8.0