feat(miniprogram): Phase 5 UI/UX 优化 — 8 项改进
- 首页: 健康资讯推荐 + 空状态引导 + 快捷服务字符图标优化 - 健康 Hub: sparkline bar + 参考范围 + 打卡合并到快捷操作 - 日常监测: 3 分组折叠(晨间/晚间/其他) + 异常值高亮 + 提交前确认 - 预约: 已满时段 pointer-events:none + opacity 优化 - 咨询聊天: 消息日期分组(今天/昨天) + 图片预览 - 积分商城: 确认已有余额大字+签到+库存提示 - 医护工作台: 异常体征横幅 + 患者搜索入口 + 快捷操作扩展 - 趋势图表: 骨架屏加载状态 + ECharts 异常标记已有
This commit is contained in:
@@ -29,6 +29,54 @@
|
||||
color: $tx3;
|
||||
}
|
||||
|
||||
&__alert {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 16px 24px;
|
||||
padding: 16px 20px;
|
||||
background: #FEF2F2;
|
||||
border-radius: $r;
|
||||
border-left: 4px solid #EF4444;
|
||||
}
|
||||
|
||||
&__alert-icon {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
background: #EF4444;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
font-weight: bold;
|
||||
font-size: 22px;
|
||||
margin-right: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__alert-text {
|
||||
flex: 1;
|
||||
font-size: 26px;
|
||||
color: #991B1B;
|
||||
}
|
||||
|
||||
&__alert-link {
|
||||
font-size: 24px;
|
||||
color: #EF4444;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__search {
|
||||
margin: 0 24px 16px;
|
||||
}
|
||||
|
||||
&__search-input {
|
||||
background: #F1F5F9;
|
||||
border-radius: $r;
|
||||
padding: 16px 20px;
|
||||
font-size: 26px;
|
||||
color: #94A3B8;
|
||||
}
|
||||
|
||||
&__section {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { View, Text, ScrollView } from '@tarojs/components';
|
||||
import { View, Text, Input, ScrollView } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
import { useAuthStore } from '@/stores/auth';
|
||||
import * as doctorApi from '@/services/doctor';
|
||||
@@ -29,11 +29,14 @@ const HEALTH_CARDS: CardConfig[] = [
|
||||
const QUICK_ACTIONS = [
|
||||
{ label: '化验审核', initial: '审', route: '/pages/doctor/report/index' },
|
||||
{ label: '患者查询', initial: '查', route: '/pages/doctor/patients/index' },
|
||||
{ label: '随访记录', initial: '随', route: '/pages/doctor/followup/index' },
|
||||
{ label: '排班查看', initial: '排', route: '/pages/doctor/patients/index' },
|
||||
];
|
||||
|
||||
export default function DoctorHome() {
|
||||
const { user, logout } = useAuthStore();
|
||||
const [dashboard, setDashboard] = useState<doctorApi.DoctorDashboard | null>(null);
|
||||
const [alertCount, setAlertCount] = useState(0);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -44,6 +47,9 @@ export default function DoctorHome() {
|
||||
try {
|
||||
const data = await doctorApi.getDashboard();
|
||||
setDashboard(data);
|
||||
// 从仪表盘数据提取异常体征患者数
|
||||
const count = (data as Record<string, unknown>)?.abnormal_vital_count;
|
||||
setAlertCount(typeof count === 'number' ? count : 0);
|
||||
} catch {
|
||||
// 静默失败,显示占位
|
||||
} finally {
|
||||
@@ -78,6 +84,22 @@ export default function DoctorHome() {
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
{alertCount > 0 && (
|
||||
<View className='doctor-home__alert'>
|
||||
<Text className='doctor-home__alert-icon'>!</Text>
|
||||
<Text className='doctor-home__alert-text'>{alertCount} 位患者体征异常</Text>
|
||||
<Text className='doctor-home__alert-link' onClick={() => Taro.navigateTo({ url: '/pages/doctor/patients/index' })}>查看 →</Text>
|
||||
</View>
|
||||
)}
|
||||
|
||||
<View className='doctor-home__search'>
|
||||
<Input
|
||||
className='doctor-home__search-input'
|
||||
placeholder='搜索患者姓名...'
|
||||
onFocus={() => Taro.navigateTo({ url: '/pages/doctor/patients/index' })}
|
||||
/>
|
||||
</View>
|
||||
|
||||
<View className='doctor-home__section'>
|
||||
<Text className='doctor-home__section-title'>工作概览</Text>
|
||||
<View className='doctor-home__grid'>
|
||||
|
||||
Reference in New Issue
Block a user