import 'package:dreampad/app/shared/shared.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../controllers/home_controller.dart';
import '../widgets/user_widget.dart';

class ExploreView extends GetView<HomeController> {
  const ExploreView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: Images.studyBg,
            fit: BoxFit.fill,
          ),
        ),
        child: Scaffold(
          backgroundColor: Colors.transparent,
          body: buildBody(context),
        ),
      ),
    );
  }

  Widget buildBody(BuildContext context) {
    return Stack(
      children: [
        Positioned(
          left: 49.w,
          top: 50.h,
          child: UserWidget(
            account: controller.account,
            gender: controller.gender,
            occupationName: controller.occupationName,
            occupationId: controller.occupationId,
          ),
        ),
        buildTitle(context),
        Positioned(
          right: 40.w,
          top: 50.h,
          child: GestureDetector(
            onTap: () {
              Get.back();
            },
            child: Images.studyHome,
          ),
        ),
        Positioned(
          bottom: 16.h,
          left: 30.w,
          child: Container(
            height: 255.h,
            width: 135.w,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: Images.studyIp,
                fit: BoxFit.fill,
              ),
            ),
          ),
        ),
        Positioned(
          top: 172.h,
          left: 402.w,
          child: Container(
            height: 487.h,
            width: 431.w,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: Images.studyTreeBg,
                fit: BoxFit.fill,
              ),
            ),
          ),
        ),
        Positioned(
          top: 284.h,
          left: 52.w,
          child: Container(
            height: 138.w,
            width: 294.w,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: Images.welcomeDialog,
                fit: BoxFit.fill,
              ),
            ),
            padding: REdgeInsets.only(top: 27.0, left: 32.0, right: 19.0),
            child: Text(
              '每天要点亮2个知识点，我们才能进行自由探索哦～',
              style: TextStyles.mediumWhite18,
            ),
          ),
        ),
        buildKnowledge(context),
      ],
    );
  }

  Widget buildTitle(BuildContext context) {
    return Stack(
      children: [
        Positioned(
          left: 370.w,
          top: 0.h,
          child: Container(
            height: 72.h,
            width: 437.w,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: Images.studyTitleOccupation,
                fit: BoxFit.fill,
              ),
            ),
            child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  const RSizedBox(
                    height: 6.0,
                  ),
                  Text(
                    '梦想职业',
                    style: TextStyles.mediumWhiteShadow20_114,
                  ),
                  Text(
                    controller.occupationName,
                    style: TextStyles.boldWhiteShadow26_002,
                  ),
                ]),
          ),
        ),
        Positioned(
          left: 520.w,
          top: 72.h,
          child: Container(
            height: 30.h,
            width: 137.w,
            decoration: const BoxDecoration(
              image: DecorationImage(
                image: Images.studyTitleTask,
                fit: BoxFit.fill,
              ),
            ),
            child: Center(
              child: Text(
                '第${Utils.getDayString(controller.exploreDay.value)}天',
                style: TextStyles.mediumWhite18,
              ),
            ),
          ),
        ),
      ],
    );
  }

  Widget buildKnowledge(BuildContext context) {
    return Obx(
      () => Stack(
        children: controller.knowledgePoints.map((e) {
          return Positioned(
            top: e.value.top!.h,
            left: e.value.left != null ? e.value.left!.w : null,
            right: e.value.right != null ? e.value.right!.w : null,
            child: ConstrainedBox(
              constraints: BoxConstraints(minWidth: 214.w, minHeight: 68.h),
              child: GestureDetector(
                onTap: () async {
                  await controller.leareKnowledge(e.value);
                },
                child: Container(
                  padding: REdgeInsets.symmetric(horizontal: 9.0),
                  decoration: BoxDecoration(
                    image: DecorationImage(
                      image: e.value.leared!
                          ? Images.studyKnowledgePointPre
                          : Images.studyKnowledgePointDefault,
                      fit: BoxFit.fill,
                    ),
                  ),
                  child: Center(
                    child: Text(
                      e.value.title!,
                      style: e.value.leared!
                          ? TextStyles.boldWhiteShadow22_104
                          : TextStyles.mediumColor22,
                    ),
                  ),
                ),
              ),
            ),
          );
        }).toList(),
      ),
    );
  }
}