import 'package:doublefeel_flutter/core/services/user_state_service.dart';
import 'package:doublefeel_flutter/core/theme/app_theme.dart';
import 'package:doublefeel_flutter/l10n/l10n_extensions.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:table_calendar/table_calendar.dart';

import '../../controllers/today_controller.dart';
import '../../widgets/today/hrv_measurement_bottom_sheet.dart';
import '../../widgets/today/today_health_data_auth_card.dart';
import '../../widgets/today/today_hrv_ad_banner.dart';
import '../../widgets/today/today_hrv_chart_card.dart';
import '../../widgets/today/today_hrv_number_card.dart';
import '../../widgets/today/today_sleep_activity_cards.dart';
import '../../widgets/today/stress_status_explanation_bottom_sheet.dart';

import '../../widgets/today/premium_card.dart';

class TodayTab extends GetView<TodayController> {
  const TodayTab({super.key});

  static const _bgColor = Color(0xFFF2F2F7);
  static const _topBarHeight = 48.0;
  static const _weekCalendarHeight = 58.0;
  static const _topContentHeight = _topBarHeight + _weekCalendarHeight;
  static const _weekRowsHeight = 50.0;
  static const _selectedDayWidth = 32.0;

  @override
  Widget build(BuildContext context) {
    final topPadding = MediaQuery.paddingOf(context).top;
    final pinnedHeaderHeight = topPadding + _topContentHeight;

    return Container(
      color: _bgColor,
      child: Stack(
        children: [
          NotificationListener<ScrollNotification>(
            onNotification: (notification) {
              if (notification.metrics.axis == Axis.vertical) {
                controller.scrollOffset.value =
                    notification.metrics.pixels.clamp(0.0, double.infinity);
              }
              return false;
            },
            child: _buildDayScrollView(context, pinnedHeaderHeight),
          ),
          Positioned(
            top: 0,
            left: 0,
            right: 0,
            height: pinnedHeaderHeight,
            child: Obx(() {
              final opacity =
                  (controller.scrollOffset.value / _topContentHeight)
                      .clamp(0.0, 1.0)
                      .toDouble();

              return Container(
                color: const Color(0xFFDDD2FF).withValues(alpha: opacity),
              );
            }),
          ),
          Positioned(
            top: topPadding,
            left: 0,
            right: 0,
            child: Obx(
              () => Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  _TopDateBar(
                    title: _dateTitle(controller.selectedDate.value),
                    showBackToToday: !isSameDay(
                      controller.selectedDate.value,
                      controller.lastSelectableDay,
                    ),
                    onBackToToday: _backToToday,
                  ),
                  _buildWeekCalendar(context),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildDayScrollView(
    BuildContext context,
    double pinnedHeaderHeight,
  ) {
    return CustomScrollView(
      physics: const ClampingScrollPhysics(),
      slivers: [
        SliverToBoxAdapter(
          child: Container(
            height: 323 + pinnedHeaderHeight,
            decoration: const BoxDecoration(
              gradient: LinearGradient(
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
                colors: [
                  Color(0xFFC5B0FF),
                  Color(0xFFF5F2FF),
                ],
              ),
            ),
            child: Container(
              margin: EdgeInsets.only(top: pinnedHeaderHeight),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: [
                  Obx(
                    () => GestureDetector(
                      behavior: HitTestBehavior.opaque,
                      onTap: showStressStatusExplanationBottomSheet,
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            controller.stressSubtitle.value,
                            textAlign: TextAlign.center,
                            style: const TextStyle(
                              color: Color(0xFF78787D),
                              fontSize: 14,
                              fontWeight: FontWeight.w500,
                            ),
                          ),
                          const SizedBox(width: 4),
                          Image.asset(
                            'assets/images/common/ic_info.png',
                            width: 14,
                            height: 14,
                            color: const Color(0xFF78787D),
                          ),
                        ],
                      ),
                    ),
                  ),
                  Obx(
                    () => Text(
                      controller.stressLabel.value,
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: context.colors.textPrimary,
                        fontSize: 28,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
        SliverPadding(
          padding: const EdgeInsets.symmetric(horizontal: 16),
          sliver: SliverList(
            delegate: SliverChildListDelegate([
              Obx(
                () => controller.showHealthDataAuthCard.value
                    ? TodayHealthDataAuthCard(
                        onAuthorizeTap: controller.requestHealthAuthorization,
                      )
                    : const SizedBox.shrink(),
              ),
              Obx(() {
                return Get.find<UserStateService>().isVip
                    ? const SizedBox.shrink()
                    : const PremiumCard();
              }),
              const TodayHrvAdBanner(),
              const TodayPartnerAdBanner(),
              const TodayHrvNumberCard(),
              const SizedBox(height: 12),
              const TodayHrvChartCard(),
              const SizedBox(height: 12),
              const TodaySleepCard(),
              const TodayActivityCard(),
              const SizedBox(height: 4),
              measureHRVButton(context),
              Container(
                alignment: Alignment.center,
                margin: EdgeInsets.only(
                  bottom: 16 + MediaQuery.paddingOf(context).bottom,
                  top: 28,
                ),
                child: Image.asset(
                  'assets/images/common/ic_bottom_slogan.png',
                  width: 223,
                  height: 35,
                ),
              ),
            ]),
          ),
        ),
      ],
    );
  }

  Widget measureHRVButton(BuildContext context) {
    return GestureDetector(
      onTap: showHrvMeasurementBottomSheet,
      child: Container(
        padding: const EdgeInsets.fromLTRB(20, 20, 20, 16),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(16),
        ),
        child: Text(
          context.l10n.measureYourHrvNow,
          style: TextStyle(
            color: context.colors.textPrimary,
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
      ),
    );
  }

  Widget _buildWeekCalendar(BuildContext context) {
    return SizedBox(
      height: _weekCalendarHeight,
      child: Padding(
        padding: const EdgeInsets.fromLTRB(13, 4, 18, 4),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Expanded(
              child: SizedBox(
                height: _weekRowsHeight,
                child: TableCalendar(
                  calendarFormat: CalendarFormat.week,
                  headerVisible: false,
                  daysOfWeekHeight: _weekRowsHeight / 2,
                  rowHeight: _weekRowsHeight / 2,
                  focusedDay: controller.focusedDay.value,
                  firstDay: controller.firstSelectableDay,
                  lastDay: controller.lastSelectableDay,
                  currentDay: controller.lastSelectableDay,
                  startingDayOfWeek: StartingDayOfWeek.monday,
                  availableCalendarFormats: const {
                    CalendarFormat.week: '',
                  },
                  availableGestures: AvailableGestures.horizontalSwipe,
                  enabledDayPredicate: (day) => !_isAfterToday(day),
                  selectedDayPredicate: (day) =>
                      isSameDay(controller.selectedDate.value, day),
                  onDaySelected: _onDaySelected,
                  calendarStyle: const CalendarStyle(
                    cellMargin: EdgeInsets.zero,
                    cellPadding: EdgeInsets.zero,
                    isTodayHighlighted: false,
                    outsideDaysVisible: true,
                  ),
                  daysOfWeekStyle: const DaysOfWeekStyle(
                    decoration: BoxDecoration(),
                  ),
                  calendarBuilders: CalendarBuilders(
                    dowBuilder: (context, day) =>
                        _buildWeekdayCell(context, day),
                    defaultBuilder: (context, day, focusedDay) =>
                        _buildDateCell(context, day),
                    disabledBuilder: (context, day, focusedDay) =>
                        _buildDateCell(context, day),
                    outsideBuilder: (context, day, focusedDay) =>
                        _buildDateCell(context, day),
                    selectedBuilder: (context, day, focusedDay) =>
                        _buildDateCell(context, day, selected: true),
                  ),
                ),
              ),
            ),
            const SizedBox(width: 3),
            Container(
              width: 1,
              height: 20,
              margin: const EdgeInsets.only(top: 15),
              color: context.colors.textPrimary.withValues(alpha: 0.2),
            ),
            const SizedBox(width: 12),
            Padding(
              padding: const EdgeInsets.only(top: 15),
              child: Image.asset(
                'assets/images/common/ic_calendar.png',
                width: 20,
                height: 20,
                color: context.colors.textPrimary.withValues(alpha: 0.6),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildWeekdayCell(BuildContext context, DateTime day) {
    final selected = isSameDay(controller.selectedDate.value, day);

    return Center(
      child: Container(
        width: _selectedDayWidth,
        height: _weekRowsHeight / 2,
        alignment: Alignment.center,
        decoration: selected
            ? BoxDecoration(
                color: context.colors.primary,
                borderRadius: const BorderRadius.vertical(
                  top: Radius.circular(22),
                ),
              )
            : null,
        child: Text(
          isSameDay(day, controller.lastSelectableDay)
              ? '今'
              : _weekdayText(day),
          style: TextStyle(
            color: _calendarTextColor(context, day, selected: selected),
            fontSize: 12,
            fontWeight: FontWeight.w500,
          ),
        ),
      ),
    );
  }

  Widget _buildDateCell(
    BuildContext context,
    DateTime day, {
    bool selected = false,
  }) {
    return Center(
      child: Container(
        width: _selectedDayWidth,
        height: _weekRowsHeight / 2,
        alignment: Alignment.center,
        decoration: selected
            ? BoxDecoration(
                color: context.colors.primary,
                borderRadius: const BorderRadius.vertical(
                  bottom: Radius.circular(22),
                ),
              )
            : null,
        child: Text(
          '${day.day}',
          style: TextStyle(
            color: _calendarTextColor(context, day, selected: selected),
            fontSize: 12,
            fontWeight: FontWeight.w500,
          ),
        ),
      ),
    );
  }

  void _onDaySelected(DateTime selectedDay, DateTime focusedDay) {
    controller.changeDate(selectedDay, focused: focusedDay);
  }

  void _backToToday() {
    controller.changeDate(controller.lastSelectableDay);
  }

  String _dateTitle(DateTime selectedDay) {
    final today = controller.lastSelectableDay;
    if (isSameDay(selectedDay, today)) return '今日';
    if (isSameDay(selectedDay, today.subtract(const Duration(days: 1)))) {
      return '昨日';
    }
    if (isSameDay(selectedDay, today.add(const Duration(days: 1)))) {
      return '明日';
    }
    return '${selectedDay.month}月${selectedDay.day}日';
  }

  bool _isAfterToday(DateTime day) {
    final normalizedDay = DateUtils.dateOnly(day);
    return normalizedDay.isAfter(controller.lastSelectableDay);
  }

  Color _calendarTextColor(
    BuildContext context,
    DateTime day, {
    required bool selected,
  }) {
    if (selected) return Colors.white;
    return context.colors.textPrimary
        .withValues(alpha: _isAfterToday(day) ? 0.2 : 0.6);
  }

  String _weekdayText(DateTime day) {
    switch (day.weekday) {
      case DateTime.monday:
        return '一';
      case DateTime.tuesday:
        return '二';
      case DateTime.wednesday:
        return '三';
      case DateTime.thursday:
        return '四';
      case DateTime.friday:
        return '五';
      case DateTime.saturday:
        return '六';
      case DateTime.sunday:
      default:
        return '日';
    }
  }
}

class _TopDateBar extends StatelessWidget {
  const _TopDateBar({
    required this.title,
    required this.showBackToToday,
    required this.onBackToToday,
  });

  final String title;
  final bool showBackToToday;
  final VoidCallback onBackToToday;

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: TodayTab._topBarHeight,
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
        child: Row(
          children: [
            Text(
              title,
              textAlign: TextAlign.center,
              style: TextStyle(
                color: context.colors.textPrimary,
                fontSize: 24,
                fontWeight: FontWeight.w600,
              ),
            ),
            if (showBackToToday) ...[
              const SizedBox(width: 12),
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: onBackToToday,
                child: SizedBox(
                  height: 24,
                  child: Row(
                    children: [
                      Image.asset(
                        'assets/images/common/ic_back_to_today.png',
                        width: 12,
                        height: 12,
                        color: context.colors.primary,
                      ),
                      const SizedBox(width: 4),
                      Text(
                        '回今天',
                        style: TextStyle(
                          color: context.colors.primary,
                          fontSize: 12,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
            const Spacer(),
            Obx(() {
              return Get.find<UserStateService>().isVip
                  ? const SizedBox.shrink()
                  : Container(
                      height: 29,
                      constraints: const BoxConstraints(minWidth: 95),
                      padding: const EdgeInsets.symmetric(horizontal: 7),
                      decoration: BoxDecoration(
                        color: const Color(0xFFFFDF51),
                        borderRadius: BorderRadius.circular(27.6),
                      ),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Image.asset(
                            'assets/images/common/ic_pro.png',
                            width: 20,
                            height: 20,
                            color: context.colors.textPrimary,
                          ),
                          const SizedBox(width: 2),
                          Text(
                            '20%优惠',
                            style: TextStyle(
                              fontSize: 14,
                              fontWeight: FontWeight.w500,
                              color: context.colors.textPrimary,
                            ),
                          ),
                        ],
                      ),
                    );
            }),
          ],
        ),
      ),
    );
  }
}