feat(health+miniprogram): 预约/报告/随访/资讯/家庭管理 — Chunk 4-6
后端: - 添加 articles 表迁移 + Entity + Service + Handler - 健康数据趋势 API (get_mini_trend) 注册路由 - article CRUD (list/get) + DTO 前端 (11个新页面 + 5个服务): - 预约挂号: 列表/创建向导/详情页 - 报告管理: 列表/详情页 - 随访管理: 任务列表/记录详情页 - 资讯文章: 文章详情页 - 个人中心: 就诊人管理/新增/我的报告/我的随访/用药提醒/设置 - 更新 app.config.ts 注册全部路由 - 更新 profile/article 页面为真实功能
This commit is contained in:
105
apps/miniprogram/src/pages/profile/followups/index.tsx
Normal file
105
apps/miniprogram/src/pages/profile/followups/index.tsx
Normal file
@@ -0,0 +1,105 @@
|
||||
import React, { useState, useCallback } from 'react';
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import Taro, { useDidShow } from '@tarojs/taro';
|
||||
import { listTasks, FollowUpTask } from '../../../services/followup';
|
||||
import './index.scss';
|
||||
|
||||
const TABS = [
|
||||
{ key: 'pending', label: '待完成' },
|
||||
{ key: 'completed', label: '已完成' },
|
||||
{ key: 'overdue', label: '已过期' },
|
||||
];
|
||||
|
||||
export default function MyFollowUps() {
|
||||
const [activeTab, setActiveTab] = useState('pending');
|
||||
const [tasks, setTasks] = useState<FollowUpTask[]>([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const fetchTasks = useCallback(async (status: string) => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const res = await listTasks(status);
|
||||
setTasks(res.data || []);
|
||||
} catch {
|
||||
Taro.showToast({ title: '加载失败', icon: 'none' });
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
useDidShow(() => {
|
||||
fetchTasks(activeTab);
|
||||
}, [activeTab, fetchTasks]);
|
||||
|
||||
const handleTabChange = (key: string) => {
|
||||
setActiveTab(key);
|
||||
setTasks([]);
|
||||
fetchTasks(key);
|
||||
};
|
||||
|
||||
const goToDetail = (id: string) => {
|
||||
Taro.navigateTo({ url: `/pages/followup/detail/index?id=${id}` });
|
||||
};
|
||||
|
||||
const getStatusClass = (status: string) => {
|
||||
if (status === 'completed') return 'completed';
|
||||
if (status === 'overdue') return 'overdue';
|
||||
return 'pending';
|
||||
};
|
||||
|
||||
const getStatusLabel = (status: string) => {
|
||||
if (status === 'completed') return '已完成';
|
||||
if (status === 'overdue') return '已过期';
|
||||
return '待完成';
|
||||
};
|
||||
|
||||
return (
|
||||
<View className='my-followups-page'>
|
||||
<View className='tab-bar'>
|
||||
{TABS.map((tab) => (
|
||||
<View
|
||||
className={`tab-item ${activeTab === tab.key ? 'active' : ''}`}
|
||||
key={tab.key}
|
||||
onClick={() => handleTabChange(tab.key)}
|
||||
>
|
||||
<Text className='tab-text'>{tab.label}</Text>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
|
||||
<View className='task-list'>
|
||||
{tasks.map((t) => (
|
||||
<View
|
||||
className='task-card'
|
||||
key={t.id}
|
||||
onClick={() => goToDetail(t.id)}
|
||||
>
|
||||
<View className='task-top'>
|
||||
<Text className='task-name'>{t.task_type}</Text>
|
||||
<Text className={`task-status ${getStatusClass(t.status)}`}>
|
||||
{getStatusLabel(t.status)}
|
||||
</Text>
|
||||
</View>
|
||||
<Text className='task-desc'>{t.description}</Text>
|
||||
<Text className='task-due'>截止日期:{t.due_date}</Text>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
|
||||
{tasks.length === 0 && !loading && (
|
||||
<View className='empty-state'>
|
||||
<Text className='empty-text'>暂无{(() => {
|
||||
const tab = TABS.find((t) => t.key === activeTab);
|
||||
return tab ? tab.label : '';
|
||||
})()}任务</Text>
|
||||
</View>
|
||||
)}
|
||||
|
||||
{loading && (
|
||||
<View className='loading-hint'>
|
||||
<Text className='loading-text'>加载中...</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user