feat: 蓝牙血压计BLE数据同步 + 设备管理页重构 + 健康记录滑动删除 + 医生端合并设计文档
- BLE: 修复Omron设备Indication模式连接(先订阅后配CCCD + forceIndications) + 直连重连
- BLE: 设备断连实时检测(connectionState流→Provider→UI)
- 修复: 血压数据上报后端枚举不匹配(Device→DeviceSync)导致500
- 新增: DELETE /api/health-records/{id} 后端接口
- 设备管理页: 白色主题重设计 + 直连重连 + 实时状态 + Toast通知
- 设备扫描页: 白色主题 + 扫描动画居中 + 已连接等待页面
- 健康记录: 左滑删除(Dismissible) + 同时清理_allRecords和_filtered
- 导航: 修复自定义路由栈下Navigator.pop黑屏bug
- 文档: 医生端合并App完整设计文档(已确认版)
This commit is contained in:
223
health_app/lib/pages/device/device_management_page.dart
Normal file
223
health_app/lib/pages/device/device_management_page.dart
Normal file
@@ -0,0 +1,223 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../../core/app_colors.dart';
|
||||
import '../../core/navigation_provider.dart';
|
||||
import '../../providers/omron_device_provider.dart';
|
||||
import '../../services/omron_ble_service.dart';
|
||||
|
||||
class DeviceManagementPage extends ConsumerStatefulWidget {
|
||||
const DeviceManagementPage({super.key});
|
||||
@override ConsumerState<DeviceManagementPage> createState() => _DeviceManagementPageState();
|
||||
}
|
||||
|
||||
class _DeviceManagementPageState extends ConsumerState<DeviceManagementPage> {
|
||||
bool _reconnecting = false;
|
||||
OverlayEntry? _toast;
|
||||
|
||||
@override void dispose() { _hideToast(); super.dispose(); }
|
||||
|
||||
void _showToast(String msg, {bool success = false}) {
|
||||
_hideToast();
|
||||
_toast = OverlayEntry(
|
||||
builder: (_) => Positioned(
|
||||
top: MediaQuery.of(context).padding.top + 8, left: 16, right: 16,
|
||||
child: TweenAnimationBuilder<double>(
|
||||
tween: Tween(begin: 0.0, end: 1.0), duration: const Duration(milliseconds: 250),
|
||||
builder: (_, v, __) => Opacity(
|
||||
opacity: v,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: success ? const Color(0xFF059669) : const Color(0xFFDC2626),
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
boxShadow: const [BoxShadow(color: Colors.black26, blurRadius: 8, offset: Offset(0, 2))],
|
||||
),
|
||||
child: Row(mainAxisSize: MainAxisSize.min, children: [
|
||||
Icon(success ? Icons.check_circle : Icons.info_outline, color: Colors.white, size: 18),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(child: Text(msg, style: const TextStyle(color: Colors.white, fontSize: 14))),
|
||||
]),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
Overlay.of(context).insert(_toast!);
|
||||
Future.delayed(const Duration(seconds: 2), _hideToast);
|
||||
}
|
||||
|
||||
void _hideToast() { _toast?.remove(); _toast = null; }
|
||||
|
||||
Future<void> _reconnect(String mac) async {
|
||||
if (_reconnecting) return;
|
||||
setState(() => _reconnecting = true);
|
||||
final ok = await ref.read(omronBleServiceProvider).reconnectByMac(mac);
|
||||
if (!mounted) return;
|
||||
setState(() => _reconnecting = false);
|
||||
if (ok) {
|
||||
_showToast('设备已连接', success: true);
|
||||
} else {
|
||||
_showToast('设备未在线,请确认血压计已开机并处于通信模式');
|
||||
}
|
||||
}
|
||||
|
||||
@override Widget build(BuildContext context) {
|
||||
final device = ref.watch(omronDeviceProvider);
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFFF5F5F5),
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.white,
|
||||
elevation: 0,
|
||||
title: const Text('蓝牙设备', style: TextStyle(color: AppColors.textPrimary)),
|
||||
actions: [
|
||||
IconButton(
|
||||
icon: const Icon(Icons.add, color: AppColors.primary),
|
||||
onPressed: () => pushRoute(ref, 'deviceScan'),
|
||||
tooltip: '添加设备',
|
||||
),
|
||||
],
|
||||
),
|
||||
body: device.isBound ? _buildDeviceList(device) : _buildEmpty(),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmpty() => Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Column(mainAxisSize: MainAxisSize.min, children: [
|
||||
Container(
|
||||
width: 80, height: 80,
|
||||
decoration: BoxDecoration(color: const Color(0xFFF0F0F0), borderRadius: BorderRadius.circular(24)),
|
||||
child: const Icon(Icons.bluetooth_disabled, size: 40, color: Color(0xFFBBBBBB)),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
const Text('暂无设备', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: AppColors.textPrimary)),
|
||||
const SizedBox(height: 6),
|
||||
const Text('点击右上角 + 添加血压计', style: TextStyle(fontSize: 14, color: AppColors.textHint)),
|
||||
]),
|
||||
),
|
||||
);
|
||||
|
||||
Widget _buildDeviceList(DeviceBindState d) => ListView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
children: [
|
||||
// 设备卡片
|
||||
GestureDetector(
|
||||
onTap: d.isConnected ? null : () => _reconnect(d.mac ?? ''),
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(
|
||||
color: d.isConnected ? const Color(0xFF10B981) : const Color(0xFFEEEEEE),
|
||||
width: d.isConnected ? 1.5 : 1,
|
||||
),
|
||||
),
|
||||
child: Row(children: [
|
||||
Container(
|
||||
width: 48, height: 48,
|
||||
decoration: BoxDecoration(
|
||||
color: d.isConnected ? const Color(0xFFD1FAE5) : const Color(0xFFF5F5F5),
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
),
|
||||
child: Icon(Icons.bluetooth, size: 24,
|
||||
color: d.isConnected ? const Color(0xFF10B981) : const Color(0xFFBBBBBB)),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
|
||||
Text(d.name ?? '血压计', style: const TextStyle(fontSize: 16, fontWeight: FontWeight.w600, color: AppColors.textPrimary)),
|
||||
const SizedBox(height: 2),
|
||||
Text(d.mac ?? '', style: const TextStyle(fontSize: 12, color: AppColors.textHint)),
|
||||
if (d.lastSync != null)
|
||||
Text('上次同步: ${d.lastSync}', style: const TextStyle(fontSize: 11, color: AppColors.textHint)),
|
||||
])),
|
||||
if (_reconnecting)
|
||||
const SizedBox(width: 24, height: 24, child: CircularProgressIndicator(strokeWidth: 2))
|
||||
else ...[
|
||||
Container(
|
||||
width: 8, height: 8,
|
||||
decoration: BoxDecoration(
|
||||
color: d.isConnected ? const Color(0xFF10B981) : const Color(0xFFBBBBBB),
|
||||
shape: BoxShape.circle,
|
||||
boxShadow: d.isConnected ? [BoxShadow(color: const Color(0xFF10B981).withOpacity(0.4), blurRadius: 4)] : null,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
d.isConnected ? '已连接' : '未连接',
|
||||
style: TextStyle(fontSize: 13, color: d.isConnected ? const Color(0xFF10B981) : AppColors.textHint),
|
||||
),
|
||||
],
|
||||
]),
|
||||
),
|
||||
),
|
||||
|
||||
// 最近读数
|
||||
if (d.lastReading != null) ...[
|
||||
const SizedBox(height: 12),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(16)),
|
||||
child: Row(children: [
|
||||
const Text('最近测量', style: TextStyle(fontSize: 14, color: AppColors.textHint)),
|
||||
const Spacer(),
|
||||
Text(d.lastReading!.display, style: const TextStyle(fontSize: 24, fontWeight: FontWeight.w700, color: AppColors.textPrimary)),
|
||||
const SizedBox(width: 4),
|
||||
const Text('mmHg', style: TextStyle(fontSize: 12, color: AppColors.textHint)),
|
||||
if (d.lastReading!.pulse != null) ...[
|
||||
const SizedBox(width: 16),
|
||||
Text('${d.lastReading!.pulse} bpm', style: const TextStyle(fontSize: 14, color: AppColors.primary)),
|
||||
],
|
||||
]),
|
||||
),
|
||||
],
|
||||
|
||||
const SizedBox(height: 16),
|
||||
// 解绑
|
||||
SizedBox(width: double.infinity, child: OutlinedButton(
|
||||
onPressed: () async {
|
||||
final ok = await showDialog<bool>(context: context, builder: (ctx) => AlertDialog(
|
||||
title: const Text('解绑设备'),
|
||||
content: const Text('解绑后需重新扫描连接,确定吗?'),
|
||||
actions: [
|
||||
TextButton(onPressed: () => Navigator.pop(ctx, false), child: const Text('取消')),
|
||||
TextButton(onPressed: () => Navigator.pop(ctx, true), child: const Text('确定'), style: TextButton.styleFrom(foregroundColor: AppColors.error)),
|
||||
],
|
||||
));
|
||||
if (ok == true) await ref.read(omronDeviceProvider.notifier).unbind();
|
||||
},
|
||||
style: OutlinedButton.styleFrom(
|
||||
foregroundColor: AppColors.error, side: const BorderSide(color: Color(0xFFFECACA)),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14)),
|
||||
padding: const EdgeInsets.symmetric(vertical: 12),
|
||||
),
|
||||
child: const Text('解绑设备'),
|
||||
)),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(16)),
|
||||
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
|
||||
const Text('使用说明', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600)),
|
||||
const SizedBox(height: 8),
|
||||
_tip('1', '血压计装好电池,绑好袖带'),
|
||||
_tip('2', '按开始键测量,结束后设备自动进入通信模式'),
|
||||
_tip('3', '点击设备栏即可自动连接并同步数据'),
|
||||
]),
|
||||
),
|
||||
],
|
||||
);
|
||||
|
||||
Widget _tip(String n, String t) => Padding(
|
||||
padding: const EdgeInsets.only(bottom: 4),
|
||||
child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
|
||||
Text('$n.', style: const TextStyle(fontSize: 13, color: AppColors.primary, fontWeight: FontWeight.w600)),
|
||||
const SizedBox(width: 4),
|
||||
Expanded(child: Text(t, style: const TextStyle(fontSize: 13, color: AppColors.textSecondary))),
|
||||
]),
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user