brunoandClaude
2908ccaf1c
🎨 设计升级 - 从康养温柔风格升级为科技医疗专业风格 - 新配色方案：浅灰 #F5F7FB + 天蓝 #2A8DFE + 绿色 #1CC9A0 - 精确高度控制：120px顶栏 + 520px主区 + 340px底栏 = 980px - 单屏无滚动设计，适配1080p显示器 📊 新增5大医疗组件 1. CompactElderlyList - 超紧凑老人列表（56px/行） - 按风险等级分组显示 - 实时体征数据展示 - ElderlyRow子组件实现单行信息密度最大化 2. TrendMonitorCenter - 健康趋势监控中心 - 多维度数据图表（健康评分/血氧/睡眠） - 异常事件时间轴 - 健康阈值标线（80分健康线/60分关注线） 3. AIDecisionCenter - AI决策中心 - 按优先级排序的决策卡片（高/中/低） - AI置信度可视化 - 7日全院健康趋势小图 - 高危事件快速处理按钮 4. CompactFloorHeatmap - 楼层分布热力图 - 6列网格房间布局 - 按楼层分页显示 - 颜色编码风险等级 - 空房/入住状态一目了然 5. VitalStatsGrid - 体征统计网格 - 2x2网格展示平均值（心率/血氧/体温/睡眠） - 昨日对比数据 - 设备在线率统计 - 电量三级分类（充足/需充电/不足） 🛠️ 配置更新 - tailwind.config.js: 新增medical-*颜色系统，保留healing-*兼容旧组件 - style.css: 全面医疗风格化，新增.card-medical等工具类 - router/index.js: DashboardV2设为默认路由，旧版迁移至/v1 ✨ 用户体验优化 - 信息密度大幅提升，更符合专业医疗场景 - 温柔过渡动画保持界面流畅性 - 数字等宽字体优化可读性 - 响应式hover效果增强交互反馈 🌿 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
53 lines
1.6 KiB
JavaScript
53 lines
1.6 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: [
|
|
"./index.html",
|
|
"./src/**/*.{vue,js,ts,jsx,tsx}",
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
// 科技医疗风配色（新）
|
|
'medical-bg': '#F5F7FB',
|
|
'medical-card': '#FFFFFF',
|
|
'medical-card-soft': '#F0F5FA',
|
|
'medical-primary': '#2A8DFE',
|
|
'medical-secondary': '#1CC9A0',
|
|
'medical-warning': '#FFB74D',
|
|
'medical-danger': '#FF5A5A',
|
|
'medical-muted': '#9AA5B5',
|
|
'medical-border': '#E1E7F0',
|
|
'medical-text': '#1E293B',
|
|
'medical-text-sub': '#64748B',
|
|
// 康养风配色（兼容旧组件）
|
|
'healing-primary': '#80C4A8',
|
|
'healing-green': '#6EC28C',
|
|
'healing-blue': '#7AB6E9',
|
|
'healing-orange': '#FFA45B',
|
|
'healing-red': '#FF6B6B',
|
|
'healing-bg': '#FBFBF5',
|
|
'healing-gray': '#404040',
|
|
'healing-light-gray': '#F5F5F0',
|
|
'healing-card': '#FFFFFF',
|
|
},
|
|
borderRadius: {
|
|
'xl': '1rem',
|
|
'2xl': '1.5rem',
|
|
'3xl': '2rem',
|
|
},
|
|
boxShadow: {
|
|
'soft': '0 2px 12px rgba(0, 0, 0, 0.06)',
|
|
'soft-lg': '0 4px 20px rgba(0, 0, 0, 0.08)',
|
|
'glow-green': '0 0 20px rgba(110, 194, 140, 0.3)',
|
|
'glow-orange': '0 0 20px rgba(255, 164, 91, 0.3)',
|
|
'glow-red': '0 0 20px rgba(255, 107, 107, 0.3)',
|
|
},
|
|
animation: {
|
|
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
|
|
'bounce-slow': 'bounce 2s infinite',
|
|
}
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|