Files
jiu/client/lib/widgets/data_table_card.dart
T
wangjia 393e227de5 feat: 商品详情页、XLS导入修复、分页选择器、导出功能
后端:
- 新增 product_images 表,支持每商品最多5张图(服务端压缩至1200px/JPEG85%)
- products 表新增 public_id(UUID)、description 字段
- 新增商品详情接口、二维码接口、公开商品接口(无鉴权)
- 修复 XLS 导入:OLE2 magic bytes 检测 + 临时文件解析,兼容 extrame/xls
- 修复商品/名称/系列/规格三张表导入数据为0(LastCol()=0 bug)
- 所有导入接口返回 total/imported/skipped 统计
- config 新增 StorageConfig,支持 STORAGE_* 环境变量覆盖
- 种子数据修复:products 补 public_id、新增 product_images TRUNCATE、schema.sql 表名修正

前端:
- 商品详情页:图片上传/删除、描述内联编辑、二维码弹窗、公开链接复制
- 公开商品页:无鉴权路由 /product/:public_id,Flutter Web SPA
- 商品详情列表(批次追踪)商品名超链接跳转详情页
- 导航「商品管理」改名「商品详情」
- 所有列表表格新增每页条数选择(10/20/50/100)
- 表格列头内嵌筛选(FilterableColumnHeader)
- 导出 Excel 功能(入库/出库/库存/财务/批次/往来单位)
- 网络恢复自动刷新 + 离线缓存展示

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-27 00:29:51 +08:00

231 lines
7.5 KiB
Dart

import 'package:flutter/material.dart';
import '../core/theme/app_theme.dart';
class DataTableCard extends StatefulWidget {
final List<DataColumn> columns;
final List<DataRow> rows;
final Widget? toolbar;
final int? totalCount;
final int page;
final int pageSize;
final ValueChanged<int>? onPageChanged;
final ValueChanged<int>? onPageSizeChanged;
const DataTableCard({
super.key,
required this.columns,
required this.rows,
this.toolbar,
this.totalCount,
this.page = 1,
this.pageSize = 20,
this.onPageChanged,
this.onPageSizeChanged,
});
@override
State<DataTableCard> createState() => _DataTableCardState();
}
class _DataTableCardState extends State<DataTableCard> {
// 当前悬停行的索引(-1 表示无悬停)
final _hoveredRow = ValueNotifier<int>(-1);
@override
void dispose() {
_hoveredRow.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Column(
children: [
if (widget.toolbar != null)
Container(
color: AppTheme.surface,
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
child: widget.toolbar!,
),
if (widget.toolbar != null) const Divider(height: 1),
Expanded(
child: LayoutBuilder(
builder: (context, constraints) => SingleChildScrollView(
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: ConstrainedBox(
constraints: BoxConstraints(minWidth: constraints.maxWidth),
child: Table(
defaultColumnWidth: const IntrinsicColumnWidth(),
border: TableBorder(
horizontalInside: BorderSide(
color: Colors.grey.shade200,
width: 0.5,
),
),
children: [
_buildHeaderRow(),
for (int i = 0; i < widget.rows.length; i++)
_buildDataRow(i, widget.rows[i]),
],
),
),
),
),
),
),
// Pagination
if (widget.totalCount != null)
Container(
height: 48,
color: AppTheme.surface,
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: [
Text(
'${widget.totalCount} 条记录',
style: const TextStyle(
fontSize: 13, color: AppTheme.textSecondary),
),
const Spacer(),
_PaginationBar(
page: widget.page,
total: widget.totalCount!,
pageSize: widget.pageSize,
onPageChanged: widget.onPageChanged,
onPageSizeChanged: widget.onPageSizeChanged,
),
],
),
),
],
);
}
TableRow _buildHeaderRow() {
return TableRow(
decoration: const BoxDecoration(color: Color(0xFFF0F4FF)),
children: widget.columns.map((col) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
child: DefaultTextStyle(
style: const TextStyle(
fontSize: 13,
fontWeight: FontWeight.w600,
color: AppTheme.primaryDark,
),
child: col.numeric
? Align(alignment: Alignment.centerRight, child: col.label)
: col.label,
),
);
}).toList(),
);
}
TableRow _buildDataRow(int rowIndex, DataRow row) {
return TableRow(
children: List.generate(row.cells.length, (colIndex) {
final cell = row.cells[colIndex];
final col = widget.columns[colIndex];
return MouseRegion(
onEnter: (_) => _hoveredRow.value = rowIndex,
onExit: (_) {
if (_hoveredRow.value == rowIndex) _hoveredRow.value = -1;
},
child: ValueListenableBuilder<int>(
valueListenable: _hoveredRow,
builder: (context, hovered, _) => Container(
constraints: const BoxConstraints(minHeight: 48),
alignment:
col.numeric ? Alignment.centerRight : Alignment.centerLeft,
color: hovered == rowIndex ? const Color(0xFFF5F7FF) : null,
padding:
const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
child: DefaultTextStyle(
style: const TextStyle(
fontSize: 13, color: AppTheme.textPrimary),
child: cell.child,
),
),
),
);
}),
);
}
}
class _PaginationBar extends StatelessWidget {
final int page;
final int total;
final int pageSize;
final ValueChanged<int>? onPageChanged;
final ValueChanged<int>? onPageSizeChanged;
static const _pageSizeOptions = [10, 20, 50, 100];
const _PaginationBar({
required this.page,
required this.total,
required this.pageSize,
this.onPageChanged,
this.onPageSizeChanged,
});
@override
Widget build(BuildContext context) {
final totalPages = (total / pageSize).ceil().clamp(1, 9999);
// 确保当前 pageSize 在选项中(如默认值 50 不在列表时仍能显示)
final effectiveSize = _pageSizeOptions.contains(pageSize) ? pageSize : _pageSizeOptions.first;
return Row(
children: [
// 每页条数选择器
if (onPageSizeChanged != null) ...[
const Text('每页', style: TextStyle(fontSize: 13, color: AppTheme.textSecondary)),
const SizedBox(width: 4),
DropdownButtonHideUnderline(
child: DropdownButton<int>(
value: effectiveSize,
isDense: true,
style: const TextStyle(fontSize: 13, color: AppTheme.textPrimary),
items: _pageSizeOptions
.map((n) => DropdownMenuItem(value: n, child: Text('$n')))
.toList(),
onChanged: (v) {
if (v != null) onPageSizeChanged!(v);
},
),
),
const SizedBox(width: 16),
],
// 翻页控件
IconButton(
icon: const Icon(Icons.first_page, size: 18),
onPressed: page > 1 ? () => onPageChanged?.call(1) : null,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 28, minHeight: 28),
),
IconButton(
icon: const Icon(Icons.chevron_left, size: 18),
onPressed: page > 1 ? () => onPageChanged?.call(page - 1) : null,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 28, minHeight: 28),
),
Text('$page / $totalPages', style: const TextStyle(fontSize: 13)),
IconButton(
icon: const Icon(Icons.chevron_right, size: 18),
onPressed: page < totalPages ? () => onPageChanged?.call(page + 1) : null,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 28, minHeight: 28),
),
IconButton(
icon: const Icon(Icons.last_page, size: 18),
onPressed: page < totalPages ? () => onPageChanged?.call(totalPages) : null,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(minWidth: 28, minHeight: 28),
),
],
);
}
}