import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

import '../../../../application/split_bill/split_bill_form/split_bill_form_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../../domain/order/order.dart';
import '../../../components/border/dashed_border.dart';
import '../../../components/page/page_title.dart';
import '../../../components/spaces/space.dart';

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

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(color: AppColor.white),
      child: Column(
        children: [
          PageTitle(
            title: 'Ringkasan Pesanan',
            subtitle: state.order.orderNumber,
          ),
          const SpaceHeight(16),
          Expanded(
            child: ListView.builder(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              itemCount: state.pendingItems.length,
              itemBuilder: (context, index) {
                return _buildOrderItem(state.pendingItems[index]);
              },
            ),
          ),
          const DashedDivider(color: AppColor.border),

          Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              children: [
                if (state.order.subtotal != state.order.totalAmount) ...[
                  _buildSummaryItem(
                    title: 'Subtotal',
                    value: state.order.subtotal.currencyFormatRpV2,
                  ),
                  if ((state.order.taxAmount) > 0)
                    _buildSummaryItem(
                      title: 'Pajax',
                      value: state.order.taxAmount.currencyFormatRpV2,
                    ),
                  if ((state.order.discountAmount) > 0)
                    _buildSummaryItem(
                      title: 'Diskon',
                      value: state.order.discountAmount.currencyFormatRpV2,
                    ),
                  const SpaceHeight(8),
                ],
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      'Total terbayar',
                      style: AppStyle.md.copyWith(
                        color: AppColor.textPrimary,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                    Text(
                      state.order.totalPaid.currencyFormatRpV2,
                      style: AppStyle.md.copyWith(
                        color: AppColor.textPrimary,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ],
                ),
                const SpaceHeight(4),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      'Sisa Tagihan',
                      style: AppStyle.md.copyWith(
                        color: AppColor.error,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                    Text(
                      state.order.remainingAmount.currencyFormatRpV2,
                      style: AppStyle.md.copyWith(
                        color: AppColor.error,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ],
                ),
                const SpaceHeight(6),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      'Total Pembayaran',
                      style: AppStyle.lg.copyWith(
                        color: AppColor.primary,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                    Text(
                      state.order.totalAmount.currencyFormatRpV2,
                      style: AppStyle.lg.copyWith(
                        color: AppColor.primary,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Row _buildSummaryItem({required String title, required String value}) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Text(title, style: AppStyle.md.copyWith(color: AppColor.textSecondary)),
        Text(value, style: AppStyle.md.copyWith(color: AppColor.textSecondary)),
      ],
    );
  }

  Widget _buildOrderItem(OrderItem item) {
    return Container(
      padding: const EdgeInsets.symmetric(vertical: 12),
      child: Column(
        children: [
          Row(
            children: [
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      item.productName,
                      style: AppStyle.lg.copyWith(
                        fontWeight: FontWeight.w600,
                        color: AppColor.textPrimary,
                      ),
                    ),
                    if (item.productVariantName.isNotEmpty)
                      Text(
                        item.productVariantName,
                        style: AppStyle.md.copyWith(
                          color: AppColor.textSecondary,
                          fontStyle: FontStyle.italic,
                        ),
                      ),
                    Text(
                      'Qty: ${item.quantity} x Rp ${item.unitPrice.currencyFormatRpV2} ',
                      style: AppStyle.md.copyWith(
                        color: AppColor.textSecondary,
                      ),
                    ),
                  ],
                ),
              ),
              Text(
                item.totalPrice.currencyFormatRpV2,
                style: AppStyle.lg.copyWith(
                  fontWeight: FontWeight.w600,
                  color: AppColor.textPrimary,
                ),
              ),
            ],
          ),
          if ((item.paidQuantity) > 1) ...[
            const SpaceHeight(6),
            Align(
              alignment: Alignment.centerRight,
              child: Container(
                padding: const EdgeInsets.symmetric(
                  horizontal: 10,
                  vertical: 4,
                ),
                decoration: BoxDecoration(
                  color: AppColor.primary.withOpacity(0.2),
                  borderRadius: BorderRadius.circular(8),
                  border: Border.all(color: AppColor.primary),
                ),
                child: RichText(
                  text: TextSpan(
                    children: [
                      TextSpan(
                        text: '${item.paidQuantity} ',
                        style: AppStyle.sm.copyWith(
                          fontWeight: FontWeight.w600,
                          color: AppColor.primary,
                        ),
                      ),
                      TextSpan(
                        text: 'dari ',
                        style: AppStyle.sm.copyWith(color: AppColor.primary),
                      ),
                      TextSpan(
                        text: '${item.quantity} ',
                        style: AppStyle.sm.copyWith(
                          fontWeight: FontWeight.w600,
                          color: AppColor.primary,
                        ),
                      ),
                      TextSpan(
                        text: 'kuantiti telah dibayar.',
                        style: AppStyle.sm.copyWith(color: AppColor.primary),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ],
        ],
      ),
    );
  }
}
