import 'package:flutter/material.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';
import '../../../core/i18n/app_localizations.dart';
import '../../../core/theme/app_colors_extension.dart';
import '../../../core/utils/date_utils.dart' as du;
import '../expense_apply_model.dart';
import '../../../core/utils/amount_utils.dart';

/// 查看费用明细弹窗（只读）。
///
/// 使用 [TDSlidePopupRoute] 从底部滑出，展示所有明细字段。
class ExpenseApplyDetailViewDialog extends StatelessWidget {
  final ExpenseApplyDetailModel detail;
  final AppLocalizations l10n;

  const ExpenseApplyDetailViewDialog({
    super.key,
    required this.detail,
    required this.l10n,
  });

  /// 显示弹窗。
  static void show(BuildContext context, ExpenseApplyDetailModel detail) {
    final l10n = AppLocalizations.of(context);
    FocusScope.of(context).unfocus();
    Navigator.push(
      context,
      TDSlidePopupRoute<void>(
        slideTransitionFrom: SlideTransitionFrom.bottom,
        isDismissible: true,
        builder: (_) =>
            ExpenseApplyDetailViewDialog(detail: detail, l10n: l10n),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final colors = Theme.of(context).extension<AppColorsExtension>()!;
    final d = detail;

    final catLabel = d.categoryName.isNotEmpty
        ? '${d.expenseCategory}/${d.categoryName}'
        : d.expenseCategory;

    return ConstrainedBox(
      constraints: BoxConstraints(
        maxHeight: MediaQuery.of(context).size.height * 0.8,
      ),
      child: Container(
        decoration: BoxDecoration(
          color: colors.bgCard,
          borderRadius: const BorderRadius.vertical(top: Radius.circular(16)),
        ),
        child: SafeArea(
          top: false,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              // 标题栏
              Padding(
                padding: const EdgeInsets.fromLTRB(20, 20, 12, 8),
                child: Row(
                  children: [
                    const SizedBox(width: 24),
                    Expanded(
                      child: Center(
                        child: Text(
                          l10n.get('expenseDetails'),
                          style: const TextStyle(
                            fontSize: 18,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                      ),
                    ),
                    GestureDetector(
                      onTap: () => Navigator.pop(context),
                      child: Icon(Icons.close, color: colors.textSecondary),
                    ),
                  ],
                ),
              ),
              // 内容
              Flexible(
                child: SingleChildScrollView(
                  padding: const EdgeInsets.all(20),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      _row(l10n.get('expenseCategory'), catLabel, colors),
                      _row(
                        l10n.get('estimatedAmount'),
                        formatAmount(d.estimatedAmount),
                        colors,
                      ),
                      _row(
                        l10n.get('acctSubject'),
                        d.acctSubjectId.isNotEmpty
                            ? '${d.acctSubjectId}${d.acctSubjectName.isNotEmpty ? '/${d.acctSubjectName}' : ''}'
                            : '-',
                        colors,
                      ),
                      _row(
                        l10n.get('applicant'),
                        d.sqMan.isNotEmpty
                            ? '${d.sqMan}${d.sqName.isNotEmpty ? '/${d.sqName}' : ''}'
                            : '-',
                        colors,
                      ),
                      _row(
                        l10n.get('project'),
                        d.projectId.isNotEmpty
                            ? '${d.projectId}${d.projectName.isNotEmpty ? '/${d.projectName}' : ''}'
                            : '-',
                        colors,
                      ),
                      _row(
                        l10n.get('costDept'),
                        d.costDeptId.isNotEmpty
                            ? '${d.costDeptId}${d.costDeptName.isNotEmpty ? '/${d.costDeptName}' : ''}'
                            : '-',
                        colors,
                      ),
                      _row(
                        l10n.get('estimatedDate'),
                        d.estimatedStartDate != null
                            ? '${du.DateUtils.formatDate(d.estimatedStartDate!)}${d.estimatedEndDate != null ? ' ~ ${du.DateUtils.formatDate(d.estimatedEndDate!)}' : ''}'
                            : '-',
                        colors,
                      ),
                      _row(
                        l10n.get('expenseNo'),
                        d.bxNo.isNotEmpty ? d.bxNo : '-',
                        colors,
                      ),
                      _row(
                        l10n.get('remark'),
                        d.remark.isNotEmpty ? d.remark : '-',
                        colors,
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _row(String label, String value, AppColorsExtension colors) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 16),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 100,
            child: Text(
              label,
              style: TextStyle(fontSize: 14, color: colors.textSecondary),
            ),
          ),
          const SizedBox(width: 12),
          Expanded(child: Text(value, style: const TextStyle(fontSize: 14))),
        ],
      ),
    );
  }
}
