import 'package:enaklo_pos/core/components/components.dart';
import 'package:enaklo_pos/core/constants/colors.dart';
import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
import 'package:enaklo_pos/core/extensions/date_time_ext.dart';
import 'package:enaklo_pos/presentation/sales/blocs/order_loader/order_loader_bloc.dart';
import 'package:enaklo_pos/presentation/sales/dialog/filter_dialog.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

class SalesTitle extends StatelessWidget {
  final String title;
  final DateTime startDate;
  final DateTime endDate;
  final Function(String) onChanged;
  final void Function(DateTime start, DateTime end) onDateRangeChanged;

  const SalesTitle(
      {super.key,
      required this.startDate,
      required this.endDate,
      required this.onChanged,
      required this.onDateRangeChanged,
      required this.title});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          height: context.deviceHeight * 0.1,
          padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
          decoration: BoxDecoration(
            color: AppColors.white,
            border: Border(
              bottom: BorderSide(
                color: AppColors.background,
                width: 1.0,
              ),
            ),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              IconButton(
                onPressed: () => context.pop(),
                icon: Icon(Icons.arrow_back, color: AppColors.black),
              ),
              SpaceWidth(16),
              Expanded(
                child: Text(
                  title,
                  style: TextStyle(
                    color: AppColors.black,
                    fontSize: 20,
                    fontWeight: FontWeight.w600,
                  ),
                ),
              ),
            ],
          ),
        ),
        Container(
          padding: const EdgeInsets.symmetric(
            horizontal: 16.0,
            vertical: 12.0,
          ),
          decoration: BoxDecoration(
            color: AppColors.white,
            border: Border(
              bottom: BorderSide(
                color: AppColors.background,
                width: 1.0,
              ),
            ),
          ),
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    startDate.toFormattedDate2() == endDate.toFormattedDate2()
                        ? startDate.toFormattedDate2()
                        : '${startDate.toFormattedDate2()} - ${endDate.toFormattedDate2()}',
                    style: TextStyle(
                      color: AppColors.black,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                  BlocBuilder<OrderLoaderBloc, OrderLoaderState>(
                    builder: (context, state) {
                      return state.maybeWhen(
                        orElse: () => const SizedBox.shrink(),
                        loaded: (orders, totalOrder, _, __, ___) => Text(
                          '$totalOrder Pesanan',
                          style: TextStyle(
                            color: AppColors.black,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                      );
                    },
                  ),
                ],
              ),
              SpaceHeight(16),
              Row(
                children: [
                  Expanded(
                    child: TextFormField(
                      onChanged: onChanged,
                      decoration: InputDecoration(
                        prefixIcon: Icon(
                          Icons.search,
                        ),
                        hintText: 'Cari Pesanan',
                      ),
                    ),
                  ),
                  SpaceWidth(12),
                  GestureDetector(
                    onTap: () => showDialog(
                      context: context,
                      builder: (context) => SalesFilterDialog(
                        startDate: startDate,
                        endDate: endDate,
                        onDateRangeChanged: onDateRangeChanged,
                      ),
                    ),
                    child: Container(
                      padding: const EdgeInsets.all(12),
                      decoration: BoxDecoration(
                        color: AppColors.primary,
                        borderRadius: BorderRadius.circular(12),
                      ),
                      child: Icon(
                        Icons.filter_list_outlined,
                        color: AppColors.white,
                        size: 24,
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }
}