import 'package:fis_i18n/i18n.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/interface/interactive_container.dart';
import 'package:flyinsono/pages/schedule/calendar/controller.dart';
import 'package:flyinsono/pages/schedule/calendar/calendar_page/month_calendar/month_calendar.dart';
import 'package:flyinsono/pages/schedule/calendar/calendar_page/my_calendar/my_calendar.dart';
import 'package:flyinsono/pages/schedule/calendar/popup_layer/popup_layer.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

/// 日历视图主体面板
class CalendarMainPanel extends FStatefulWidget
    implements FInteractiveContainer {
  const CalendarMainPanel({super.key});

  @override
  FState<CalendarMainPanel> createState() => _CalendarMainPanelState();
  @override
  String get pageName => "CalendarMainPanel";
}

enum CalendarViewType { month, week, day, list }

class _CalendarMainPanelState extends FState<CalendarMainPanel> {
  /// TODO:[Gavin] 将 _viewType 也收入到 CalendarController 中
  final CalendarViewType _viewType = CalendarViewType.month;
  String _currYearMonthStr = ''; // 当前年月
  bool _isToday = true; // 是否是今天
  CalendarController calendarController = Get.find<CalendarController>();
  @override
  void initState() {
    super.initState();
    _isToday = calendarController.isToday;
    _currYearMonthStr = calendarController.currentYearMonth;
    calendarController.onDaysListChange.addListener(_onDaysListChange);
  }

  @override
  void dispose() {
    super.dispose();
    calendarController.onDaysListChange.removeListener(_onDaysListChange);
  }

  void _onDaysListChange(_, e) {
    setState(() {
      _isToday = calendarController.isToday;
      _currYearMonthStr = calendarController.currentYearMonth;
    });
  }

  /// 按钮样式
  final _iconButtonStyle = ButtonStyle(
    padding:
        MaterialStateProperty.all<EdgeInsetsGeometry>(const EdgeInsets.all(0)),
    backgroundColor: MaterialStateProperty.all<Color>(Colors.transparent),
    shadowColor: MaterialStateProperty.all<Color>(Colors.transparent),
    overlayColor: MaterialStateProperty.all<Color>(
        const Color.fromARGB(255, 224, 226, 228)),
    foregroundColor: MaterialStateProperty.all<Color>(Colors.white),
    surfaceTintColor: MaterialStateProperty.all<Color>(Colors.white),
  );

  /// 边框样式【灰色细边框】
  static const _borderSideStyle = BorderSide(
    color: Colors.black12,
    width: 1,
  );

  /// 固定的头部高度
  static const double _mainPanelTopHeight = 70;

  /// 头部的按钮宽度
  static const double _mainPanelTopButtonWidth = 60;

  /// 头部的按钮高度
  static const double _mainPanelTopButtonHeight = 32;

  /// 切换按钮的宽高
  static const double _changeMonthButtonSize = 32;

  /// icon 的大小
  static const double _iconSize = 20;

  /// 顶部【2022年XX月】文字样式
  static const TextStyle _yearMonthTextStyle = TextStyle(
    height: 1.2,
    fontSize: 18,
  );

  @override
  FWidget build(BuildContext context) {
    return FContainer(
      decoration: const BoxDecoration(
        border: Border(
          right: _borderSideStyle,
        ),
      ),
      child: FColumn(
        children: <FWidget>[
          _buildMainPanelTop(),
          FExpanded(
            child: FStack(
              children: [
                _buildMainView(_viewType),
                const PopupLayer(),
              ],
            ),
          ),
        ],
      ),
    );
  }

  /// 构建顶部【今天、年月、视图切换器、更多】
  FWidget _buildMainPanelTop() {
    return FSizedBox(
      height: _mainPanelTopHeight,
      child: FContainer(
        padding: const EdgeInsets.symmetric(horizontal: 10),
        child: FRow(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <FWidget>[
            _buildTodayButton(),
            _buildChangeMonthButtons(),
            _buildYearAndMonth(),
            FExpanded(
              child: FContainer(),
            ),

            /// TODO:[Gavin] 占位功能区，暂时屏蔽，待实现
            // _buildMoreButton(),
          ],
        ),
      ),
    );
  }

  /// 【回到今天】按钮
  FWidget _buildTodayButton() {
    return FSizedBox(
      width: _mainPanelTopButtonWidth,
      height: _mainPanelTopButtonHeight,
      child: FOutlinedButton(
        name: "backToTodayButton",
        businessParent: widget,
        style: ButtonStyle(
          overlayColor: MaterialStateProperty.all<Color>(
              const Color.fromARGB(255, 235, 235, 235)),
          foregroundColor: MaterialStateProperty.all<Color>(
              _isToday ? Colors.black26 : Colors.black),
          backgroundColor: MaterialStateProperty.all<Color>(Colors.transparent),
          padding: MaterialStateProperty.all<EdgeInsetsGeometry>(
              const EdgeInsets.all(0)),
          shadowColor: MaterialStateProperty.all<Color>(Colors.transparent),
        ),
        onPressed: _isToday ? null : calendarController.selectToday,
        child: FText(i18nBook.calendar.today.t),
      ),
    );
  }

  /// 【上个月、下个月】按钮
  FWidget _buildChangeMonthButtons() {
    return FContainer(
      margin: const EdgeInsets.symmetric(horizontal: 5),
      child: FRow(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <FWidget>[
          FSizedBox(
            width: _changeMonthButtonSize,
            height: _changeMonthButtonSize,
            child: FElevatedButton(
              name: "lastMonthButton",
              businessParent: widget,
              style: _iconButtonStyle,
              onPressed: () => calendarController.handleLastMonth(true),
              child: const FIcon(
                Icons.keyboard_arrow_left,
                size: _iconSize,
                color: Colors.black,
              ),
            ),
          ),
          FSizedBox(
            width: _changeMonthButtonSize,
            height: _changeMonthButtonSize,
            child: FElevatedButton(
              name: "nextMonthButton",
              businessParent: widget,
              style: _iconButtonStyle,
              onPressed: () => calendarController.handleNextMonth(true),
              child: const FIcon(
                Icons.keyboard_arrow_right,
                size: _iconSize,
                color: Colors.black,
              ),
            ),
          ),
        ],
      ),
    );
  }

  /// 年月
  FWidget _buildYearAndMonth() {
    return FAlign(
      alignment: Alignment.center,
      child: FText(
        _currYearMonthStr,
        style: _yearMonthTextStyle,
      ),
    );
  }

  /// 【更多】按钮
  FWidget _buildMoreButton() {
    return FSizedBox(
      width: _mainPanelTopButtonWidth,
      height: _mainPanelTopButtonHeight,
      child: FElevatedButton(
        name: "moreButton",
        businessParent: widget,
        style: _iconButtonStyle,
        onPressed: () {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(
              duration: Duration(milliseconds: 500),
              content: Text(i18nBook.calendar.todoPlaceholder.t),
            ),
          );
        },
        child: const FCenter(
          child: FIcon(
            Icons.more_horiz,
            size: _iconSize,
            color: Color.fromARGB(255, 116, 118, 119),
          ),
        ),
      ),
    );
  }

  /// 构建视图主体
  FWidget _buildMainView(CalendarViewType type) {
    switch (type) {
      case CalendarViewType.month:
        return const MonthCalendar();
      // TODO 周视图
      case CalendarViewType.week:
        return const MyCalendar();
      // TODO 日视图
      case CalendarViewType.day:
        return const MyCalendar();
      // TODO 列表视图
      case CalendarViewType.list:
        return const MyCalendar();
      default:
        return const MonthCalendar();
    }
  }
}
