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:
@@ -1684,31 +1684,23 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
|
||||
|
||||
Widget _buildSingleAssignedHeader(int count) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 7),
|
||||
height: 28,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
border: Border(bottom: BorderSide(color: Colors.grey.shade300)),
|
||||
color: Colors.grey.shade200,
|
||||
border: Border(bottom: BorderSide(color: Colors.grey.shade400)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Expanded(flex: 22, child: Text('箱号', style: _headerStyle)),
|
||||
const Expanded(flex: 24, child: Text('工令号', style: _headerStyle)),
|
||||
const Expanded(
|
||||
child: Text(
|
||||
'已分配(此总排号)',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: Colors.black54,
|
||||
letterSpacing: 0.5,
|
||||
),
|
||||
),
|
||||
flex: 14,
|
||||
child: Text('数量', textAlign: TextAlign.center, style: _headerStyle),
|
||||
),
|
||||
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,142 +1714,148 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
|
||||
? Colors.amber
|
||||
: (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(
|
||||
children: [
|
||||
Container(
|
||||
height: 40,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
constraints: const BoxConstraints(minHeight: 36),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
color: editing
|
||||
? Colors.yellow.shade50
|
||||
: (deleting ? Colors.red.shade50 : null),
|
||||
border: Border(bottom: BorderSide(color: Colors.grey.shade200)),
|
||||
color: bgColor,
|
||||
border: Border(
|
||||
left: BorderSide(color: barColor, width: 3),
|
||||
bottom: BorderSide(color: Colors.grey.shade200),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
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(
|
||||
child: Column(
|
||||
flex: 22,
|
||||
child: Text(
|
||||
'${item.boxNo} 号箱',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: rowStyle.copyWith(fontWeight: FontWeight.w700),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 24,
|
||||
child: Text(
|
||||
_workOrderNo ?? '--',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: rowStyle,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 14,
|
||||
child: editing
|
||||
? SizedBox(
|
||||
width: 52,
|
||||
height: 28,
|
||||
child: TextField(
|
||||
keyboardType: TextInputType.none,
|
||||
inputFormatters: [
|
||||
FilteringTextInputFormatter.digitsOnly,
|
||||
],
|
||||
textAlign: TextAlign.center,
|
||||
controller: TextEditingController(
|
||||
text: _editingAssignedQuantity,
|
||||
)..selection = TextSelection.collapsed(
|
||||
offset: _editingAssignedQuantity.length,
|
||||
),
|
||||
onChanged: (v) => _editingAssignedQuantity = v,
|
||||
onSubmitted: (_) => _saveAssignedItem(item),
|
||||
decoration: InputDecoration(
|
||||
contentPadding: const EdgeInsets.symmetric(
|
||||
horizontal: 4,
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(5),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.amber,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
),
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
)
|
||||
: Text(
|
||||
'${item.quantity} 件',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: deleting ? Colors.red : Colors.black54,
|
||||
),
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: 64,
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'${item.boxNo} 号箱',
|
||||
style: const TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w700,
|
||||
if (editing) ...[
|
||||
_iconBtn(
|
||||
Icons.check,
|
||||
color: Colors.green,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () => _saveAssignedItem(item),
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
Text(
|
||||
_workOrderNo ?? '--',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
color: Colors.grey.shade500,
|
||||
_iconBtn(
|
||||
Icons.close,
|
||||
color: Colors.grey,
|
||||
onTap: _isSubmitting ? null : _cancelEditAssigned,
|
||||
),
|
||||
),
|
||||
] else ...[
|
||||
_iconBtn(
|
||||
Icons.edit,
|
||||
color: Colors.grey.shade700,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () => _startEditAssigned(item),
|
||||
),
|
||||
_iconBtn(
|
||||
Icons.delete_outline,
|
||||
color: Colors.red,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () {
|
||||
setState(() {
|
||||
_deletingAssignedItemId = item.boxItemId;
|
||||
_editingAssignedItemId = null;
|
||||
_editingAssignedQuantity = '';
|
||||
});
|
||||
},
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
if (editing)
|
||||
SizedBox(
|
||||
width: 52,
|
||||
height: 28,
|
||||
child: TextField(
|
||||
keyboardType: TextInputType.none,
|
||||
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
|
||||
textAlign: TextAlign.center,
|
||||
controller:
|
||||
TextEditingController(text: _editingAssignedQuantity)
|
||||
..selection = TextSelection.collapsed(
|
||||
offset: _editingAssignedQuantity.length,
|
||||
),
|
||||
onChanged: (value) => _editingAssignedQuantity = value,
|
||||
onSubmitted: (_) => _saveAssignedItem(item),
|
||||
decoration: InputDecoration(
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 4),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(5),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.amber,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
),
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
)
|
||||
else
|
||||
Text(
|
||||
'${item.quantity} 件',
|
||||
style: TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: deleting ? Colors.red : Colors.black54,
|
||||
),
|
||||
),
|
||||
if (editing) ...[
|
||||
_iconBtn(
|
||||
Icons.check,
|
||||
color: Colors.green,
|
||||
onTap: _isSubmitting ? null : () => _saveAssignedItem(item),
|
||||
),
|
||||
_iconBtn(
|
||||
Icons.close,
|
||||
color: Colors.grey,
|
||||
onTap: _isSubmitting ? null : _cancelEditAssigned,
|
||||
),
|
||||
] else ...[
|
||||
_iconBtn(
|
||||
Icons.edit,
|
||||
color: Colors.grey.shade700,
|
||||
onTap: _isSubmitting ? null : () => _startEditAssigned(item),
|
||||
),
|
||||
_iconBtn(
|
||||
Icons.delete_outline,
|
||||
color: Colors.red,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () {
|
||||
setState(() {
|
||||
_deletingAssignedItemId = item.boxItemId;
|
||||
_editingAssignedItemId = null;
|
||||
_editingAssignedQuantity = '';
|
||||
});
|
||||
},
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
if (deleting)
|
||||
Container(
|
||||
height: 28,
|
||||
padding: const EdgeInsets.only(left: 34, right: 12),
|
||||
padding: const EdgeInsets.only(left: 15, right: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.red.shade50,
|
||||
border: Border(bottom: BorderSide(color: Colors.red.shade200)),
|
||||
@@ -2237,31 +2235,23 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
|
||||
|
||||
Widget _buildManyToOneListHeader(int count) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 7),
|
||||
height: 28,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
border: Border(bottom: BorderSide(color: Colors.grey.shade300)),
|
||||
color: Colors.grey.shade200,
|
||||
border: Border(bottom: BorderSide(color: Colors.grey.shade400)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Expanded(flex: 22, child: Text('总排号', style: _headerStyle)),
|
||||
const Expanded(flex: 24, child: Text('工令号', style: _headerStyle)),
|
||||
const Expanded(
|
||||
child: Text(
|
||||
'已装入本箱',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: Colors.black54,
|
||||
letterSpacing: 0.5,
|
||||
),
|
||||
),
|
||||
flex: 14,
|
||||
child: Text('数量', textAlign: TextAlign.center, style: _headerStyle),
|
||||
),
|
||||
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,164 +2269,157 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
|
||||
? Colors.amber
|
||||
: (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(
|
||||
children: [
|
||||
Container(
|
||||
height: 40,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
constraints: const BoxConstraints(minHeight: 36),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
color: editing
|
||||
? Colors.yellow.shade50
|
||||
: (deleting ? Colors.red.shade50 : null),
|
||||
border: Border(bottom: BorderSide(color: Colors.grey.shade200)),
|
||||
color: bgColor,
|
||||
border: Border(
|
||||
left: BorderSide(color: barColor, width: 3),
|
||||
bottom: BorderSide(color: Colors.grey.shade200),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
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(
|
||||
child: Column(
|
||||
flex: 22,
|
||||
child: Text(
|
||||
item.zongpaiNo,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: rowStyle.copyWith(fontWeight: FontWeight.w700),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 24,
|
||||
child: Text(
|
||||
item.workOrderNo ?? '--',
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: rowStyle,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
flex: 14,
|
||||
child: editing
|
||||
? SizedBox(
|
||||
width: 52,
|
||||
height: 26,
|
||||
child: TextField(
|
||||
keyboardType: TextInputType.none,
|
||||
inputFormatters: [
|
||||
FilteringTextInputFormatter.digitsOnly,
|
||||
],
|
||||
textAlign: TextAlign.center,
|
||||
controller: TextEditingController(
|
||||
text: _editingPackedQuantity,
|
||||
)..selection = TextSelection.collapsed(
|
||||
offset: _editingPackedQuantity.length,
|
||||
),
|
||||
onChanged: (v) => _editingPackedQuantity = v,
|
||||
decoration: InputDecoration(
|
||||
contentPadding: const EdgeInsets.symmetric(
|
||||
horizontal: 4,
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.amber,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
),
|
||||
style: const TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
)
|
||||
: Text(
|
||||
'${item.quantity} / $totalText',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: deleting ? Colors.red : Colors.green.shade700,
|
||||
),
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: 64,
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
item.zongpaiNo,
|
||||
style: const TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w700,
|
||||
if (editing) ...[
|
||||
_iconBtn(
|
||||
Icons.check,
|
||||
color: Colors.green,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () => _savePackedItem(item),
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
Text(
|
||||
item.workOrderNo ?? '--',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
color: Colors.grey.shade500,
|
||||
_iconBtn(
|
||||
Icons.close,
|
||||
color: Colors.grey,
|
||||
onTap: _isSubmitting ? null : _cancelEditPackedItem,
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
] else ...[
|
||||
_iconBtn(
|
||||
Icons.edit,
|
||||
color: Colors.grey.shade700,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () => _startEditPackedItem(item),
|
||||
),
|
||||
_iconBtn(
|
||||
Icons.delete_outline,
|
||||
color: Colors.red,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () {
|
||||
setState(() {
|
||||
_deletingPackedItemId = item.boxItemId;
|
||||
_editingPackedItemId = null;
|
||||
_editingPackedQuantity = '';
|
||||
});
|
||||
},
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
// Quantity / edit input
|
||||
if (editing)
|
||||
SizedBox(
|
||||
width: 52,
|
||||
height: 26,
|
||||
child: TextField(
|
||||
keyboardType: TextInputType.none,
|
||||
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
|
||||
textAlign: TextAlign.center,
|
||||
controller:
|
||||
TextEditingController(text: _editingPackedQuantity)
|
||||
..selection = TextSelection.collapsed(
|
||||
offset: _editingPackedQuantity.length,
|
||||
),
|
||||
onChanged: (value) => _editingPackedQuantity = value,
|
||||
decoration: InputDecoration(
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 4),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.amber,
|
||||
width: 1.5,
|
||||
),
|
||||
),
|
||||
),
|
||||
style: const TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
)
|
||||
else
|
||||
Text(
|
||||
'${item.quantity} / $totalText',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: deleting ? Colors.red : Colors.green.shade700,
|
||||
),
|
||||
),
|
||||
// Action buttons
|
||||
if (editing) ...[
|
||||
_iconBtn(
|
||||
Icons.check,
|
||||
color: Colors.green,
|
||||
onTap: _isSubmitting ? null : () => _savePackedItem(item),
|
||||
),
|
||||
_iconBtn(
|
||||
Icons.close,
|
||||
color: Colors.grey,
|
||||
onTap: _isSubmitting ? null : _cancelEditPackedItem,
|
||||
),
|
||||
] else ...[
|
||||
_iconBtn(
|
||||
Icons.edit,
|
||||
color: Colors.orange.shade700,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () => _startEditPackedItem(item),
|
||||
),
|
||||
_iconBtn(
|
||||
Icons.delete_outline,
|
||||
color: Colors.red,
|
||||
onTap: _isSubmitting
|
||||
? null
|
||||
: () {
|
||||
setState(() {
|
||||
_deletingPackedItemId = item.boxItemId;
|
||||
_editingPackedItemId = null;
|
||||
_editingPackedQuantity = '';
|
||||
});
|
||||
},
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
// Inline delete confirmation
|
||||
if (deleting)
|
||||
Container(
|
||||
padding: const EdgeInsets.only(
|
||||
left: 34,
|
||||
right: 12,
|
||||
top: 2,
|
||||
bottom: 5,
|
||||
),
|
||||
height: 28,
|
||||
padding: const EdgeInsets.only(left: 15, right: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.red.shade50,
|
||||
border: Border(bottom: BorderSide(color: Colors.red.shade200)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Expanded(
|
||||
Expanded(
|
||||
child: Text(
|
||||
'确认删除?',
|
||||
style: TextStyle(
|
||||
style: const TextStyle(
|
||||
fontSize: 12,
|
||||
color: Colors.red,
|
||||
fontWeight: FontWeight.w500,
|
||||
@@ -2735,3 +2718,5 @@ class _BoxingPageState extends State<BoxingPage> with WidgetsBindingObserver {
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const _headerStyle = TextStyle(fontSize: 10, fontWeight: FontWeight.w700);
|
||||
|
||||
Reference in New Issue
Block a user