import 'package:flutter/widgets.dart';

import '../../../../application/checkout/checkout_form/checkout_form_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/border/dashed_border.dart';
import '../../../components/card/order_menu.dart';
import '../../../components/page/page_title.dart';
import '../../../components/spaces/space.dart';

class CheckoutLeftPanel extends StatelessWidget {
  final CheckoutFormState checkoutState;
  final int price;
  const CheckoutLeftPanel({
    super.key,
    required this.checkoutState,
    required this.price,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        PageTitle(
          title: 'Konfirmasi',
          subtitle: checkoutState.table != null
              ? 'Pesanan Meja ${checkoutState.table?.tableName ?? "-"}'
              : 'Pesanan',
          actionWidget: [
            Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.0),
                border: Border.all(color: AppColor.primary, width: 1.0),
              ),
              padding: const EdgeInsets.all(8.0),
              child: Text(
                checkoutState.orderType.value,
                style: const TextStyle(
                  color: AppColor.primary,
                  fontSize: 16,
                  fontWeight: FontWeight.w600,
                ),
              ),
            ),
          ],
        ),
        Container(
          padding: const EdgeInsets.all(16.0).copyWith(bottom: 8),
          decoration: const BoxDecoration(
            border: Border(
              bottom: BorderSide(color: AppColor.border, width: 1.0),
            ),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                'Item',
                style: AppStyle.lg.copyWith(
                  color: AppColor.primary,
                  fontWeight: FontWeight.w600,
                ),
              ),
              const SpaceWidth(160),
              SizedBox(
                width: 50.0,
                child: Text(
                  'Qty',
                  style: AppStyle.lg.copyWith(
                    color: AppColor.primary,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
              SizedBox(
                child: Text(
                  'Price',
                  style: AppStyle.lg.copyWith(
                    color: AppColor.primary,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
            ],
          ),
        ),
        Expanded(
          child: ListView.separated(
            shrinkWrap: true,
            padding: const EdgeInsets.all(16.0).copyWith(top: 8.0),
            itemBuilder: (context, index) =>
                OrderMenu(data: checkoutState.items[index]),
            separatorBuilder: (context, index) => const SpaceHeight(12.0),
            itemCount: checkoutState.items.length,
          ),
        ),
        const DashedDivider(color: AppColor.border),
        Container(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            children: [
              if (checkoutState.delivery != null) ...[
                Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          'Pengiriman',
                          style: AppStyle.md.copyWith(
                            color: AppColor.black,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                        Text(
                          checkoutState.delivery?.name ?? '-',
                          style: AppStyle.md.copyWith(
                            color: AppColor.black,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                      ],
                    ),
                    const SpaceHeight(8.0),
                    const DashedDivider(color: AppColor.border),
                    const SpaceHeight(8.0),
                  ],
                ),
              ],
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    'Sub total',
                    style: AppStyle.md.copyWith(
                      color: AppColor.black,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                  Text(
                    price.currencyFormatRp,
                    style: AppStyle.md.copyWith(
                      color: AppColor.black,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ],
              ),
              const SpaceHeight(8.0),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    'Pajak PB1',
                    style: AppStyle.md.copyWith(
                      color: AppColor.black,
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                  Text(
                    '${checkoutState.tax}% (Rp. 0)',
                    style: AppStyle.md.copyWith(
                      color: AppColor.black,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ],
              ),
              const SpaceHeight(8.0),
              const DashedDivider(color: AppColor.border),
              const SpaceHeight(8.0),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    'Total',
                    style: AppStyle.xl.copyWith(
                      color: AppColor.black,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  Text(
                    price.currencyFormatRp,
                    style: const TextStyle(
                      color: AppColor.primary,
                      fontWeight: FontWeight.bold,
                      fontSize: 18,
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }
}
