import 'package:fis_i18n/i18n.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/interface/interactive_container.dart';
import 'package:flutter/material.dart';
import 'package:flyinsono/architecture/define.dart';
import 'package:flyinsono/pages/schedule/calendar/utils/calendar_utils.dart';
import 'package:flyinsono/views/mobile/mobile_calendar/controller.dart';
import 'package:flyinsono/views/mobile/mobile_calendar/widgets/month_view_schedule_list.dart';

/// 移动端月历的每一格日期
class MonthViewCalendarDay extends FisView<MobileCalendarController>
    implements FInteractiveContainer {
  MonthViewCalendarDay(
      {Key? key,
      required this.date,
      required this.indexInPage,
      required this.parentPageDayOfMonth})
      : super(key: key);

  final DateTime date;
  final DateTime parentPageDayOfMonth;
  final int indexInPage;

  @override
  String get pageName => "mobile month view each day";

  final GlobalKey _monthGridKey = GlobalKey();

  bool get isToday =>
      CalendarUtils.isSameDay(date, controller.state.currDateTime);
  bool get isCurMonth => CalendarUtils.isSameMonth(date, parentPageDayOfMonth);
  String get displayStr =>
      isToday ? i18nBook.calendar.singleToday.t : date.day.toString();

  BoxDecoration get _gridContainerDecoration => BoxDecoration(
        color: Colors.white,
      );
  BoxDecoration get _todayContainerDecoration => BoxDecoration(
        color: Colors.blue.withOpacity(0.2),
        borderRadius: BorderRadius.circular(4),
      );
  TextStyle get _dayTextStyle => TextStyle(
        height: date == DateTime.now() ? null : 1,
        fontWeight: FontWeight.bold,
        fontSize: 12,
        color: Colors.black,
      );

  /// [今日] 淡蓝底蓝字
  TextStyle get _dayTextStyle4Today => _dayTextStyle.copyWith(
        color: Colors.blue,
      );

  /// 其他月份字体颜色减淡
  TextStyle get _dayTextStyle4OtherMonth => _dayTextStyle.copyWith(
        color: Colors.grey,
      );

  /// 最终展示的字体样式 优先级 [今日] > [当前月] > [其他月]
  TextStyle get _dayTextStyle4Display => isToday
      ? _dayTextStyle4Today
      : isCurMonth
          ? _dayTextStyle
          : _dayTextStyle4OtherMonth;

  TextStyle get _lunarDayTextStyle => _dayTextStyle.copyWith(
        fontWeight: FontWeight.normal,
        fontSize: 9,
        color: Colors.grey,
      );

  /// 其他月份字体颜色减淡
  TextStyle get _lunarDayTextStyle4OtherMonth => _lunarDayTextStyle.copyWith(
        color: Color.fromARGB(255, 190, 190, 190),
      );

  @override
  FWidget build(BuildContext context) {
    return FObx(() {
      if (controller.state.isPageChanging) {
        return FContainer(
          key: _monthGridKey,
          decoration: _gridContainerDecoration,
          child: FColumn(
            children: [
              FContainer(
                margin: const EdgeInsets.only(top: 10),
                height: 12,
                child: FCenter(
                  child: FText(displayStr, style: _dayTextStyle),
                ),
              ),
            ],
          ),
        );
      } else {
        return FGestureDetector(
          businessParent: this,
          name: "month view each day",
          onTap: () => controller.openMonthViewPopup(indexInPage, date),
          child: FContainer(
            key: _monthGridKey,
            decoration: _gridContainerDecoration,
            child: FColumn(
              children: [
                FContainer(
                  margin: const EdgeInsets.only(
                      top: 10, bottom: 3, left: 6, right: 6),
                  height: 12,
                  decoration: isToday ? _todayContainerDecoration : null,
                  child: FCenter(
                    child: FText(displayStr, style: _dayTextStyle4Display),
                  ),
                ),
                if (i18nBook.isCurrentChinese)
                  FContainer(
                    margin: const EdgeInsets.all(3),
                    child: FCenter(
                      child: FText(CalendarUtils.getLunarDay(date),
                          style: isCurMonth
                              ? _lunarDayTextStyle
                              : _lunarDayTextStyle4OtherMonth),
                    ),
                  ),
                _buildScheduleContainer()
              ],
            ),
          ),
        );
      }
    });
  }

  /// 构建日程容器
  FWidget _buildScheduleContainer() {
    return FExpanded(
      child: FContainer(
        width: double.infinity,
        child: MonthViewScheduleRows(
          date: date,
          indexInPage: indexInPage,
        ),
      ),
    );
  }
}
