diff --git a/lib/features/home/presentation/pages/running_status_page.dart b/lib/features/home/presentation/pages/running_status_page.dart index 1247df5f..baccec63 100644 --- a/lib/features/home/presentation/pages/running_status_page.dart +++ b/lib/features/home/presentation/pages/running_status_page.dart @@ -241,6 +241,20 @@ class _RunningStatusPageState extends State { ); } + // 新增:暂无数据占位组件 + Widget _noDataWidget() { + return Center( + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Icon(Icons.inbox_outlined, color: Colors.grey, size: 48), + SizedBox(height: 16), + Text('暂无数据', style: TextStyle(color: Colors.grey, fontSize: 16)), + ], + ), + ); + } + Widget _styledLineChart({ required String title, required List lines, @@ -418,18 +432,13 @@ class _RunningStatusPageState extends State { // ====================== 图表视图 ====================== Widget _buildChartContentView(DeviceStatusState state) { - // 新增:如果数据超时,直接显示loading - if (_isDataTimeout) { - return const Center(child: CircularProgressIndicator(color: Color(0xFF1677FF), strokeWidth: 4)); + // 修改1:超时/无数据时显示暂无数据,而非loading + if (_isDataTimeout || state is DeviceStatusInitial) { + return _noDataWidget(); } if (state is! DeviceStatusUpdated) { - return const Center( - child: CircularProgressIndicator( - color: Color(0xFF1677FF), // 统一使用项目主题蓝色 - strokeWidth: 4, // 加粗加载圈,视觉更清晰 - ), - ); + return _noDataWidget(); } final status = state.status; @@ -650,9 +659,9 @@ class _RunningStatusPageState extends State { // ====================== 卡片视图 ====================== Widget _buildCardContentView(DeviceStatusState state) { - // 新增:如果数据超时,直接显示loading - if (_isDataTimeout) { - return const Center(child: CircularProgressIndicator(color: Color(0xFF1677FF), strokeWidth: 4)); + // 修改2:卡片视图同样替换loading为暂无数据 + if (_isDataTimeout || state is DeviceStatusInitial) { + return _noDataWidget(); } if (state is DeviceStatusUpdated) { @@ -661,16 +670,9 @@ class _RunningStatusPageState extends State { child: Column(children: [_buildMotorTable(state), const SizedBox(height: 20), _buildOtherParamsTable(state)]), ); } else if (state is DeviceStatusError) { - return const Center( - child: Text("数据加载失败", style: TextStyle(color: Colors.red, fontSize: 16)), - ); + return _noDataWidget(); } else { - return const Center( - child: CircularProgressIndicator( - color: Color(0xFF1677FF), // 统一使用项目主题蓝色 - strokeWidth: 4, // 加粗加载圈,视觉更清晰 - ), - ); + return _noDataWidget(); } } @@ -794,29 +796,20 @@ class _RunningStatusPageState extends State { final currentDevice = deviceState.selectedDevice; if (currentDevice == null) { - return const Scaffold(body: Center(child: Text("加载中..."))); + // 修改3:无设备时也显示暂无数据 + return Scaffold( + backgroundColor: const Color(0xFFF7F7F7), + appBar: _buildOptimizedAppBar(), // 使用优化后的AppBar + body: _noDataWidget(), + ); } return Scaffold( backgroundColor: const Color(0xFFF7F7F7), + appBar: _buildOptimizedAppBar(), // 替换原有的SliverAppBar为优化后的AppBar body: CustomScrollView( physics: const BouncingScrollPhysics(), slivers: [ - SliverAppBar( - backgroundColor: const Color(0xFF1677FF), - pinned: true, - centerTitle: true, - elevation: 0, - title: const Text( - "设备数据监控", - style: TextStyle(color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold), - ), - leading: IconButton( - icon: const Icon(Icons.arrow_back, color: Colors.white), - onPressed: () => Navigator.pop(context), - ), - ), - BlocBuilder( builder: (context, state) { // 新增:超时状态下显示-- @@ -946,6 +939,34 @@ class _RunningStatusPageState extends State { ); } + // 修改4:优化后的AppBar样式 + AppBar _buildOptimizedAppBar() { + return AppBar( + backgroundColor: const Color(0xFF1677FF), + elevation: 4, // 增加阴影,提升层次感 + centerTitle: true, + title: const Text( + "设备数据监控", + style: TextStyle( + color: Colors.white, + fontSize: 18, + fontWeight: FontWeight.bold, + letterSpacing: 0.5, // 增加字间距,提升可读性 + ), + ), + leading: IconButton( + icon: const Icon(Icons.arrow_back_ios, color: Colors.white, size: 20), // 替换为更精致的ios风格返回图标 + onPressed: () => Navigator.pop(context), + splashRadius: 24, // 优化点击反馈范围 + ), + // 新增:AppBar底部阴影优化 + shadowColor: Colors.black12, + shape: const RoundedRectangleBorder( + borderRadius: BorderRadius.only(bottomLeft: Radius.circular(12), bottomRight: Radius.circular(12)), + ), + ); + } + // 新增:清空图表历史数据 void _resetChartData() { _leftMeasureHistory.clear();