feat: 积分商城子页面 + 日常监测 + 统计报表 (Chunk 6)
小程序 — 积分商城 (3 新页面): - mall/exchange: 兑换确认 (余额校验/QR码生成) - mall/orders: 我的订单 (状态筛选/分页/QR展示) - mall/detail: 积分明细 (余额卡片/收入支出筛选/流水列表) 小程序 — 上报 Tab 改造: - health/daily-monitoring: 日常监测表单 (血压/体重/血糖/出入量) - health/index: 增加快捷操作/打卡状态/近期监测卡片 - consultation: 替换占位为咨询列表 (会话/状态/未读) - profile: 新增积分余额/打卡天数/我的订单/积分明细入口 小程序 — 新增服务: - services/consultation.ts: 咨询会话 API - services/points.ts: 扩展兑换/订单/流水 API - services/health.ts: 扩展日常监测 API PC 管理端: - StatisticsDashboard: 统计报表仪表盘 (患者/咨询/随访/积分卡片 + Top10排行 + 快速链接) - 侧边栏新增统计报表入口 (健康模块首页)
This commit is contained in:
iven
@@ -26,7 +26,24 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.consultation-placeholder {
|
||||
// ---- Loading / Error / Empty ----
|
||||
|
||||
.consultation-loading {
|
||||
padding: 120px 0;
|
||||
}
|
||||
|
||||
.consultation-error {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 120px 40px;
|
||||
}
|
||||
|
||||
.consultation-error-text {
|
||||
font-size: 26px;
|
||||
color: $dan;
|
||||
}
|
||||
|
||||
.consultation-empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@@ -34,20 +51,121 @@
|
||||
padding: 160px 40px;
|
||||
}
|
||||
|
||||
.consultation-placeholder-icon {
|
||||
.consultation-empty-icon {
|
||||
font-size: 100px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.consultation-placeholder-text {
|
||||
.consultation-empty-text {
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
color: $tx;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.consultation-placeholder-hint {
|
||||
.consultation-empty-hint {
|
||||
font-size: 26px;
|
||||
color: $tx3;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
// ---- Session List ----
|
||||
|
||||
.consultation-list {
|
||||
padding: 16px 24px;
|
||||
}
|
||||
|
||||
.consultation-session {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: $card;
|
||||
border-radius: $r;
|
||||
padding: 24px;
|
||||
margin-bottom: 12px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
transition: transform 0.15s;
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
}
|
||||
}
|
||||
|
||||
.session-left {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.session-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.session-subject {
|
||||
font-size: 28px;
|
||||
color: $tx;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.session-status-active {
|
||||
font-size: 22px;
|
||||
color: $acc;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.session-status-pending {
|
||||
font-size: 22px;
|
||||
color: $wrn;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.session-status-closed {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.session-message {
|
||||
font-size: 26px;
|
||||
color: $tx2;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.session-time {
|
||||
font-size: 22px;
|
||||
color: $tx3;
|
||||
display: block;
|
||||
}
|
||||
|
||||
// ---- Unread Badge ----
|
||||
|
||||
.session-badge {
|
||||
background: $dan;
|
||||
border-radius: 999px;
|
||||
min-width: 36px;
|
||||
height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 8px;
|
||||
margin-left: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.session-badge-text {
|
||||
font-size: 22px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -1,12 +1,79 @@
|
||||
import { useState } from 'react';
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import Taro, { useDidShow } from '@tarojs/taro';
|
||||
import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro';
|
||||
import { listConsultations, ConsultationSession } from '@/services/consultation';
|
||||
import Loading from '../../components/Loading';
|
||||
import './index.scss';
|
||||
|
||||
function getStatusLabel(status: string): string {
|
||||
const map: Record<string, string> = {
|
||||
pending: '等待接诊',
|
||||
active: '进行中',
|
||||
closed: '已结束',
|
||||
cancelled: '已取消',
|
||||
};
|
||||
return map[status] || status;
|
||||
}
|
||||
|
||||
function getStatusClass(status: string): string {
|
||||
if (status === 'active') return 'session-status-active';
|
||||
if (status === 'pending') return 'session-status-pending';
|
||||
return 'session-status-closed';
|
||||
}
|
||||
|
||||
function formatTime(iso: string): string {
|
||||
if (!iso) return '';
|
||||
const d = new Date(iso);
|
||||
const now = new Date();
|
||||
const diffMs = now.getTime() - d.getTime();
|
||||
const diffMin = Math.floor(diffMs / 60000);
|
||||
|
||||
if (diffMin < 1) return '刚刚';
|
||||
if (diffMin < 60) return `${diffMin}分钟前`;
|
||||
const diffHour = Math.floor(diffMin / 60);
|
||||
if (diffHour < 24) return `${diffHour}小时前`;
|
||||
const diffDay = Math.floor(diffHour / 24);
|
||||
if (diffDay < 7) return `${diffDay}天前`;
|
||||
|
||||
const m = String(d.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(d.getDate()).padStart(2, '0');
|
||||
return `${m}-${day}`;
|
||||
}
|
||||
|
||||
export default function Consultation() {
|
||||
const [sessions, setSessions] = useState<ConsultationSession[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState('');
|
||||
|
||||
const loadSessions = async () => {
|
||||
setLoading(true);
|
||||
setError('');
|
||||
try {
|
||||
const resp = await listConsultations({ page: 1, page_size: 20 });
|
||||
setSessions(resp.data || []);
|
||||
} catch (e: unknown) {
|
||||
const msg = e instanceof Error ? e.message : '加载失败';
|
||||
setError(msg);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
useDidShow(() => {
|
||||
Taro.setNavigationBarTitle({ title: '在线咨询' });
|
||||
loadSessions();
|
||||
});
|
||||
|
||||
usePullDownRefresh(() => {
|
||||
loadSessions().finally(() => {
|
||||
Taro.stopPullDownRefresh();
|
||||
});
|
||||
});
|
||||
|
||||
const handleTapSession = (_session: ConsultationSession) => {
|
||||
Taro.showToast({ title: '即将上线', icon: 'none' });
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='consultation-page'>
|
||||
<View className='consultation-header'>
|
||||
@@ -14,11 +81,57 @@ export default function Consultation() {
|
||||
<Text className='consultation-header-desc'>随时随地，连接专业医生</Text>
|
||||
</View>
|
||||
|
||||
<View className='consultation-placeholder'>
|
||||
<Text className='consultation-placeholder-icon'>💬</Text>
|
||||
<Text className='consultation-placeholder-text'>即将上线</Text>
|
||||
<Text className='consultation-placeholder-hint'>在线咨询功能正在开发中，敬请期待</Text>
|
||||
</View>
|
||||
{loading ? (
|
||||
<View className='consultation-loading'>
|
||||
<Loading text='加载中...' />
|
||||
</View>
|
||||
) : error ? (
|
||||
<View className='consultation-error'>
|
||||
<Text className='consultation-error-text'>{error}</Text>
|
||||
</View>
|
||||
) : sessions.length === 0 ? (
|
||||
<View className='consultation-empty'>
|
||||
<Text className='consultation-empty-icon'>💬</Text>
|
||||
<Text className='consultation-empty-text'>暂无咨询记录</Text>
|
||||
<Text className='consultation-empty-hint'>在线咨询功能即将上线，敬请期待</Text>
|
||||
</View>
|
||||
) : (
|
||||
<View className='consultation-list'>
|
||||
{sessions.map((session) => (
|
||||
<View
|
||||
key={session.id}
|
||||
className='consultation-session'
|
||||
onClick={() => handleTapSession(session)}
|
||||
>
|
||||
<View className='session-left'>
|
||||
<View className='session-top'>
|
||||
<Text className='session-subject'>
|
||||
{session.subject || '在线咨询'}
|
||||
</Text>
|
||||
<Text className={getStatusClass(session.status)}>
|
||||
{getStatusLabel(session.status)}
|
||||
</Text>
|
||||
</View>
|
||||
<Text className='session-message'>
|
||||
{session.last_message || '暂无消息'}
|
||||
</Text>
|
||||
<Text className='session-time'>
|
||||
{session.last_message_at
|
||||
? formatTime(session.last_message_at)
|
||||
: formatTime(session.created_at)}
|
||||
</Text>
|
||||
</View>
|
||||
{session.unread_count > 0 && (
|
||||
<View className='session-badge'>
|
||||
<Text className='session-badge-text'>
|
||||
{session.unread_count > 99 ? '99+' : session.unread_count}
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user