import 'dart:typed_data'; import 'package:flutter/material.dart'; import 'package:tdesign_flutter/tdesign_flutter.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:go_router/go_router.dart'; import '../../shared/widgets/nav_bar_config.dart'; import '../../shared/widgets/loading_dialog.dart'; import '../../core/utils/date_utils.dart' as du; import '../../shared/widgets/form_section.dart'; import '../../shared/widgets/form_field_row.dart'; import 'expense_model.dart'; import '../../core/i18n/app_localizations.dart'; import '../../shared/models/bill_attachment.dart'; import '../../core/theme/app_colors.dart'; import '../../core/theme/app_colors_extension.dart'; import 'expense_api.dart'; import 'dart:io'; import 'package:path_provider/path_provider.dart'; import 'package:open_filex/open_filex.dart'; import '../expense_apply/widgets/attachment_preview_page.dart'; class ExpenseDetailPage extends ConsumerStatefulWidget { final String billNo; final int queryId; const ExpenseDetailPage({super.key, required this.billNo, this.queryId = 0}); @override ConsumerState createState() => _ExpenseDetailPageState(); } class _ExpenseDetailPageState extends ConsumerState with WidgetsBindingObserver { ExpenseModel? _expense; List _attachments = []; bool _attachAvailable = false; bool _isLoading = true; String? _error; @override void initState() { super.initState(); WidgetsBinding.instance.addObserver(this); _loadData(); } @override void dispose() { WidgetsBinding.instance.removeObserver(this); super.dispose(); } bool _openingFile = false; @override void didChangeAppLifecycleState(AppLifecycleState state) { if (state == AppLifecycleState.resumed) { if (_openingFile) { _openingFile = false; return; } _attachments = []; _attachAvailable = false; _loadData(); } } Future _loadData() async { setState(() { _isLoading = true; _error = null; }); try { final api = ref.read(expenseApiProvider); // 1. 加载报销详情(主表 + 明细) final expense = await api.fetchDetail(widget.billNo); setState(() => _expense = expense); // 2. 加载附件(非致命) try { _attachAvailable = await api.checkAttachHealth(); } catch (_) { _attachAvailable = false; } if (_attachAvailable) { try { _attachments = await api.getAttachments('BX', widget.billNo); } catch (_) { _attachments = []; } } } catch (e) { setState(() => _error = e.toString()); } finally { setState(() => _isLoading = false); } } @override Widget build(BuildContext context) { final colors = Theme.of(context).extension()!; final l10n = AppLocalizations.of(context); setNavBarTitle(context, ref, NavBarConfig( title: l10n.get('expenseDetail'), showBack: true, onBack: () => context.pop(), )); if (_isLoading) { return const Center( child: TDLoading( size: TDLoadingSize.large, icon: TDLoadingIcon.activity, ), ); } if (_error != null) { return Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Icon(Icons.error_outline, size: 48, color: colors.danger), const SizedBox(height: 12), Text( _error!, style: TextStyle(fontSize: AppFontSizes.body, color: colors.danger), textAlign: TextAlign.center, ), const SizedBox(height: 16), TDButton( text: l10n.get('retry'), theme: TDButtonTheme.primary, onTap: _loadData, ), ], ), ); } final expense = _expense!; return Expanded( child: SingleChildScrollView( physics: const AlwaysScrollableScrollPhysics(), padding: const EdgeInsets.all(16), child: Column( children: [ _buildBasicInfoSection(expense, l10n, colors), const SizedBox(height: 16), _buildExpenseDetailSection(expense, l10n, colors), const SizedBox(height: 16), _buildAttachmentSection(l10n, colors), const SizedBox(height: 24), _buildPageFooter(colors), ], ), ), ); } // ═══ 基本信息 ═══ Widget _buildBasicInfoSection( ExpenseModel expense, AppLocalizations l10n, AppColorsExtension colors) { return FormSection( title: l10n.get('basicInfo'), leadingIcon: Icons.info_outline, children: [ FormFieldRow( label: l10n.get('expenseNo'), value: expense.expenseNo, readOnly: true, showArrow: false), const SizedBox(height: 16), FormFieldRow( label: l10n.get('voucherNo'), value: expense.voucherNo.isNotEmpty ? expense.voucherNo : '-', readOnly: true, showArrow: false), const SizedBox(height: 16), FormFieldRow( label: l10n.get('expensePersonnel'), value: expense.applicantId.isNotEmpty ? '${expense.applicantId}/${expense.applicantName}' : expense.applicantName, readOnly: true, showArrow: false), const SizedBox(height: 16), FormFieldRow( label: l10n.get('expenseDept'), value: expense.deptId.isNotEmpty ? '${expense.deptId}/${expense.deptName}' : expense.deptName, readOnly: true, showArrow: false), const SizedBox(height: 16), FormFieldRow( label: l10n.get('date'), value: du.DateUtils.formatDateTime(expense.createTime), readOnly: true, showArrow: false), const SizedBox(height: 16), FormFieldRow( label: l10n.get('currency'), value: expense.currencyCode.isNotEmpty ? expense.currencyCode : '-', readOnly: true, showArrow: false), const SizedBox(height: 16), SizedBox( height: 24, child: Row(crossAxisAlignment: CrossAxisAlignment.center, children: [ Text(l10n.get('feeReason'), style: TextStyle(fontSize: AppFontSizes.subtitle, color: colors.textSecondary)), const SizedBox(width: 8), Expanded( child: Text(expense.purpose.isNotEmpty ? expense.purpose : '-', textAlign: TextAlign.end, maxLines: 2, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.subtitle, fontWeight: FontWeight.w500, color: colors.textPrimary)), ), ]), ), const SizedBox(height: 16), FormFieldRow( label: l10n.get('paymentMethod'), value: expense.paymentMethod.isNotEmpty ? expense.paymentMethod : '-', readOnly: true, showArrow: false), const SizedBox(height: 16), SizedBox( height: 24, child: Row(crossAxisAlignment: CrossAxisAlignment.center, children: [ Text(l10n.get('remark'), style: TextStyle(fontSize: AppFontSizes.subtitle, color: colors.textSecondary)), const SizedBox(width: 8), Expanded( child: Text(expense.remark.isNotEmpty ? expense.remark : '-', textAlign: TextAlign.end, maxLines: 2, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.subtitle, fontWeight: FontWeight.w500, color: colors.textPrimary)), ), ]), ), ], ); } // ═══ 费用明细 ═══ Widget _buildExpenseDetailSection( ExpenseModel expense, AppLocalizations l10n, AppColorsExtension colors) { final totalAmount = expense.details.fold( 0, (sum, d) => sum + d.totalAmount, ); final totalApproved = expense.details.fold( 0, (sum, d) => sum + d.approvedAmount, ); return FormSection( title: l10n.get('expenseDetails'), leadingIcon: Icons.receipt_long_outlined, children: [ if (expense.details.isEmpty) Padding( padding: const EdgeInsets.symmetric(vertical: 8), child: Text(l10n.get('noDetailData'), style: TextStyle(fontSize: AppFontSizes.body, color: colors.textPlaceholder)), ) else ...expense.details.asMap().entries.map((e) { final d = e.value; final title = d.categoryName.isNotEmpty ? '${d.expenseCategory}/${d.categoryName}' : (d.remark.isNotEmpty ? d.remark : (d.acctSubjectId.isNotEmpty ? d.acctSubjectId : '--')); return Container( margin: const EdgeInsets.symmetric(vertical: 6), padding: const EdgeInsets.all(12), decoration: BoxDecoration(color: colors.bgPage, borderRadius: BorderRadius.circular(8)), child: Row( children: [ Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ Expanded( child: Text(title, style: TextStyle(fontSize: AppFontSizes.body, fontWeight: FontWeight.w500, color: colors.textPrimary)), ), Column( crossAxisAlignment: CrossAxisAlignment.end, children: [ Text('¥${d.totalAmount.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.body, fontWeight: FontWeight.w600, color: colors.amountPrimary)), if (d.approvedAmount > 0) Text('¥${d.approvedAmount.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.body, fontWeight: FontWeight.w600, color: colors.success)), ], ), ], ), const SizedBox(height: 2), Text('${l10n.get('amountExcludingTax')}: ¥${d.amount.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.taxAmount > 0) Text('${l10n.get('taxAmount')}: ¥${d.taxAmount.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.approvedAmount > 0) Text('${l10n.get('approvedAmount')}: ¥${d.approvedAmount.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.caption, fontWeight: FontWeight.w500, color: colors.success)), if (d.acctSubjectName.isNotEmpty) Text('${l10n.get('acctSubject')}: ${d.acctSubjectId}/${d.acctSubjectName}', maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.aeNo.isNotEmpty) Text('${l10n.get('expenseApplyNo')}: ${d.aeNo}', maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.aeDd.isNotEmpty) Text('${l10n.get('applyDate')}: ${d.aeDd}', style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.projectName.isNotEmpty) Text('${l10n.get('project')}: ${d.projectId}/${d.projectName}', maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.costDeptName.isNotEmpty) Text('${l10n.get('dept')}: ${d.costDeptId}/${d.costDeptName}', maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.customerVendorName.isNotEmpty) Text('${l10n.get('customerVendor')}: ${d.customerVendorName}', maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), if (d.remark.isNotEmpty) Text(d.remark, maxLines: 2, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textSecondary)), ], ), ), ], ), ); }), if (expense.details.isNotEmpty) ...[ const SizedBox(height: 8), Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text(l10n.get('total'), style: TextStyle(fontSize: AppFontSizes.body, fontWeight: FontWeight.w600, color: colors.textPrimary)), Column( crossAxisAlignment: CrossAxisAlignment.end, children: [ Text('¥${totalAmount.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.subtitle, fontWeight: FontWeight.w700, color: colors.amountPrimary)), if (totalApproved > 0) Text('${l10n.get('approvedAmount')} ¥${totalApproved.toStringAsFixed(2)}', style: TextStyle(fontSize: AppFontSizes.caption, fontWeight: FontWeight.w600, color: colors.success)), ], ), ]), ], ], ); } // ═══ 附件 ═══ Widget _buildAttachmentSection(AppLocalizations l10n, AppColorsExtension colors) { if (!_attachAvailable) { return FormSection( title: l10n.get('attachments'), leadingIcon: Icons.attach_file_outlined, children: [Text(l10n.get('attachServiceUnavailable'), style: TextStyle(fontSize: AppFontSizes.body, color: colors.textPlaceholder))], ); } final headerAtts = _attachments.where((a) => a.isHeader).toList(); final bodyGroups = >{}; for (final a in _attachments.where((a) => a.isBody)) { bodyGroups.putIfAbsent(a.srcItm, () => []).add(a); } final children = []; if (_attachments.isEmpty) { children.add(Text(l10n.get('noAttachment'), style: TextStyle(fontSize: AppFontSizes.body, color: colors.textPlaceholder))); } else { // 表头附件 if (headerAtts.isNotEmpty) { children.add(Padding( padding: const EdgeInsets.only(bottom: 8), child: Text(l10n.get('headerAttachments'), style: TextStyle(fontSize: AppFontSizes.caption, fontWeight: FontWeight.w600, color: colors.textSecondary)), )); for (final a in headerAtts) { children.add(_buildAttachmentRow(a, colors)); } } // 表身附件(按明细行分组) for (final entry in bodyGroups.entries) { children.add(const SizedBox(height: 8)); children.add(Padding( padding: const EdgeInsets.only(bottom: 8), child: Text('${l10n.get('detailLine')} ${entry.key}', style: TextStyle(fontSize: AppFontSizes.caption, fontWeight: FontWeight.w600, color: colors.textSecondary)), )); for (final a in entry.value) { children.add(_buildAttachmentRow(a, colors)); } } } return FormSection( title: l10n.get('attachments'), leadingIcon: Icons.attach_file_outlined, children: children, ); } Widget _buildAttachmentRow(BillAttachment a, AppColorsExtension colors) { final isImage = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].contains(a.ext.toLowerCase()); return GestureDetector( onTap: () => _openAttachment(a), child: Container( margin: const EdgeInsets.symmetric(vertical: 4), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8), decoration: BoxDecoration( color: colors.bgPage, borderRadius: BorderRadius.circular(8), ), child: Row(children: [ if (isImage) _ExpAttachmentThumbnail(api: ref.read(expenseApiProvider), attachment: a, size: 40) else Icon(_fileTypeIcon(a.ext), size: 40, color: colors.primary), const SizedBox(width: 10), Expanded( child: Text(a.fileName, maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: AppFontSizes.body, color: colors.textPrimary)), ), ]), ), ); } Future _openAttachment(BillAttachment a) async { final l10n = AppLocalizations.of(context); final ext = a.ext.toLowerCase(); final isImage = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].contains(ext); if (isImage) { // 图片 → 弹窗预览,内部自动下载并显示 loading final api = ref.read(expenseApiProvider); AttachmentPreview.show(context, loader: api.downloadAttachment(a.id), fileName: a.fileName, loadingText: l10n.get('loading'), ); return; } // 非图片 → 下载后调用系统工具打开 try { LoadingDialog.show(context, text: l10n.get('downloading')); final api = ref.read(expenseApiProvider); final bytes = await api.downloadAttachment(a.id); if (!mounted) return; LoadingDialog.hide(context); if (bytes == null) { TDToast.showText(l10n.get('downloadFailed'), context: context); return; } final dir = await getTemporaryDirectory(); final file = File('${dir.path}/${a.fileName}'); await file.writeAsBytes(bytes); _openingFile = true; await OpenFilex.open(file.path); } catch (_) { if (mounted) LoadingDialog.hide(context); if (mounted) TDToast.showText(l10n.get('openFailed'), context: context); } } IconData _fileTypeIcon(String ext) { switch (ext.toLowerCase()) { case 'pdf': return Icons.picture_as_pdf; case 'doc': case 'docx': return Icons.description; case 'xls': case 'xlsx': return Icons.table_chart; case 'jpg': case 'jpeg': case 'png': case 'gif': case 'bmp': return Icons.image_outlined; default: return Icons.insert_drive_file; } } Widget _buildPageFooter(AppColorsExtension colors) { final l10n = AppLocalizations.of(context); return Center( child: Padding( padding: const EdgeInsets.only(bottom: 16), child: Row( mainAxisSize: MainAxisSize.min, children: [ Icon(Icons.rocket_launch_outlined, size: 16, color: colors.textPlaceholder), const SizedBox(width: 6), Text(l10n.get('pageFooter'), style: TextStyle(fontSize: AppFontSizes.caption, color: colors.textPlaceholder)), ], ), ), ); } } /// 附件缩略图 — 自动调用 DownloadAttachment 加载图片 class _ExpAttachmentThumbnail extends StatefulWidget { final ExpenseApi api; final BillAttachment attachment; final double size; const _ExpAttachmentThumbnail({required this.api, required this.attachment, required this.size}); @override State<_ExpAttachmentThumbnail> createState() => _ExpAttachmentThumbnailState(); } class _ExpAttachmentThumbnailState extends State<_ExpAttachmentThumbnail> { Uint8List? _bytes; bool _loading = true; @override void initState() { super.initState(); _load(); } Future _load() async { try { final bytes = await widget.api.downloadAttachment(widget.attachment.id); if (mounted) setState(() { _bytes = bytes; _loading = false; }); } catch (_) { if (mounted) setState(() => _loading = false); } } @override Widget build(BuildContext context) { if (_loading) { return SizedBox(width: widget.size, height: widget.size, child: const Center(child: SizedBox(width: 16, height: 16, child: CircularProgressIndicator(strokeWidth: 2)))); } if (_bytes != null) { return ClipRRect( borderRadius: BorderRadius.circular(4), child: Image.memory(_bytes!, width: widget.size, height: widget.size, fit: BoxFit.cover), ); } return Icon(Icons.broken_image, size: widget.size * 0.6, color: Colors.grey); } }