import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:kooltab2/models/closed_tab.dart';
import 'package:kooltab2/models/closed_tab_item.dart';
import 'package:kooltab2/models/payment_method.dart';

class ClosedTabCard extends StatefulWidget {
  final ClosedTab closedTab;

  const ClosedTabCard({super.key, required this.closedTab});

  @override
  State<ClosedTabCard> createState() => _ClosedTabCardState();
}

class _ClosedTabCardState extends State<ClosedTabCard> {
  bool _expanded = false;

  IconData _paymentIcon(PaymentMethod method) {
    return switch (method) {
      PaymentMethod.payconiq => Icons.qr_code_rounded,
      PaymentMethod.cash => Icons.money_rounded,
    };
  }

  @override
  Widget build(BuildContext context) {
    final closedTab = widget.closedTab;
    final dateFormat = DateFormat('MMM d, y · h:mm a');
    final scheme = Theme.of(context).colorScheme;

    return Container(
      decoration: BoxDecoration(
        color: scheme.onSurface.withValues(alpha: 0.04),
        borderRadius: BorderRadius.circular(14),
        border: Border.all(color: scheme.onSurface.withValues(alpha: 0.06)),
      ),
      clipBehavior: Clip.antiAlias,
      child: Material(
        color: Colors.transparent,
        child: InkWell(
          onTap: () => setState(() => _expanded = !_expanded),
          enableFeedback: true,
          splashFactory: NoSplash.splashFactory,

          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Padding(
                padding: const EdgeInsets.symmetric(
                  horizontal: 16,
                  vertical: 14,
                ),
                child: Row(
                  children: [
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            children: [
                              Expanded(
                                child: Text(
                                  closedTab.customerName,
                                  maxLines: 1,
                                  overflow: TextOverflow.ellipsis,
                                  style: TextStyle(
                                    fontSize: 16,
                                    fontWeight: FontWeight.w800,
                                    color: scheme.onSurface,
                                  ),
                                ),
                              ),
                              const SizedBox(width: 8),
                              Container(
                                padding: const EdgeInsets.symmetric(
                                  horizontal: 8,
                                  vertical: 3,
                                ),
                                decoration: BoxDecoration(
                                  color: scheme.primary.withValues(alpha: 0.1),
                                  borderRadius: BorderRadius.circular(999),
                                ),
                                child: Row(
                                  mainAxisSize: MainAxisSize.min,
                                  children: [
                                    Icon(
                                      _paymentIcon(closedTab.paymentMethod),
                                      size: 13,
                                      color: scheme.primary,
                                    ),
                                    const SizedBox(width: 4),
                                    Text(
                                      closedTab.formattedPaymentMethod,
                                      style: TextStyle(
                                        fontSize: 11,
                                        fontWeight: FontWeight.w700,
                                        color: scheme.primary,
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                          const SizedBox(height: 2),
                          Text(
                            '${dateFormat.format(closedTab.closedAt)} · ${closedTab.itemCount} items',
                            style: Theme.of(context).textTheme.bodySmall,
                          ),
                        ],
                      ),
                    ),
                    const SizedBox(width: 8),
                    Text(
                      closedTab.formattedTotal,
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.w800,
                        color: scheme.onSurface,
                      ),
                    ),
                    const SizedBox(width: 4),
                    Icon(
                      _expanded
                          ? Icons.expand_less_rounded
                          : Icons.expand_more_rounded,
                      color: scheme.onSurface.withValues(alpha: 0.5),
                    ),
                  ],
                ),
              ),
              AnimatedCrossFade(
                duration: const Duration(milliseconds: 150),
                crossFadeState: _expanded
                    ? CrossFadeState.showFirst
                    : CrossFadeState.showSecond,
                firstChild: Padding(
                  padding: const EdgeInsets.fromLTRB(16, 0, 16, 14),
                  child: Column(
                    children: [
                      const Divider(height: 1),
                      const SizedBox(height: 8),
                      ...closedTab.items.map(
                        (item) => _ClosedTabItemRow(item: item),
                      ),
                    ],
                  ),
                ),
                secondChild: const SizedBox(width: double.infinity),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class _ClosedTabItemRow extends StatelessWidget {
  final ClosedTabItem item;

  const _ClosedTabItemRow({required this.item});

  @override
  Widget build(BuildContext context) {
    final unitPrice = NumberFormat.simpleCurrency().format(
      item.unitPriceInCents / 100,
    );
    final lineTotal = NumberFormat.simpleCurrency().format(
      item.lineTotalInCents / 100,
    );
    final scheme = Theme.of(context).colorScheme;

    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 6),
      child: Row(
        children: [
          Expanded(
            child: Text(
              item.productName,
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(
                fontWeight: FontWeight.w600,
                color: scheme.onSurface,
              ),
            ),
          ),
          Text(
            '${item.quantity} × $unitPrice',
            style: Theme.of(context).textTheme.bodySmall,
          ),
          const SizedBox(width: 12),
          SizedBox(
            width: 64,
            child: Text(
              lineTotal,
              textAlign: TextAlign.end,
              style: TextStyle(
                fontWeight: FontWeight.w700,
                color: scheme.onSurface,
              ),
            ),
          ),
        ],
      ),
    );
  }
}