tboss_oa_module/lib/features/expense/expense_apply_import_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';
import '../../shared/widgets/nav_bar_config.dart';
import '../../core/i18n/app_localizations.dart';
import '../../core/theme/app_colors_extension.dart';
import 'expense_api.dart';

/// 可导入的费用申请明细项
class ImportableItem {
  final String aeNo;
  final String aeDd;
  final String reason;
  final double headAmtnYj;
  final int itm;
  final String sqMan;
  final String sqName;
  final String typeNo;
  final String typeName;
  final double amtnYj;
  final String accNo;
  final String accName;
  final String dep;
  final String depName;
  final String objNo;
  final String objName;
  final String startDd;
  final String endDd;
  final String rem;
  bool selected = false;

  ImportableItem({
    required this.aeNo, required this.aeDd, required this.reason,
    required this.headAmtnYj, required this.itm, required this.sqMan, required this.sqName,
    required this.typeNo, required this.typeName, required this.amtnYj,
    required this.accNo, required this.accName, required this.dep,
    required this.depName, required this.objNo, required this.objName,
    required this.startDd, required this.endDd, required this.rem,
  });

  factory ImportableItem.fromJson(Map<String, dynamic> json) => ImportableItem(
    aeNo: json['aeNo'] as String? ?? '',
    aeDd: _fmtDate(json['aeDd'] as String?),
    reason: json['reason'] as String? ?? '',
    headAmtnYj: (json['headAmtnYj'] as num?)?.toDouble() ?? 0,
    itm: json['itm'] as int? ?? 0,
    sqMan: json['sqMan'] as String? ?? '',
    sqName: json['sqName'] as String? ?? '',
    typeNo: json['typeNo'] as String? ?? '',
    typeName: json['typeName'] as String? ?? '',
    amtnYj: (json['amtnYj'] as num?)?.toDouble() ?? 0,
    accNo: json['accNo'] as String? ?? '',
    accName: json['accName'] as String? ?? '',
    dep: json['dep'] as String? ?? '',
    depName: json['depName'] as String? ?? '',
    objNo: json['objNo'] as String? ?? '',
    objName: json['objName'] as String? ?? '',
    startDd: _fmtDate(json['startDd'] as String?),
    endDd: _fmtDate(json['endDd'] as String?),
    rem: json['rem'] as String? ?? '',
  );

  static String _fmtDate(String? raw) {
    if (raw == null || raw.isEmpty) return '';
    try {
      final d = DateTime.parse(raw);
      return '${d.year}-${d.month.toString().padLeft(2, '0')}-${d.day.toString().padLeft(2, '0')}';
    } catch (_) {
      return raw;
    }
  }
}

class ExpenseApplyImportPage extends ConsumerStatefulWidget {
  const ExpenseApplyImportPage({super.key});

  @override
  ConsumerState<ExpenseApplyImportPage> createState() => _ExpenseApplyImportPageState();
}

class _ExpenseApplyImportPageState extends ConsumerState<ExpenseApplyImportPage> {
  final _aeNoCtrl = TextEditingController();
  final _startDateCtrl = TextEditingController();
  final _endDateCtrl = TextEditingController();
  List<ImportableItem> _items = [];
  bool _loading = false;
  bool _hasMore = true;
  int _page = 1;
  late final ScrollController _scrollCtrl;

  @override
  void initState() {
    super.initState();
    _scrollCtrl = ScrollController()..addListener(_onScroll);
    WidgetsBinding.instance.addPostFrameCallback((_) => _load());
  }

  @override
  void dispose() {
    _aeNoCtrl.dispose(); _startDateCtrl.dispose(); _endDateCtrl.dispose();
    _scrollCtrl.dispose();
    super.dispose();
  }

  void _onScroll() {
    if (_scrollCtrl.position.pixels >= _scrollCtrl.position.maxScrollExtent - 200) {
      _load(append: true);
    }
  }

  Future<void> _load({bool append = false}) async {
    if (_loading) return;
    setState(() => _loading = true);
    try {
      final api = ref.read(expenseApiProvider);
      final result = await api.getImportableExpenseApplies(
        aeNo: _aeNoCtrl.text.trim(),
        startDate: _startDateCtrl.text,
        endDate: _endDateCtrl.text,
        page: append ? _page : 1,
      );
      if (!mounted) return;
      final list = (result['list'] as List<dynamic>?)
          ?.map((e) => ImportableItem.fromJson(e as Map<String, dynamic>))
          .toList() ?? [];
      setState(() {
        if (append) { _items.addAll(list); _page++; } else { _items = list; _page = 2; }
        _loading = false;
        _hasMore = list.length >= 20;
      });
    } catch (_) {
      if (mounted) setState(() => _loading = false);
    }
  }

  void _search() {
    _validateDates();
    if (_startDateCtrl.text.isNotEmpty && _endDateCtrl.text.isNotEmpty && _startDateCtrl.text.compareTo(_endDateCtrl.text) > 0) return;
    _page = 1; _load();
  }

  Future<void> _refresh() async {
    _page = 1;
    await _load();
  }

  void _toggleItem(int idx) {
    setState(() => _items[idx].selected = !_items[idx].selected);
  }

  void _toggleGroup(String aeNo) {
    setState(() {
      final items = _items.where((e) => e.aeNo == aeNo).toList();
      final allSelected = items.every((e) => e.selected);
      final newVal = !allSelected;
      for (final e in items) { e.selected = newVal; }
    });
  }

  bool _isGroupAllSelected(String aeNo) {
    final items = _items.where((e) => e.aeNo == aeNo);
    if (items.isEmpty) return false;
    return items.every((e) => e.selected);
  }

  bool _isGroupAnySelected(String aeNo) {
    return _items.any((e) => e.aeNo == aeNo && e.selected);
  }

  void _confirmImport() {
    final l10n = AppLocalizations.of(context);
    final selected = _items.where((e) => e.selected).toList();
    if (selected.isEmpty) {
      TDToast.showText(l10n.get('pleaseSelect'), context: context);
      return;
    }
    Navigator.of(context).pop(selected);
  }

  void _pickDate(TextEditingController ctrl) {
    final l10n = AppLocalizations.of(context);
    final colors = Theme.of(context).extension<AppColorsExtension>()!;
    final now = DateTime.now();
    TDPicker.showDatePicker(
      context,
      title: l10n.get('selectDate'),
      backgroundColor: colors.bgCard,
      useYear: true, useMonth: true, useDay: true,
      useHour: false, useMinute: false, useSecond: false, useWeekDay: false,
      dateStart: const [2020, 1, 1],
      dateEnd: [now.year + 1, 12, 31],
      initialDate: [now.year, now.month, now.day],
      onConfirm: (selected) {
        final d = '${selected['year']}-${(selected['month'] ?? '').toString().padLeft(2, '0')}-${(selected['day'] ?? '').toString().padLeft(2, '0')}';
        ctrl.text = d;
        setState(() {});
        _validateDates();
      },
    );
  }

  void _validateDates() {
    if (_startDateCtrl.text.isNotEmpty && _endDateCtrl.text.isNotEmpty) {
      if (_startDateCtrl.text.compareTo(_endDateCtrl.text) > 0) {
        TDToast.showText(AppLocalizations.of(context).get('filterDateStartAfterEnd'), context: context);
      }
    }
  }

  Widget _buildSearchBar(AppLocalizations l10n, AppColorsExtension colors) {
    return Container(
      color: colors.bgCard,
      padding: const EdgeInsets.fromLTRB(12, 8, 12, 8),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          _inputRow(
            label: l10n.get('expenseApplyNo'),
            controller: _aeNoCtrl,
            hint: l10n.get('expenseApplyNo'),
            onSubmitted: (_) => _search(),
          ),
          const SizedBox(height: 8),
          Row(children: [
            Expanded(
              child: _pickerRow(
                label: l10n.get('filterStartDate'), value: _startDateCtrl.text,
                hint: l10n.get('filterStartDate'), hasValue: _startDateCtrl.text.isNotEmpty,
                onClear: () { _startDateCtrl.clear(); setState(() {}); },
                onTap: () => _pickDate(_startDateCtrl),
              ),
            ),
            const SizedBox(width: 8),
            Expanded(
              child: _pickerRow(
                label: l10n.get('filterEndDate'), value: _endDateCtrl.text,
                hint: l10n.get('filterEndDate'), hasValue: _endDateCtrl.text.isNotEmpty,
                onClear: () { _endDateCtrl.clear(); setState(() {}); },
                onTap: () => _pickDate(_endDateCtrl),
              ),
            ),
            const SizedBox(width: 8),
            GestureDetector(
              onTap: _search,
              child: Container(
                width: 40, height: 40,
                decoration: BoxDecoration(color: colors.primary, borderRadius: BorderRadius.circular(20)),
                child: const Icon(Icons.search, color: Colors.white, size: 20),
              ),
            ),
          ]),
        ],
      ),
    );
  }

  Widget _inputRow({
    required String label, required TextEditingController controller,
    required String hint, ValueChanged<String>? onSubmitted,
  }) {
    final tdTheme = TDTheme.of(context);
    return Container(
      padding: const EdgeInsets.only(left: 16, right: 10, top: 10, bottom: 10),
      decoration: BoxDecoration(
        color: tdTheme.bgColorContainer,
        borderRadius: BorderRadius.circular(tdTheme.radiusDefault),
        border: Border.all(color: tdTheme.componentStrokeColor),
      ),
      child: Row(children: [
        TDText(label, maxLines: 1, overflow: TextOverflow.visible, font: tdTheme.fontBodyLarge, fontWeight: FontWeight.w400, style: const TextStyle(letterSpacing: 0)),
        const SizedBox(width: 12),
        Expanded(
          child: TextField(
            controller: controller,
            textAlign: TextAlign.end,
            style: TextStyle(fontSize: 16, color: Theme.of(context).extension<AppColorsExtension>()!.textPrimary),
            decoration: InputDecoration(
              hintText: hint,
              hintStyle: TextStyle(fontSize: 16, color: Theme.of(context).extension<AppColorsExtension>()!.textPlaceholder),
              border: InputBorder.none, isDense: true, contentPadding: EdgeInsets.zero,
            ),
            onSubmitted: onSubmitted,
            onChanged: (_) => setState(() {}),
          ),
        ),
        if (controller.text.isNotEmpty) ...[
          const SizedBox(width: 4),
          GestureDetector(
            onTap: () { controller.clear(); setState(() {}); },
            child: Icon(Icons.close, size: 18, color: tdTheme.textColorPlaceholder),
          ),
        ],
      ]),
    );
  }

  Widget _pickerRow({
    required String label,
    required String value,
    required String hint,
    required bool hasValue,
    VoidCallback? onClear,
    VoidCallback? onTap,
    Widget? child,
  }) {
    final tdTheme = TDTheme.of(context);
    final colors = Theme.of(context).extension<AppColorsExtension>()!;
    return GestureDetector(
      onTap: onTap,
      child: Container(
        padding: const EdgeInsets.only(left: 16, right: 10, top: 12, bottom: 12),
        decoration: BoxDecoration(
          color: colors.bgSecondaryContainer,
          borderRadius: BorderRadius.circular(tdTheme.radiusDefault),
          border: Border.all(color: tdTheme.componentStrokeColor),
        ),
        child: child ?? Row(children: [
          TDText(label, maxLines: 1, overflow: TextOverflow.visible, font: tdTheme.fontBodyLarge, fontWeight: FontWeight.w400, style: const TextStyle(letterSpacing: 0)),
          const SizedBox(width: 12),
          Expanded(child: Row(mainAxisAlignment: MainAxisAlignment.end, mainAxisSize: MainAxisSize.max, children: [
            Flexible(child: TDText(value.isNotEmpty ? value : hint, maxLines: 1, overflow: TextOverflow.ellipsis, font: tdTheme.fontBodyLarge, fontWeight: FontWeight.w400,
              textColor: value.isNotEmpty ? tdTheme.textColorPrimary : tdTheme.textColorPlaceholder, textAlign: TextAlign.end)),
            const SizedBox(width: 4),
            if (hasValue)
              GestureDetector(onTap: onClear, child: Icon(Icons.close, size: 18, color: tdTheme.textColorPlaceholder))
            else
              Icon(Icons.chevron_right, size: 18, color: tdTheme.textColorPlaceholder),
          ])),
        ]),
      ),
    );
  }

  Widget _buildSkeleton(AppColorsExtension colors) {
    return ListView.builder(
      itemCount: 5,
      itemBuilder: (ctx, i) => Container(
        margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(color: colors.bgCard, borderRadius: BorderRadius.circular(12)),
        child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          Row(children: [
            _skeletonBox(22, 22, colors),
            const SizedBox(width: 8),
            _skeletonBox(160, 16, colors),
            const Spacer(),
            _skeletonBox(80, 14, colors),
          ]),
          const SizedBox(height: 8),
          _skeletonBox(200, 12, colors),
          const SizedBox(height: 12),
          Divider(height: 1, color: colors.border),
          const SizedBox(height: 8),
          Row(children: [
            _skeletonBox(18, 18, colors),
            const SizedBox(width: 8),
            _skeletonBox(30, 12, colors),
            const SizedBox(width: 8),
            Expanded(child: _skeletonBox(double.infinity, 40, colors)),
          ]),
        ]),
      ),
    );
  }

  Widget _skeletonBox(double w, double h, AppColorsExtension colors) {
    return Container(
      width: w, height: h,
      decoration: BoxDecoration(
        color: colors.bgPage,
        borderRadius: BorderRadius.circular(6),
      ),
    );
  }

  Widget _buildHeaderCheckbox(String aeNo, AppColorsExtension colors) {
    final allSel = _isGroupAllSelected(aeNo);
    final anySel = _isGroupAnySelected(aeNo);
    IconData icon;
    Color iconColor;
    if (allSel) {
      icon = Icons.check_box;
      iconColor = colors.primary;
    } else if (anySel) {
      icon = Icons.indeterminate_check_box;
      iconColor = colors.primary;
    } else {
      icon = Icons.check_box_outline_blank;
      iconColor = colors.textPlaceholder;
    }
    return GestureDetector(
      onTap: () => _toggleGroup(aeNo),
      child: Icon(icon, size: 22, color: iconColor),
    );
  }

  Widget _buildItemCheckbox(int idx, AppColorsExtension colors) {
    final item = _items[idx];
    return GestureDetector(
      onTap: () => _toggleItem(idx),
      child: Icon(
        item.selected ? Icons.check_box : Icons.check_box_outline_blank,
        size: 18,
        color: item.selected ? colors.primary : colors.textPlaceholder,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final l10n = AppLocalizations.of(context);
    final colors = Theme.of(context).extension<AppColorsExtension>()!;
    ref.read(navBarConfigProvider.notifier).update(
      NavBarConfig(title: l10n.get('importExpenseApply'), showBack: true),
    );

    final grouped = <String, List<ImportableItem>>{};
    for (final item in _items) {
      grouped.putIfAbsent(item.aeNo, () => []).add(item);
    }

    return Scaffold(
      backgroundColor: colors.bgPage,
      body: Column(children: [
        _buildSearchBar(l10n, colors),
        Expanded(
          child: RefreshIndicator(
            onRefresh: _refresh,
            child: _loading && _items.isEmpty
              ? _buildSkeleton(colors)
              : _items.isEmpty
                ? ListView(children: [SizedBox(height: MediaQuery.of(context).size.height * 0.3, child: Center(child: Text(l10n.get('noData'), style: TextStyle(fontSize: 14, color: colors.textPlaceholder))))])
                : ListView.builder(
                  controller: _scrollCtrl,
                  itemCount: grouped.length + (_hasMore ? 1 : 0) + (_items.isNotEmpty && !_hasMore ? 1 : 0),
                  itemBuilder: (ctx, i) {
                    if (i >= grouped.length && _hasMore) {
                      if (!_loading) { WidgetsBinding.instance.addPostFrameCallback((_) => _load(append: true)); }
                      return const Center(child: Padding(padding: EdgeInsets.all(16), child: TDLoading(size: TDLoadingSize.medium, icon: TDLoadingIcon.activity)));
                    }
                    if (i >= grouped.length) {
                      return Center(child: Padding(padding: const EdgeInsets.all(16), child: Text(l10n.get('noMoreData'), style: TextStyle(fontSize: 13, color: colors.textPlaceholder))));
                    }
                    final aeNo = grouped.keys.elementAt(i);
                    final items = grouped[aeNo]!;
                    return Container(
                      margin: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
                      decoration: BoxDecoration(
                        color: colors.bgCard,
                        borderRadius: BorderRadius.circular(12),
                      ),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          // Header row: 点击整行切换全选
                          GestureDetector(
                            behavior: HitTestBehavior.opaque,
                            onTap: () => _toggleGroup(aeNo),
                            child: Padding(
                              padding: const EdgeInsets.fromLTRB(16, 12, 16, 8),
                              child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
                                Row(children: [
                                  _buildHeaderCheckbox(aeNo, colors),
                                  const SizedBox(width: 8),
                                  Expanded(child: Text(aeNo, style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.textPrimary))),
                                  Text(items.first.aeDd, style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                ]),
                                if (items.first.reason.isNotEmpty)
                                  Padding(
                                    padding: const EdgeInsets.only(top: 4, left: 30),
                                    child: Text(items.first.reason, maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                  ),
                              ]),
                            ),
                          ),
                          Divider(height: 1, color: colors.border),
                          // Detail rows: 点击整行切换勾选
                          ...items.asMap().entries.map((entry) {
                            final idx = _items.indexOf(entry.value);
                            final d = entry.value;
                            return GestureDetector(
                              behavior: HitTestBehavior.opaque,
                              onTap: () => _toggleItem(idx),
                              child: Padding(
                                padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
                                child: Row(children: [
                                  SizedBox(width: 30, child: _buildItemCheckbox(idx, colors)),
                                  const SizedBox(width: 4),
                                  Container(width: 24, alignment: Alignment.center, child: Text('#${d.itm}', style: TextStyle(fontSize: 13, fontWeight: FontWeight.w500, color: colors.textSecondary))),
                                  const SizedBox(width: 8),
                                  Expanded(
                                    child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
                                      Text('${d.typeName.isNotEmpty ? '${d.typeNo}/${d.typeName}' : d.typeNo}  ${d.accName}', style: TextStyle(fontSize: 14, color: colors.textPrimary)),
                                      const SizedBox(height: 3),
                                      if (d.sqMan.isNotEmpty)
                                        Padding(
                                          padding: const EdgeInsets.only(bottom: 2),
                                          child: Text('${l10n.get('applicant')}: ${d.sqName.isNotEmpty ? '${d.sqMan}/${d.sqName}' : d.sqMan}', style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                        ),
                                      Padding(
                                        padding: const EdgeInsets.only(bottom: 2),
                                        child: Text('${l10n.get('acctSubject')}: ${d.accNo}/${d.accName}', style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                      ),
                                      if (d.depName.isNotEmpty)
                                        Padding(
                                          padding: const EdgeInsets.only(bottom: 2),
                                          child: Text('${l10n.get('dept')}: ${d.dep}/${d.depName}', style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                        ),
                                      if (d.objName.isNotEmpty)
                                        Padding(
                                          padding: const EdgeInsets.only(bottom: 2),
                                          child: Text('${l10n.get('project')}: ${d.objNo}/${d.objName}', style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                        ),
                                      if (d.startDd.isNotEmpty || d.endDd.isNotEmpty)
                                        Text('${l10n.get('date')}: ${d.startDd} ~ ${d.endDd}', style: TextStyle(fontSize: 13, color: colors.textSecondary)),
                                    ]),
                                  ),
                                  Text('¥${d.amtnYj.toStringAsFixed(2)}', style: TextStyle(fontSize: 15, fontWeight: FontWeight.w600, color: colors.amountPrimary)),
                                ]),
                              ),
                            );
                          }),
                          if (items.length > 1)
                            Padding(
                              padding: const EdgeInsets.fromLTRB(0, 4, 16, 12),
                              child: Row(mainAxisAlignment: MainAxisAlignment.end, children: [
                                Text('${l10n.get('total')} ${items.length} ${l10n.get('unitItem')}', style: TextStyle(fontSize: 12, color: colors.textSecondary)),
                              ]),
                            )
                          else
                            const SizedBox(height: 8),
                        ],
                      ),
                    );
                  },
                ),
          ),
        ),
      ]),
      bottomNavigationBar: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(12),
          child: TDButton(
            text: l10n.get('confirmImport'),
            size: TDButtonSize.large,
            theme: TDButtonTheme.primary,
            onTap: _confirmImport,
          ),
        ),
      ),
    );
  }
}