import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import '../../../../application/void/void_form/void_form_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../../common/types/void_type.dart';
import '../../button/button.dart';
import '../../spaces/space.dart';
import '../dialog.dart';

class OrderVoidConfirmDialog extends StatelessWidget {
  final String message;
  const OrderVoidConfirmDialog({super.key, required this.message});

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<VoidFormBloc, VoidFormState>(
      builder: (context, state) {
        return CustomModalDialog(
          title: 'Konfirmasi Void',
          subtitle: 'Tindakan ini tidak dapat dibatalkan',
          contentPadding: const EdgeInsets.all(16),
          bottom: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Row(
              children: [
                Expanded(
                  child: AppElevatedButton.outlined(
                    onPressed: state.isSubmitting ? null : () => context.maybePop(),
                    label: 'Batal',
                  ),
                ),
                const SpaceWidth(16),
                Expanded(
                  child: AppElevatedButton.filled(
                    onPressed: state.isSubmitting
                        ? null
                        : () {
                            context.read<VoidFormBloc>().add(
                              const VoidFormEvent.submitted(),
                            );
                          },
                    label: state.voidType.isAll ? 'Void Pesanan' : 'Void Item',
                    isLoading: state.isSubmitting,
                  ),
                ),
              ],
            ),
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                message,
                style: AppStyle.md.copyWith(
                  height: 1,
                  color: AppColor.textPrimary,
                ),
              ),

              if (state.voidType.isItem &&
                  state.selectedItemQuantities.isNotEmpty) ...[
                const SizedBox(height: 16),

                // Items section
                Container(
                  width: double.infinity,
                  decoration: BoxDecoration(
                    color: AppColor.primary.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(12),
                    border: Border.all(color: AppColor.primary),
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Padding(
                        padding: const EdgeInsets.all(16),
                        child: Row(
                          children: [
                            Container(
                              padding: const EdgeInsets.all(6),
                              decoration: BoxDecoration(
                                color: AppColor.primary.withOpacity(0.2),
                                borderRadius: BorderRadius.circular(6),
                              ),
                              child: const Icon(
                                Icons.list_alt_rounded,
                                color: AppColor.primary,
                                size: 16,
                              ),
                            ),
                            const SizedBox(width: 8),
                            Text(
                              'Item yang akan divoid:',
                              style: AppStyle.md.copyWith(
                                fontWeight: FontWeight.bold,
                                color: AppColor.primary,
                              ),
                            ),
                          ],
                        ),
                      ),
                      Container(
                        constraints: const BoxConstraints(maxHeight: 120),
                        child: Scrollbar(
                          child: SingleChildScrollView(
                            padding: const EdgeInsets.only(
                              left: 16,
                              right: 16,
                              bottom: 16,
                            ),
                            child: Column(
                              children: state.selectedItemQuantities.entries
                                  .map((entry) {
                                    final item = state.order.orderItems
                                        .firstWhere(
                                          (item) => item.id == entry.key,
                                        );
                                    return Container(
                                      margin: const EdgeInsets.only(bottom: 6),
                                      padding: const EdgeInsets.all(10),
                                      decoration: BoxDecoration(
                                        color: Colors.white,
                                        borderRadius: BorderRadius.circular(6),
                                        boxShadow: [
                                          BoxShadow(
                                            color: Colors.black.withOpacity(
                                              0.03,
                                            ),
                                            blurRadius: 2,
                                            offset: const Offset(0, 1),
                                          ),
                                        ],
                                      ),
                                      child: Row(
                                        children: [
                                          Container(
                                            width: 6,
                                            height: 6,
                                            decoration: const BoxDecoration(
                                              color: AppColor.primary,
                                              shape: BoxShape.circle,
                                            ),
                                          ),
                                          const SizedBox(width: 8),
                                          Expanded(
                                            child: Column(
                                              crossAxisAlignment:
                                                  CrossAxisAlignment.start,
                                              children: [
                                                Text(
                                                  item.productName,
                                                  style: AppStyle.sm.copyWith(
                                                    fontWeight: FontWeight.w600,
                                                  ),
                                                  maxLines: 1,
                                                  overflow:
                                                      TextOverflow.ellipsis,
                                                ),
                                                Text(
                                                  '${entry.value} qty',
                                                  style: AppStyle.xs.copyWith(
                                                    fontSize: 10,
                                                    color:
                                                        AppColor.textSecondary,
                                                  ),
                                                ),
                                              ],
                                            ),
                                          ),
                                          Container(
                                            padding: const EdgeInsets.symmetric(
                                              horizontal: 6,
                                              vertical: 2,
                                            ),
                                            decoration: BoxDecoration(
                                              color: AppColor.primary
                                                  .withOpacity(0.2),
                                              borderRadius:
                                                  BorderRadius.circular(4),
                                            ),
                                            child: Text(
                                              ((item.unitPrice) * entry.value)
                                                  .currencyFormatRpV2,
                                              style: AppStyle.xs.copyWith(
                                                fontWeight: FontWeight.bold,
                                                color: AppColor.primary,
                                              ),
                                            ),
                                          ),
                                        ],
                                      ),
                                    );
                                  })
                                  .toList(),
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
              const SizedBox(height: 16),
              // Reason section
              Container(
                width: double.infinity,
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                  color: Colors.blue[50],
                  borderRadius: BorderRadius.circular(8),
                  border: Border.all(color: Colors.blue[200]!),
                ),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      padding: const EdgeInsets.all(6),
                      decoration: BoxDecoration(
                        color: AppColor.info.withOpacity(0.1),
                        borderRadius: BorderRadius.circular(6),
                      ),
                      child: const Icon(
                        Icons.note_alt_rounded,
                        color: AppColor.info,
                        size: 16,
                      ),
                    ),
                    const SizedBox(width: 8),
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            'Alasan:',
                            style: AppStyle.sm.copyWith(
                              fontWeight: FontWeight.w600,
                              color: AppColor.info,
                              fontSize: 12,
                            ),
                          ),
                          const SizedBox(height: 2),
                          Text(
                            state.voidReason ?? "",
                            style: TextStyle(
                              fontStyle: FontStyle.italic,
                              color: AppColor.info.withOpacity(0.7),
                              fontSize: 12,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );
  }
}
