refactor(home): 优化运行状态监控界面布局和参数显示

- 将程序名文本包装在Flexible组件中并添加省略号处理
- 为步骤信息添加Flexible组件以改善布局
- 使用ScrollableVIew包装内容以支持滚动
- 重构步骤参数显示为三列布局
- 移除硬编码的温度和磁力时间参数
- 更新速度、持续时间和样品体积的单位显示
- 从状态栏移除设备名称显示
- 从设置菜单移除USB导入功能选项
This commit is contained in:
Developer
2026-06-04 17:47:12 +08:00
parent 736c36a98e
commit 87c4b669a0
3 changed files with 87 additions and 130 deletions

View File

@@ -25,73 +25,81 @@ class RunStatusMonitor extends ConsumerWidget {
borderRadius: BorderRadius.circular(8),
border: Border.all(color: AppTheme.borderSubtle, width: 1),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 标题 + 程序名
Row(
children: [
Text(
l10n?.runningMonitor ?? '运行状态监控',
style: const TextStyle(
color: AppTheme.textHeading,
fontSize: 15,
fontWeight: FontWeight.w600,
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 标题 + 程序名
Row(
children: [
Text(
l10n?.runningMonitor ?? '运行状态监控',
style: const TextStyle(
color: AppTheme.textHeading,
fontSize: 15,
fontWeight: FontWeight.w600,
),
),
),
const Spacer(),
Text(
runState.currentProgram?.name ?? '',
style: const TextStyle(
color: AppTheme.accentPrimary,
fontSize: 18,
fontWeight: FontWeight.w700,
const Spacer(),
Flexible(
child: Text(
runState.currentProgram?.name ?? '',
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: AppTheme.accentPrimary,
fontSize: 18,
fontWeight: FontWeight.w700,
),
),
),
),
],
),
],
),
const SizedBox(height: 14),
const SizedBox(height: 14),
// 进度信息横排 (孔位 / 步骤 / 剩余时间)
Row(
children: [
// 当前孔位
_buildInfoBlock(
label: l10n?.currentHole ?? '当前孔位',
value: runState.currentWell ?? '--',
valueColor: AppTheme.textHeading,
),
const SizedBox(width: 20),
// 当前步骤
_buildInfoBlock(
label: l10n?.currentStep ?? '当前步骤',
value: '${l10n?.stepNo ?? '步骤'} ${runState.currentStepIndex + 1}',
subValue: runState.currentStep?.name ?? '--',
valueColor: AppTheme.accentInfo,
),
const SizedBox(width: 20),
// 剩余时间
_buildInfoBlock(
label: l10n?.remainingTime ?? '剩余时间',
value: runState.formattedRemainingTime,
valueColor: AppTheme.textHeading,
valueSize: 20,
),
],
),
// 进度信息横排 (孔位 / 步骤 / 剩余时间)
Row(
children: [
// 当前孔位
_buildInfoBlock(
label: l10n?.currentHole ?? '当前孔位',
value: runState.currentWell ?? '--',
valueColor: AppTheme.textHeading,
),
const SizedBox(width: 20),
// 当前步骤
Flexible(
child: _buildInfoBlock(
label: l10n?.currentStep ?? '当前步骤',
value: '${l10n?.stepNo ?? '步骤'} ${runState.currentStepIndex + 1}',
subValue: runState.currentStep?.name ?? '--',
valueColor: AppTheme.accentInfo,
),
),
const SizedBox(width: 20),
// 剩余时间
_buildInfoBlock(
label: l10n?.remainingTime ?? '剩余时间',
value: runState.formattedRemainingTime,
valueColor: AppTheme.textHeading,
valueSize: 20,
),
],
),
const SizedBox(height: 14),
const SizedBox(height: 14),
// 总进度条
_buildProgressBar(l10n, runState),
// 总进度条
_buildProgressBar(l10n, runState),
const SizedBox(height: 14),
const SizedBox(height: 14),
// 步骤参数
if (runState.currentStep != null)
_buildStepParams(l10n, runState.currentStep!),
],
// 步骤参数
if (runState.currentStep != null)
_buildStepParams(l10n, runState.currentStep!),
],
),
),
);
}
@@ -190,53 +198,26 @@ class RunStatusMonitor extends ConsumerWidget {
fontSize: 11,
),
),
const SizedBox(height: 2),
if (step.mixTime > 0)
_buildParamRow(
l10n?.speed ?? '转速',
'${step.speed}',
),
if (step.magnetTime > 0)
_buildParamRow(
l10n?.temperature ?? '温度',
'65.0 °C',
),
_buildParamRow(
l10n?.duration ?? '持续时间',
step.mixTime > 0 ? '${step.mixTime} min' : '--',
),
_buildParamRow(
l10n?.sampleVolume ?? '样品体积',
'10.0 mL',
const SizedBox(height: 8),
Row(
children: [
_buildInfoBlock(
label: l10n?.speed ?? '速度',
value: '${step.speed} ${l10n?.speedLevel ?? ''}',
),
const SizedBox(width: 20),
_buildInfoBlock(
label: l10n?.duration ?? '持续时间',
value: '${step.mixTime} s',
),
const SizedBox(width: 20),
_buildInfoBlock(
label: l10n?.sampleVolume ?? '样品体积',
value: '${step.volume} μL',
),
],
),
],
);
}
/// 参数行
Widget _buildParamRow(String label, String value) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 2),
child: Row(
children: [
Text(
label,
style: const TextStyle(
color: AppTheme.textTertiary,
fontSize: 11,
),
),
const Spacer(),
Text(
value,
style: const TextStyle(
color: AppTheme.textPrimary,
fontSize: 11,
fontFamily: 'monospace',
),
),
],
),
);
}
}

View File

@@ -95,21 +95,7 @@ class _StatusBarState extends ConsumerState<StatusBar> {
),
child: Row(
children: [
Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.precision_manufacturing, color: Colors.white, size: 22),
const SizedBox(width: 10),
Text(
l10n?.deviceName ?? '污水毒品前处理一体机',
style: const TextStyle(
color: Colors.white,
fontSize: 17,
fontWeight: FontWeight.w700,
),
),
],
),
const Icon(Icons.precision_manufacturing, color: Colors.white, size: 22),
if (widget.tabs.isNotEmpty) ...[
const SizedBox(width: 32),
_buildNavTabs(),

View File

@@ -5,10 +5,9 @@ import '../../../core/theme/app_theme.dart';
import '../../../shared/widgets/common_button.dart';
import '../widgets/language_panel.dart';
import '../widgets/password_panel.dart';
import '../widgets/usb_import_panel.dart';
/// 设置页菜单
enum _SettingsMenu { upgrade, language, password, usbImport }
enum _SettingsMenu { upgrade, language, password }
/// 系统设置页面
class SettingsPage extends ConsumerStatefulWidget {
@@ -85,14 +84,6 @@ class _SettingsPageState extends ConsumerState<SettingsPage> {
onTap: () => setState(
() => _currentMenu = _SettingsMenu.password),
),
// U盘导入
_buildMenuItem(
icon: Icons.usb,
title: l10n?.usbImport ?? 'U盘导入',
selected: _currentMenu == _SettingsMenu.usbImport,
onTap: () => setState(
() => _currentMenu = _SettingsMenu.usbImport),
),
],
),
),
@@ -120,7 +111,6 @@ class _SettingsPageState extends ConsumerState<SettingsPage> {
return switch (_currentMenu) {
_SettingsMenu.language => const LanguagePanel(),
_SettingsMenu.password => const PasswordPanel(),
_SettingsMenu.usbImport => const UsbImportPanel(),
_SettingsMenu.upgrade => _buildUpgradeContent(),
};
}