import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/models/new_statistic/general_item_model.dart';
import 'package:didvan/routes/routes.dart';
import 'package:didvan/views/home/new_statistic/statistics_details/stat_cats_general_state.dart';
import 'package:didvan/views/widgets/didvan/card.dart';
import 'package:didvan/views/widgets/didvan/icon_button.dart';
import 'package:didvan/views/widgets/didvan/text.dart';
import 'package:didvan/views/widgets/state_handlers/state_handler.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class NewStatisticOverviewCard extends StatefulWidget {
  final Content statistic;
  final bool isMarked;
  final void Function(int id, bool value) onMarkChanged;

  const NewStatisticOverviewCard({
    Key? key,
    required this.statistic,
    required this.onMarkChanged,
    required this.isMarked,
  }) : super(key: key);

  @override
  State<NewStatisticOverviewCard> createState() =>
      _NewStatisticOverviewCardState();
}

class _NewStatisticOverviewCardState extends State<NewStatisticOverviewCard> {
  Color _diffColor(context) => widget.statistic.data.dt == 'high'
      ? Theme.of(context).colorScheme.success
      : Theme.of(context).colorScheme.error;

  Color _getBackgroundColor() {
    if (widget.statistic.data.dt == 'high') {
      return const Color.fromRGBO(245, 255, 252, 1);
    } else {
      return const Color.fromRGBO(255, 248, 248, 1);
    }
  }

  bool get _hasDiff => widget.statistic.data.d != '0';
  late bool marked;

  @override
  void initState() {
    marked = widget.isMarked;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return StateHandler<StatGeneralScreenState>(
      onRetry: () {},
      state: context.watch<StatGeneralScreenState>(),
      builder: (context, state) => Padding(
        padding: const EdgeInsets.all(8.0),
        child: DidvanCard(
          onTap: () {
            if (widget.statistic.category != 5) {
              Navigator.of(context)
                  .pushNamed(Routes.statisticDetails, arguments: {
                'onMarkChanged': (value) =>
                    widget.onMarkChanged(widget.statistic.id, value),
                'label': widget.statistic.label,
                'title': widget.statistic.title,
                'marked': widget.statistic.marked,
              }).then(
                (value) =>
                    state.getGeneralStatContent(page: 1, id: state.cat),
              );
            }
          },
          child: Column(
            children: [
              Row(
                children: [
                  DidvanIconButton(
                    icon: marked
                        ? DidvanIcons.star_solid
                        : DidvanIcons.star_regular,
                    color: marked
                        ? Theme.of(context).colorScheme.yellow
                        : Theme.of(context).colorScheme.focusedBorder,
                    size: 24,
                    onPressed: () {
                      setState(() {
                        marked = !marked;
                      });

                      state.changeMark(widget.statistic.id, marked);
                      state.update();
                    },
                  ),
                  const SizedBox(
                    width: 4,
                  ),
                  DidvanText(
                    widget.statistic.title,
                    style: Theme.of(context).textTheme.bodyLarge,
                  ),
                  const Spacer(),
                ],
              ),
              const SizedBox(height: 16),
              Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  DidvanText(
                    widget.statistic.data.p,
                    style: Theme.of(context).textTheme.headlineSmall,
                  ),
                  if (_hasDiff) const SizedBox(height: 8),
                  if (_hasDiff)
                    Container(
                      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
                      decoration: BoxDecoration(
                        color: _getBackgroundColor(),
                        borderRadius: BorderRadius.circular(20),
                      ),
                      child: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Icon(
                            widget.statistic.data.dt == 'high'
                                ? DidvanIcons.angle_up_regular
                                : DidvanIcons.angle_down_regular,
                            size: 16,
                            color: _diffColor(context),
                          ),
                          const SizedBox(width: 4),
                          DidvanText(
                            '${widget.statistic.data.dp}%',
                            style: Theme.of(context).textTheme.bodyMedium,
                            color: _diffColor(context),
                          ),
                          const SizedBox(width: 4),
                           DidvanText(
                            '(${widget.statistic.data.d})',
                            style: Theme.of(context).textTheme.bodySmall,
                            color: _diffColor(context),
                          ),
                        ],
                      ),
                    ),
                ],
              ),
              const SizedBox(height: 16),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    children: [
                      Icon(
                        Icons.trending_down,
                        size: 18,
                        color: Theme.of(context).colorScheme.error,
                      ),
                      DidvanText(
                        widget.statistic.data.l,
                        style: Theme.of(context).textTheme.bodySmall,
                        color: Theme.of(context).colorScheme.hint,
                      ),
                    ],
                  ),
                  Row(
                    children: [
                      Icon(
                        Icons.trending_up,
                        size: 18,
                        color: Theme.of(context).colorScheme.success,
                      ),
                      DidvanText(
                        widget.statistic.data.h,
                        style: Theme.of(context).textTheme.bodySmall,
                        color: Theme.of(context).colorScheme.hint,
                      ),
                    ],
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}