import 'package:fis_common/index.dart';
import 'package:fis_i18n/i18n.dart';
import 'package:fis_theme/theme.dart';
import 'package:fis_ui/base_define/page.dart';
import 'package:fis_ui/index.dart';
import 'package:flutter/material.dart';

class ExamPage extends FStatefulWidget implements FPage {
  @override
  String get pageName => 'ExamPage';

  @override
  FState<FStatefulWidget> createState() {
    return ExamPageState();
  }
}

class ExamPageState extends FState<ExamPage> {
  @override
  FWidget build(BuildContext context) {
    return FContainer(
      color: Color.fromRGBO(246, 246, 246, 1),
      child: FRow(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          FExpanded(child: FSizedBox()),
          FContainer(
            padding: EdgeInsets.only(left: 15),
            color: Colors.white,
            width: 1000,
            child: FColumn(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                FSizedBox(
                  width: double.infinity,
                  child: _buildExamHeader(),
                ),
                _buildExamContent(),
              ],
            ),
          ),
          FExpanded(
            child: _buildExamInfos(),
          ),
        ],
      ),
    );
  }

  FWidget _buildExamContent() {
    return FExpanded(
      child: FListView(
        shrinkWrap: true,
        children: [
          FColumn(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildExamTitle(),
              _buildSpace(),
              _MultipleChoiceQuestionItem(
                i18nBook.college.question1.t,
                i18nBook.college.question1OptionA.t,
                i18nBook.college.question1OptionB.t,
                i18nBook.college.question1OptionC.t,
                '',
              ),
              _buildSpace(),
              _MultipleChoiceQuestionItem(
                i18nBook.college.question2.t,
                i18nBook.college.question2OptionA.t,
                i18nBook.college.question2OptionB.t,
                i18nBook.college.question2OptionC.t,
                '',
              ),
              _buildSpace(),
              _MultipleChoiceQuestionItem(
                i18nBook.college.question3.t,
                i18nBook.college.question3OptionA.t,
                i18nBook.college.question3OptionB.t,
                i18nBook.college.question3OptionC.t,
                '',
              ),
              _buildSpace(),
              _MultipleChoiceQuestionItem(
                '4.${i18nBook.college.question4_title.t}',
                i18nBook.college.question4_optionA.t,
                i18nBook.college.question4_optionB.t,
                i18nBook.college.question4_optionC.t,
                '',
              ),
              _buildSpace(),
              _MultipleChoiceQuestionItem(
                '5.${i18nBook.college.question5_promptA.t}',
                i18nBook.college.question5_promptA.t,
                i18nBook.college.question5_promptB.t,
                i18nBook.college.question5_promptC.t,
                '',
              ),
            ],
          ),
        ],
      ),
    );
  }

  FWidget _MultipleChoiceQuestionItem(
      String title, String a, String b, String c, String d) {
    return FColumn(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        _buildExamQuestions(title),
        _buildOptions(a, b, c, d),
      ],
    );
  }

  FWidget _buildExamHeader() {
    return FContainer(
      width: double.infinity,
      child: FColumn(
        children: [
          FText(
            i18nBook.college.test_paper_title.t,
            style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
          ),
          FSizedBox(
            height: 10,
          ),
          FText(
            i18nBook.college.test_paper_intro.t,
            style: TextStyle(color: Colors.grey[600]),
          ),
        ],
      ),
    );
  }

  FWidget _buildExamTitle() {
    return FText(
      '1.${i18nBook.college.question_card_single_choice.t}（${i18nBook.college.question_total.translate([
            '5',
            20
          ])}）',
      style: TextStyle(fontWeight: FontWeight.bold),
    );
  }

  FWidget _buildSpace() {
    return const FSizedBox(height: 10);
  }

  FWidget _buildExamQuestions(String text) {
    return FText(
      text,
      style: TextStyle(
        fontSize: 20,
      ),
    );
  }

  FWidget _buildOptions(String? a, String? b, String? c, String? d) {
    return FContainer(
      padding: EdgeInsets.only(left: 15),
      child: FColumn(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          if (a.isNotNullOrEmpty) ...[
            _buildSpace(),
            _buildOption(
              a!,
              () {},
            ),
            _buildSpace(),
          ],
          if (b.isNotNullOrEmpty) ...[
            _buildOption(b!, () {}),
            _buildSpace(),
          ],
          if (c.isNotNullOrEmpty) ...[
            _buildOption(
              c!,
              () {},
              isSelected: c.contains(i18nBook.college.question1OptionC.t),
            ),
            _buildSpace(),
          ],
          _buildSpace(),
          if (d.isNotNullOrEmpty) ...[
            _buildOption(d!, () {}),
            _buildSpace(),
          ],
        ],
      ),
    );
  }

  FWidget _buildOption(String text, void Function()? onTap,
      {bool isSelected = false, bool isMultipleSelection = false}) {
    return FMouseRegion(
      cursor: SystemMouseCursors.click,
      child: FInkWell(
        onTap: onTap,
        child: FRow(
          children: [
            if (isSelected) ...[
              FIcon(
                Icons.check_circle,
                color: Colors.green,
              ),
            ] else ...[
              FIcon(
                Icons.circle_outlined,
                color: Colors.grey,
              ),
            ],
            FSizedBox(width: 5),
            FText(text),
          ],
        ),
      ),
    );
  }

  FWidget _buildExamInfos() {
    return FColumn(
      children: [
        FContainer(
          color: Colors.white,
          width: 300,
          margin: EdgeInsets.all(20),
          padding: EdgeInsets.all(20),
          child: _buildExamTime(),
        ),
        _buildSpace(),
        _buildAnswerSheet(),
      ],
    );
  }

  FWidget _buildExamTime() {
    return FColumn(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        _buildSpace(),
        FText(i18nBook.college.test_time_countdown.t),
        _buildSpace(),
        FText(
          '00:50:20',
          style: TextStyle(
            color: FTheme.ins.colorScheme.secondary,
            fontSize: 20,
          ),
        ),
        _buildSpace(),
        FRow(
          children: [
            FText(
              i18nBook.college.question_done.translate(['1']),
              style: TextStyle(
                color: FTheme.ins.colorScheme.secondary,
              ),
            ),
            FExpanded(child: FSizedBox()),
            FText(
              i18nBook.college.question_total.translate(['20', '100']),
              style: TextStyle(
                color: Colors.grey[400],
              ),
            ),
          ],
        ),
      ],
    );
  }

  FWidget _buildAnswerSheet() {
    return FContainer(
      padding: EdgeInsets.all(20),
      margin: EdgeInsets.all(20),
      color: Colors.white,
      width: 300,
      child: FColumn(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          FText(i18nBook.college.question_card_title.t),
          FContainer(
            margin: EdgeInsets.symmetric(horizontal: 10),
            child: FDivider(
              color: Colors.grey[200],
            ),
          ),
          _buildSpace(),
          _buildNumTitle(i18nBook.college.question_card_single_choice.t,
              '(${i18nBook.college.question_total.translate(['5', '25'])})'),
          _buildSpace(),
          FRow(
            children: [
              _buildNum('1', Colors.white, FTheme.ins.colorScheme.primary),
              _buildNum('2', Colors.white, Colors.grey),
              _buildNum('3', Colors.white, Colors.grey),
              _buildNum('4', Colors.white, Colors.grey),
              _buildNum('5', Colors.white, Colors.grey),
            ],
          ),
          _buildSpace(),
          _buildNumTitle(i18nBook.college.question_card_multi_choice.t,
              '(${i18nBook.college.question_total.translate(['5', '25'])})'),
          _buildSpace(),
          FRow(
            children: [
              _buildNum('1', Colors.white, Colors.grey),
              _buildNum('2', Colors.white, Colors.grey),
              _buildNum('3', Colors.white, Colors.grey),
              _buildNum('4', Colors.white, Colors.grey),
              _buildNum('5', Colors.white, Colors.grey),
            ],
          ),
          _buildSpace(),
          _buildNumTitle(i18nBook.college.question_card_fill_in_blanks.t,
              '(${i18nBook.college.question_total.translate(['5', '25'])})'),
          _buildSpace(),
          FRow(
            children: [
              _buildNum('1', Colors.white, Colors.grey),
              _buildNum('2', Colors.white, Colors.grey),
              _buildNum('3', Colors.white, Colors.grey),
              _buildNum('4', Colors.white, Colors.grey),
              _buildNum('5', Colors.white, Colors.grey),
            ],
          ),
          _buildSpace(),
          _buildNumTitle(i18nBook.college.question_card_short_answer.t,
              '(${i18nBook.college.question_total.translate(['5', '25'])})'),
          _buildSpace(),
          FRow(
            children: [
              _buildNum('1', Colors.white, Colors.grey),
              _buildNum('2', Colors.white, Colors.grey),
              _buildNum('3', Colors.white, Colors.grey),
              _buildNum('4', Colors.white, Colors.grey),
              _buildNum('5', Colors.white, Colors.grey),
            ],
          ),
          _buildSpace(),
        ],
      ),
    );
  }

  FWidget _buildNum(String text, Color textColor, Color background) {
    return FContainer(
      color: background,
      alignment: Alignment.center,
      width: 25,
      margin: EdgeInsets.only(right: 15),
      child: FText(
        text,
        style: TextStyle(color: textColor),
      ),
    );
  }

  FWidget _buildNumTitle(String text, String subText) {
    return FRichText(
      text: TextSpan(
        children: [
          TextSpan(
            text: text,
            style: TextStyle(
              fontWeight: FontWeight.w500,
              fontFamily: FTheme.ins.localeSetting.fontFamily,
            ),
          ),
          TextSpan(
            text: subText,
            style: TextStyle(
              color: Colors.grey[400],
            ),
          ),
        ],
      ),
    );
  }
}
