import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../../domain/models/finance_category.dart';

class FinanceSummaryCard extends StatelessWidget {
  final String totalAmount;
  final FinanceCategory currentCategory;
  final VoidCallback onCalendarTap;
  final ValueChanged<FinanceCategory?> onCategoryChanged;

  const FinanceSummaryCard({
    super.key,
    this.totalAmount = "0",
    required this.currentCategory,
    required this.onCalendarTap,
    required this.onCategoryChanged,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 18, vertical: 10),
      padding: const EdgeInsets.all(18),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(22),
        boxShadow: const [
          BoxShadow(
            color: Colors.black26,
            blurRadius: 10,
            offset: Offset(0, 6),
          ),
        ],
      ),
      child: Column(
        children: [
          /// ==========================
          /// TOP AMOUNT + ICON
          /// ==========================
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                "د.ع $totalAmount",
                style: const TextStyle(
                  fontSize: 22,
                  fontWeight: FontWeight.bold,
                  color: Color(0xFFBA4404),
                ),
              ),

              Row(
                children: [
                  const Text(
                    "المبلغ الكلي",
                    style: TextStyle(fontSize: 18, fontWeight: FontWeight.w700),
                  ),
                  const SizedBox(width: 10),
                  SvgPicture.asset("assets/images/money2.svg", width: 50),
                ],
              ),
            ],
          ),

          const SizedBox(height: 20),

          /// ==========================
          /// MONTH FILTER BOX
          /// ==========================
          Container(
            padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 12),
            decoration: BoxDecoration(
              border: Border.all(color: const Color(0xFF0A8F6B), width: 1),
              borderRadius: BorderRadius.circular(16),
            ),
            child: Row(
              children: [
                // CALENDAR BUTTON
                GestureDetector(
                  onTap: onCalendarTap,
                  child: Container(
                    width: 90,
                    height: 60,
                    decoration: BoxDecoration(
                      color: const Color(0xFFEAEAEA),
                      borderRadius: BorderRadius.circular(14),
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        SvgPicture.asset(
                          "assets/images/calendar.svg",
                          width: 28,
                        ),
                        const SizedBox(height: 4),
                        const Text("الشهر", style: TextStyle(fontSize: 15)),
                      ],
                    ),
                  ),
                ),

                const SizedBox(width: 14),

                // DROPDOWN MENU
                Expanded(
                  child: Directionality(
                    textDirection: TextDirection.rtl,
                    child: Container(
                      height: 60,
                      padding: const EdgeInsets.symmetric(horizontal: 12),
                      decoration: BoxDecoration(
                        color: const Color(0xFFEAEAEA),
                        borderRadius: BorderRadius.circular(14),
                      ),
                      child: DropdownButtonHideUnderline(
                        child: DropdownButton<FinanceCategory>(
                          value: currentCategory,
                          icon: const Icon(
                            Icons.arrow_drop_down,
                            size: 35,
                            color: Color(0xFF0A8F6B),
                          ),
                          style: const TextStyle(
                            fontSize: 18,
                            color: Colors.black,
                            fontWeight: FontWeight.bold,
                          ),
                          onChanged: onCategoryChanged,
                          items: const [
                            DropdownMenuItem(
                              value: FinanceCategory.attendance,
                              child: Text("الحظور"),
                            ),
                            DropdownMenuItem(
                              value: FinanceCategory.overtime,
                              child: Text("ساعات أضافية"),
                            ),
                            DropdownMenuItem(
                              value: FinanceCategory.bonus,
                              child: Text("مكافئة"),
                            ),
                            DropdownMenuItem(
                              value: FinanceCategory.penalty,
                              child: Text("عقوبة"),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
