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

import '../../../../application/analytic/exclusive_summary_loader/exclusive_summary_loader_bloc.dart';
import '../../../../common/extension/extension.dart';
import '../../../../common/theme/theme.dart';
import '../../../router/app_router.gr.dart';
import 'header_summary_card.dart';

class HeaderSummarySlider extends StatefulWidget {
  final bool isValueVisible;

  const HeaderSummarySlider({super.key, this.isValueVisible = true});

  @override
  State<HeaderSummarySlider> createState() => _HeaderSummarySliderState();
}

class _HeaderSummarySliderState extends State<HeaderSummarySlider> {
  final PageController _pageController = PageController(viewportFraction: 0.92);
  int _currentPage = 0;

  @override
  void dispose() {
    _pageController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<ExclusiveSummaryLoaderBloc, ExclusiveSummaryLoaderState>(
      builder: (context, state) {
        final summary = state.exclusiveSummary.summary;
        final dailySummary = state.exclusiveSummary.dailySummary;

        return Column(
          children: [
            SizedBox(
              height: 170,
              child: state.isFetching
                  ? _buildShimmer()
                  : PageView(
                      controller: _pageController,
                      onPageChanged: (index) {
                        setState(() => _currentPage = index);
                      },
                      children: [
                        Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 4),
                          child: HeaderSummaryCard(
                            icon: Icons.credit_card_rounded,
                            iconColor: const Color(0xFFB71C1C),
                            title: context.lang.sales,
                            value: summary.sales,
                            subtitle: context.lang.compared_to_previous_period,
                            dailyData: dailySummary,
                            isValueVisible: widget.isValueVisible,
                            percentage: summary.sales > 0 ? 12.5 : null,
                            onTap: () =>
                                context.router.push(const SalesRoute()),
                          ),
                        ),
                        Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 4),
                          child: HeaderSummaryCard(
                            icon: Icons.shopping_cart_outlined,
                            iconColor: const Color(0xFF00BCD4),
                            title: context.lang.purchase,
                            value: summary.hpp,
                            subtitle: context.lang.compared_to_previous_period,
                            dailyData: dailySummary,
                            isValueVisible: widget.isValueVisible,
                            percentage: summary.sales > 0
                                ? (summary.hpp / summary.sales * 100)
                                : null,
                            onTap: () =>
                                context.router.push(const PurchaseRoute()),
                          ),
                        ),
                        Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 4),
                          child: HeaderSummaryCard(
                            icon: Icons.account_balance_wallet_outlined,
                            iconColor: const Color(0xFFFF9800),
                            title: context.lang.profit_loss,
                            value: summary.netProfit,
                            subtitle: context.lang.compared_to_previous_period,
                            dailyData: dailySummary,
                            isValueVisible: widget.isValueVisible,
                            percentage: summary.sales > 0
                                ? (summary.netProfit / summary.sales * 100)
                                : null,
                            onTap: () =>
                                context.router.push(const FinanceRoute()),
                          ),
                        ),
                      ],
                    ),
            ),

            const SizedBox(height: 8),

            // Page indicator
            _buildPageIndicator(),
          ],
        );
      },
    );
  }

  Widget _buildShimmer() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 4),
      decoration: BoxDecoration(
        color: AppColor.white.withOpacity(0.15),
        borderRadius: BorderRadius.circular(16),
      ),
      child: Center(
        child: CircularProgressIndicator(
          color: AppColor.white.withOpacity(0.5),
          strokeWidth: 2,
        ),
      ),
    );
  }

  Widget _buildPageIndicator() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: List.generate(3, (index) {
        final isActive = _currentPage == index;
        return AnimatedContainer(
          duration: const Duration(milliseconds: 200),
          margin: const EdgeInsets.symmetric(horizontal: 3),
          width: isActive ? 20 : 6,
          height: 6,
          decoration: BoxDecoration(
            color: isActive ? AppColor.white : AppColor.white.withOpacity(0.4),
            borderRadius: BorderRadius.circular(3),
          ),
        );
      }),
    );
  }
}