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/dialog/filter_dialog.dart';
import 'package:flutter/material.dart';

class SalesTitle extends StatelessWidget {
  final DateTime startDate;
  final DateTime endDate;
  final int total;
  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.total,
      required this.onDateRangeChanged});

  @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: [
              GestureDetector(
                onTap: () => context.pop(),
                child: Icon(
                  Icons.arrow_back,
                  color: AppColors.primary,
                  size: 24,
                ),
              ),
              SpaceWidth(16),
              Expanded(
                child: Text(
                  "Daftar Pesanan",
                  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,
                    ),
                  ),
                  Text(
                    '$total 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,
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }
}
