refactor: replace boxing list with table layout matching registration design

Change single-code and multi-code boxing lists from card-style layout
(number + color bar + two-line content) to table-style layout
(column headers + flex columns + left border color bar),
matching the registration module design language.

Fields: Box No. / Total Row No. | Work Order | Quantity | Action Button

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Misaka_Company
2026-05-20 12:40:51 +08:00
parent a6ee6a718b
commit f587194267

View File

@@ -1684,31 +1684,23 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
Widget _buildSingleAssignedHeader(int count) { Widget _buildSingleAssignedHeader(int count) {
return Container( return Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 7), height: 28,
padding: const EdgeInsets.symmetric(horizontal: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.white, color: Colors.grey.shade200,
border: Border(bottom: BorderSide(color: Colors.grey.shade300)), border: Border(bottom: BorderSide(color: Colors.grey.shade400)),
), ),
child: Row( child: Row(
children: [ children: [
const Expanded(flex: 22, child: Text('箱号', style: _headerStyle)),
const Expanded(flex: 24, child: Text('工令号', style: _headerStyle)),
const Expanded( const Expanded(
child: Text( flex: 14,
'已分配(此总排号)', child: Text('数量', textAlign: TextAlign.center, style: _headerStyle),
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w700,
color: Colors.black54,
letterSpacing: 0.5,
),
),
),
Text(
'$count',
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w700,
color: Theme.of(context).colorScheme.primary,
), ),
const SizedBox(
width: 64,
child: Text('操作', textAlign: TextAlign.center, style: _headerStyle),
), ),
], ],
), ),
@@ -1722,81 +1714,74 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
? Colors.amber ? Colors.amber
: (deleting ? Colors.red : Colors.green); : (deleting ? Colors.red : Colors.green);
final Color bgColor;
if (editing) {
bgColor = Colors.yellow.shade50;
} else if (deleting) {
bgColor = Colors.red.shade50;
} else {
bgColor = Colors.transparent;
}
final rowStyle = TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Colors.black87,
);
return Column( return Column(
children: [ children: [
Container( Container(
height: 40, constraints: const BoxConstraints(minHeight: 36),
padding: const EdgeInsets.symmetric(horizontal: 12), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration( decoration: BoxDecoration(
color: editing color: bgColor,
? Colors.yellow.shade50 border: Border(
: (deleting ? Colors.red.shade50 : null), left: BorderSide(color: barColor, width: 3),
border: Border(bottom: BorderSide(color: Colors.grey.shade200)), bottom: BorderSide(color: Colors.grey.shade200),
),
), ),
child: Row( child: Row(
children: [ children: [
SizedBox(
width: 14,
child: Text(
'$index',
textAlign: TextAlign.right,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w600,
color: Colors.grey.shade500,
),
),
),
const SizedBox(width: 6),
Container(
width: 3,
height: 22,
decoration: BoxDecoration(
color: barColor,
borderRadius: BorderRadius.circular(2),
),
),
const SizedBox(width: 6),
Expanded( Expanded(
child: Column( flex: 22,
mainAxisAlignment: MainAxisAlignment.center, child: Text(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'${item.boxNo} 号箱', '${item.boxNo} 号箱',
style: const TextStyle(
fontSize: 13,
fontWeight: FontWeight.w700,
),
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: rowStyle.copyWith(fontWeight: FontWeight.w700),
), ),
Text( ),
Expanded(
flex: 24,
child: Text(
_workOrderNo ?? '--', _workOrderNo ?? '--',
style: TextStyle( overflow: TextOverflow.ellipsis,
fontSize: 10, style: rowStyle,
color: Colors.grey.shade500,
), ),
), ),
], Expanded(
), flex: 14,
), child: editing
if (editing) ? SizedBox(
SizedBox(
width: 52, width: 52,
height: 28, height: 28,
child: TextField( child: TextField(
keyboardType: TextInputType.none, keyboardType: TextInputType.none,
inputFormatters: [FilteringTextInputFormatter.digitsOnly], inputFormatters: [
FilteringTextInputFormatter.digitsOnly,
],
textAlign: TextAlign.center, textAlign: TextAlign.center,
controller: controller: TextEditingController(
TextEditingController(text: _editingAssignedQuantity) text: _editingAssignedQuantity,
..selection = TextSelection.collapsed( )..selection = TextSelection.collapsed(
offset: _editingAssignedQuantity.length, offset: _editingAssignedQuantity.length,
), ),
onChanged: (value) => _editingAssignedQuantity = value, onChanged: (v) => _editingAssignedQuantity = v,
onSubmitted: (_) => _saveAssignedItem(item), onSubmitted: (_) => _saveAssignedItem(item),
decoration: InputDecoration( decoration: InputDecoration(
contentPadding: const EdgeInsets.symmetric(horizontal: 4), contentPadding: const EdgeInsets.symmetric(
horizontal: 4,
),
border: OutlineInputBorder( border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5), borderRadius: BorderRadius.circular(5),
borderSide: const BorderSide( borderSide: const BorderSide(
@@ -1811,20 +1796,28 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
), ),
), ),
) )
else : Text(
Text(
'${item.quantity}', '${item.quantity}',
textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 13, fontSize: 12,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: deleting ? Colors.red : Colors.black54, color: deleting ? Colors.red : Colors.black54,
), ),
), ),
),
SizedBox(
width: 64,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (editing) ...[ if (editing) ...[
_iconBtn( _iconBtn(
Icons.check, Icons.check,
color: Colors.green, color: Colors.green,
onTap: _isSubmitting ? null : () => _saveAssignedItem(item), onTap: _isSubmitting
? null
: () => _saveAssignedItem(item),
), ),
_iconBtn( _iconBtn(
Icons.close, Icons.close,
@@ -1835,7 +1828,9 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
_iconBtn( _iconBtn(
Icons.edit, Icons.edit,
color: Colors.grey.shade700, color: Colors.grey.shade700,
onTap: _isSubmitting ? null : () => _startEditAssigned(item), onTap: _isSubmitting
? null
: () => _startEditAssigned(item),
), ),
_iconBtn( _iconBtn(
Icons.delete_outline, Icons.delete_outline,
@@ -1854,10 +1849,13 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
], ],
), ),
), ),
],
),
),
if (deleting) if (deleting)
Container( Container(
height: 28, height: 28,
padding: const EdgeInsets.only(left: 34, right: 12), padding: const EdgeInsets.only(left: 15, right: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.red.shade50, color: Colors.red.shade50,
border: Border(bottom: BorderSide(color: Colors.red.shade200)), border: Border(bottom: BorderSide(color: Colors.red.shade200)),
@@ -2237,31 +2235,23 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
Widget _buildManyToOneListHeader(int count) { Widget _buildManyToOneListHeader(int count) {
return Container( return Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 7), height: 28,
padding: const EdgeInsets.symmetric(horizontal: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.white, color: Colors.grey.shade200,
border: Border(bottom: BorderSide(color: Colors.grey.shade300)), border: Border(bottom: BorderSide(color: Colors.grey.shade400)),
), ),
child: Row( child: Row(
children: [ children: [
const Expanded(flex: 22, child: Text('总排号', style: _headerStyle)),
const Expanded(flex: 24, child: Text('工令号', style: _headerStyle)),
const Expanded( const Expanded(
child: Text( flex: 14,
'已装入本箱', child: Text('数量', textAlign: TextAlign.center, style: _headerStyle),
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w700,
color: Colors.black54,
letterSpacing: 0.5,
),
),
),
Text(
'$count',
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w700,
color: Theme.of(context).colorScheme.primary,
), ),
const SizedBox(
width: 64,
child: Text('操作', textAlign: TextAlign.center, style: _headerStyle),
), ),
], ],
), ),
@@ -2279,85 +2269,73 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
? Colors.amber ? Colors.amber
: (deleting ? Colors.red : Colors.green); : (deleting ? Colors.red : Colors.green);
final Color bgColor;
if (editing) {
bgColor = Colors.yellow.shade50;
} else if (deleting) {
bgColor = Colors.red.shade50;
} else {
bgColor = Colors.transparent;
}
final rowStyle = TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
color: Colors.black87,
);
return Column( return Column(
children: [ children: [
Container( Container(
height: 40, constraints: const BoxConstraints(minHeight: 36),
padding: const EdgeInsets.symmetric(horizontal: 12), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration( decoration: BoxDecoration(
color: editing color: bgColor,
? Colors.yellow.shade50 border: Border(
: (deleting ? Colors.red.shade50 : null), left: BorderSide(color: barColor, width: 3),
border: Border(bottom: BorderSide(color: Colors.grey.shade200)), bottom: BorderSide(color: Colors.grey.shade200),
),
), ),
child: Row( child: Row(
children: [ children: [
// Index
SizedBox(
width: 14,
child: Text(
'$index',
textAlign: TextAlign.right,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w600,
color: Colors.grey.shade500,
),
),
),
const SizedBox(width: 6),
// Color bar
Container(
width: 3,
height: 26,
decoration: BoxDecoration(
color: barColor,
borderRadius: BorderRadius.circular(2),
),
),
const SizedBox(width: 6),
// Main info
Expanded( Expanded(
child: Column( flex: 22,
mainAxisAlignment: MainAxisAlignment.center, child: Text(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.zongpaiNo, item.zongpaiNo,
style: const TextStyle(
fontSize: 12,
fontWeight: FontWeight.w700,
),
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: rowStyle.copyWith(fontWeight: FontWeight.w700),
), ),
Text( ),
Expanded(
flex: 24,
child: Text(
item.workOrderNo ?? '--', item.workOrderNo ?? '--',
style: TextStyle(
fontSize: 11,
color: Colors.grey.shade500,
),
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), style: rowStyle,
],
), ),
), ),
// Quantity / edit input Expanded(
if (editing) flex: 14,
SizedBox( child: editing
? SizedBox(
width: 52, width: 52,
height: 26, height: 26,
child: TextField( child: TextField(
keyboardType: TextInputType.none, keyboardType: TextInputType.none,
inputFormatters: [FilteringTextInputFormatter.digitsOnly], inputFormatters: [
FilteringTextInputFormatter.digitsOnly,
],
textAlign: TextAlign.center, textAlign: TextAlign.center,
controller: controller: TextEditingController(
TextEditingController(text: _editingPackedQuantity) text: _editingPackedQuantity,
..selection = TextSelection.collapsed( )..selection = TextSelection.collapsed(
offset: _editingPackedQuantity.length, offset: _editingPackedQuantity.length,
), ),
onChanged: (value) => _editingPackedQuantity = value, onChanged: (v) => _editingPackedQuantity = v,
decoration: InputDecoration( decoration: InputDecoration(
contentPadding: const EdgeInsets.symmetric(horizontal: 4), contentPadding: const EdgeInsets.symmetric(
horizontal: 4,
),
border: OutlineInputBorder( border: OutlineInputBorder(
borderRadius: BorderRadius.circular(4), borderRadius: BorderRadius.circular(4),
borderSide: const BorderSide( borderSide: const BorderSide(
@@ -2372,21 +2350,28 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
), ),
), ),
) )
else : Text(
Text(
'${item.quantity} / $totalText', '${item.quantity} / $totalText',
textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: deleting ? Colors.red : Colors.green.shade700, color: deleting ? Colors.red : Colors.green.shade700,
), ),
), ),
// Action buttons ),
SizedBox(
width: 64,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (editing) ...[ if (editing) ...[
_iconBtn( _iconBtn(
Icons.check, Icons.check,
color: Colors.green, color: Colors.green,
onTap: _isSubmitting ? null : () => _savePackedItem(item), onTap: _isSubmitting
? null
: () => _savePackedItem(item),
), ),
_iconBtn( _iconBtn(
Icons.close, Icons.close,
@@ -2396,7 +2381,7 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
] else ...[ ] else ...[
_iconBtn( _iconBtn(
Icons.edit, Icons.edit,
color: Colors.orange.shade700, color: Colors.grey.shade700,
onTap: _isSubmitting onTap: _isSubmitting
? null ? null
: () => _startEditPackedItem(item), : () => _startEditPackedItem(item),
@@ -2418,25 +2403,23 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
], ],
), ),
), ),
// Inline delete confirmation ],
),
),
if (deleting) if (deleting)
Container( Container(
padding: const EdgeInsets.only( height: 28,
left: 34, padding: const EdgeInsets.only(left: 15, right: 12),
right: 12,
top: 2,
bottom: 5,
),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.red.shade50, color: Colors.red.shade50,
border: Border(bottom: BorderSide(color: Colors.red.shade200)), border: Border(bottom: BorderSide(color: Colors.red.shade200)),
), ),
child: Row( child: Row(
children: [ children: [
const Expanded( Expanded(
child: Text( child: Text(
'确认删除?', '确认删除?',
style: TextStyle( style: const TextStyle(
fontSize: 12, fontSize: 12,
color: Colors.red, color: Colors.red,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
@@ -2735,3 +2718,5 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
); );
} }
} }
const _headerStyle = TextStyle(fontSize: 10, fontWeight: FontWeight.w700);