import 'package:flutter/material.dart';

import '../../../../application/payment/payment_form/payment_form_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/border/dashed_border.dart';
import '../../../components/spaces/space.dart';

class PaymentLeftPanel extends StatelessWidget {
  final PaymentFormState state;
  const PaymentLeftPanel({super.key, required this.state});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: AppColor.white,
        borderRadius: BorderRadius.circular(12),
      ),
      padding: const EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            'Detail Order',
            style: AppStyle.h5.copyWith(
              fontWeight: FontWeight.bold,
              color: AppColor.primary,
            ),
          ),
          const SpaceHeight(16),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                'No. Pesanan',
                style: AppStyle.md.copyWith(fontWeight: FontWeight.w600),
              ),
              Text(
                state.order.orderNumber,
                style: AppStyle.md.copyWith(fontWeight: FontWeight.bold),
              ),
            ],
          ),
          SpaceHeight(8),
          Divider(color: AppColor.border),
          SpaceHeight(8),
          Expanded(
            child: state.pendingItems.isEmpty
                ? const Center(child: Text('Tidak ada item'))
                : ListView.separated(
                    shrinkWrap: true,
                    itemCount: state.pendingItems.length,
                    separatorBuilder: (_, __) =>
                        Divider(color: AppColor.border),
                    itemBuilder: (context, index) {
                      final item = state.pendingItems[index];
                      return ListTile(
                        contentPadding: EdgeInsets.zero,
                        title: Text(
                          item.productName,
                          style: AppStyle.md.copyWith(
                            fontWeight: FontWeight.w600,
                            color: AppColor.primary,
                          ),
                        ),
                        subtitle: Text(
                          'Qty: ${item.quantity}  |  ${item.productVariantName}',
                          style: AppStyle.sm,
                        ),
                        trailing: Text(
                          (item.totalPrice).currencyFormatRpV2,
                          style: AppStyle.md.copyWith(
                            fontWeight: FontWeight.bold,
                            color: AppColor.primary,
                          ),
                        ),
                      );
                    },
                  ),
          ),
          Divider(color: AppColor.border),
          _buildSummaryRow('Subtotal', state.order.subtotal),
          _buildSummaryRow('Pajak', state.order.taxAmount),
          _buildSummaryRow('Diskon', state.order.discountAmount),
          SpaceHeight(8),
          DashedDivider(color: AppColor.border),
          SpaceHeight(8),
          _buildSummaryRow(
            'Total',
            state.order.totalAmount,
            isTotal: true,
            color: AppColor.primary,
          ),
        ],
      ),
    );
  }

  Widget _buildSummaryRow(
    String label,
    int amount, {
    bool isTotal = false,
    Color? color,
  }) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 4),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(
            label,
            style: TextStyle(
              fontWeight: isTotal ? FontWeight.bold : FontWeight.normal,
              fontSize: isTotal ? 18 : 14,
              color: color ?? Colors.black,
            ),
          ),
          Text(
            amount.currencyFormatRpV2,
            style: TextStyle(
              fontWeight: isTotal ? FontWeight.bold : FontWeight.normal,
              fontSize: isTotal ? 18 : 14,
              color: color ?? Colors.black,
            ),
          ),
        ],
      ),
    );
  }
}