refine boxing UI: restructure info bar, scan bar, and mode switch

- Info bar: left-right layout with progress bar below, detail button on right
- Scan bar: remove '已识别' badge, show 工令号/总件数/已装X with larger font
- Mode switch: move to title right side, adopt rectangular style with 18px bold font

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Misaka_Company
2026-05-18 17:00:40 +08:00
parent 9e4667d68f
commit f60745607f
2 changed files with 215 additions and 219 deletions

View File

@@ -1305,10 +1305,15 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
onKeyEvent: _onKeyEvent,
child: Scaffold(
appBar: AppBar(
title: const Text('装箱编号'),
title: Row(
children: [
const Text('装箱编号'),
const SizedBox(width: 8),
_buildModePill(),
],
),
toolbarHeight: 44,
titleSpacing: 12,
actions: [_buildModePill(), const SizedBox(width: 8)],
),
body: Column(
children: [
@@ -1446,27 +1451,10 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
);
}
Widget _buildSingleCodeBody(ColorScheme colorScheme) {
final isWaiting = _phase == _Phase.waiting && _zongpaiNo == null;
final isFinished =
_phase == _Phase.scanned &&
_zongpaiNo != null &&
_remainingQuantity <= 0;
return Column(
children: [
_buildSingleScanBar(isWaiting),
_buildSingleInfoBar(isWaiting, colorScheme),
_buildSingleAssignedList(isWaiting, isFinished),
_buildSingleBottomArea(isWaiting || isFinished),
],
);
}
Widget _buildSingleScanBar(bool isWaiting) {
if (isWaiting) {
return Container(
height: 38,
height: 50,
padding: const EdgeInsets.symmetric(horizontal: 12),
decoration: BoxDecoration(
color: Colors.grey.shade100,
@@ -1486,7 +1474,7 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
}
return Container(
height: 38,
height: 50,
padding: const EdgeInsets.symmetric(horizontal: 12),
decoration: BoxDecoration(
color: Colors.green.shade50,
@@ -1499,23 +1487,17 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
Expanded(
child: Text(
_zongpaiNo ?? '',
style: const TextStyle(fontSize: 13, fontWeight: FontWeight.w700),
style: const TextStyle(fontSize: 20, fontWeight: FontWeight.w700),
overflow: TextOverflow.ellipsis,
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 1),
decoration: BoxDecoration(
color: Colors.green.shade100,
borderRadius: BorderRadius.circular(8),
),
child: Text(
'已识别',
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w700,
color: Colors.green.shade700,
),
const SizedBox(width: 8),
Text(
'${_workOrderNo ?? "--"} / ${_erpQuantity ?? 0}件 / 已装$_packedQuantity',
style: const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w500,
color: Colors.black54,
),
),
],
@@ -1523,6 +1505,23 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
);
}
Widget _buildSingleCodeBody(ColorScheme colorScheme) {
final isWaiting = _phase == _Phase.waiting && _zongpaiNo == null;
final isFinished =
_phase == _Phase.scanned &&
_zongpaiNo != null &&
_remainingQuantity <= 0;
return Column(
children: [
_buildSingleScanBar(isWaiting),
_buildSingleInfoBar(isWaiting, colorScheme),
_buildSingleAssignedList(isWaiting, isFinished),
_buildSingleBottomArea(isWaiting || isFinished),
],
);
}
Widget _buildSingleInfoBar(bool isWaiting, ColorScheme colorScheme) {
final total = _erpQuantity ?? 0;
final packed = isWaiting ? 0 : _packedQuantity;
@@ -1531,90 +1530,68 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
final detailEnabled = !isWaiting && _existingBoxes.isNotEmpty;
return Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Colors.grey.shade50,
border: Border(bottom: BorderSide(color: Colors.grey.shade300)),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
children: [
Expanded(
child: Text(
child: IntrinsicHeight(
child: Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Row(
children: [
Text(
isWaiting ? '排产号 --' : (_paichanNo ?? '--'),
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w700,
color: isWaiting
? Colors.grey.shade400
: Colors.black87,
color: isWaiting ? Colors.grey.shade400 : Colors.black87,
),
overflow: TextOverflow.ellipsis,
),
),
const SizedBox(width: 8),
Text(
isWaiting ? '工单 --' : (_workOrderNo ?? '--'),
style: TextStyle(
fontSize: 12,
color: isWaiting
? Colors.grey.shade400
: Colors.black54,
const SizedBox(width: 10),
Expanded(
child: Text(
isWaiting
? '已有 -- 箱 · 最大箱号 --'
: '已有 ${_existingBoxes.length} 箱 · 最大箱号 $_maxBoxNo',
style: TextStyle(
fontSize: 10,
color: isWaiting
? Colors.grey.shade400
: Colors.grey.shade600,
),
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.right,
),
),
],
),
const SizedBox(height: 4),
ClipRRect(
borderRadius: BorderRadius.circular(2),
child: LinearProgressIndicator(
value: progress,
minHeight: 3,
backgroundColor: Colors.grey.shade300,
valueColor: AlwaysStoppedAnimation<Color>(
finished ? Colors.green.shade700 : colorScheme.primary,
),
),
const SizedBox(width: 8),
Text(
isWaiting ? '-- 件' : '$total',
style: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w700,
color: isWaiting
? Colors.grey.shade400
: Colors.black87,
),
),
],
),
const SizedBox(height: 5),
ClipRRect(
borderRadius: BorderRadius.circular(2),
child: LinearProgressIndicator(
value: progress,
minHeight: 3,
backgroundColor: Colors.grey.shade300,
valueColor: AlwaysStoppedAnimation<Color>(
finished ? Colors.green.shade700 : colorScheme.primary,
),
),
),
const SizedBox(height: 5),
Align(
alignment: Alignment.centerLeft,
child: Text(
isWaiting
? '已有 -- 箱 · 最大箱号 --'
: '已有 ${_existingBoxes.length} 箱 · 最大箱号 $_maxBoxNo · 已装 $packed/$total',
style: TextStyle(
fontSize: 11,
color: isWaiting
? Colors.grey.shade400
: Colors.grey.shade600,
),
overflow: TextOverflow.ellipsis,
),
),
],
],
),
),
),
const SizedBox(width: 10),
_buildDetailButton(detailEnabled, colorScheme),
],
const SizedBox(width: 10),
_buildDetailButton(detailEnabled, colorScheme),
],
),
),
);
}
@@ -2064,44 +2041,45 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
final isSingle = _mode == BoxingMode.singleCode;
final bgColor = isSingle ? Colors.blue.shade700 : Colors.orange.shade700;
return GestureDetector(
onTap: _isAutoProcessing ? null : _cycleMode,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 9, vertical: 3),
decoration: BoxDecoration(
color: bgColor,
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.swap_horiz, color: Colors.white, size: 14),
const SizedBox(width: 4),
Text(
_modeLabel,
style: const TextStyle(
color: Colors.white,
fontSize: 11,
fontWeight: FontWeight.w700,
),
),
const SizedBox(width: 4),
Container(
padding: const EdgeInsets.symmetric(horizontal: 4),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.22),
borderRadius: BorderRadius.circular(4),
),
child: const Text(
'P2',
style: TextStyle(
color: Colors.white,
fontSize: 10,
fontWeight: FontWeight.w600,
return Material(
borderRadius: BorderRadius.circular(8),
color: bgColor,
child: InkWell(
borderRadius: BorderRadius.circular(8),
onTap: _isAutoProcessing ? null : _cycleMode,
child: Container(
height: 36,
padding: const EdgeInsets.symmetric(horizontal: 10),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.swap_horiz, color: Colors.white, size: 18),
const SizedBox(width: 6),
Flexible(
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
_modeLabel,
maxLines: 1,
style: const TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.w800,
),
),
),
),
),
],
const SizedBox(width: 8),
Text(
'P2',
style: TextStyle(
color: Colors.white.withValues(alpha: 0.88),
fontSize: 12,
fontWeight: FontWeight.w700,
),
),
],
),
),
),
);