import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:star_lock/main/lockDetail/palm/addPalm/addPalm_logic.dart';

import '../../../../../app_settings/app_colors.dart';
import '../../../../../tools/submitBtn.dart';
import '../../../../../tools/titleAppBar.dart';
import '../../../../../translations/trans_lib.dart';

class AddPalmPage extends StatefulWidget {
  const AddPalmPage({Key? key}) : super(key: key);

  @override
  State<AddPalmPage> createState() => _AddPalmPageState();
}

class _AddPalmPageState extends State<AddPalmPage> {
  final logic = Get.put(AddPalmLogic());
  final state = Get.find<AddPalmLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: TitleAppBar(
          barTitle: "${TranslationLoader.lanKeys!.addTip!.tr}手掌",
          haveBack: true,
          backgroundColor: AppColors.mainColor),
      body: ListView(
        children: [
          SizedBox(
            height: 50.h,
          ),
          Obx(() => Image.asset(
                state.isClickAddFace.value == false
                    ? 'images/main/icon_addPalm_step1.png'
                    : 'images/main/icon_addPalm_step1.png',
                width: 100.w,
                height: 457.h,
                fit: BoxFit.fitHeight,
              )),
          SizedBox(
            height: 60.h,
          ),
          Container(
            padding: EdgeInsets.only(left: 20.w, right: 20.w),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Expanded(
                  child: Text(
                    "请自然张开手掌，掌心正对摄像头，距离约一个成年\n人手掌宽度(约10厘米)。",
                    textAlign: TextAlign.left,
                    maxLines: null,
                    style:
                        TextStyle(fontSize: 24.sp, fontWeight: FontWeight.w600),
                  ),
                ),
              ],
            ),
          ),
          SizedBox(
            height: 120.h,
          ),
          Obx(
            () => state.isClickAddFace.value == false
                ? Container(
                    padding: EdgeInsets.only(left: 20.w, right: 20.w),
                    child: SubmitBtn(
                        btnName: "准备好了，开始添加",
                        borderRadius: 20.w,
                        onClick: () {
                          state.isClickAddFace.value = true;
                        }),
                  )
                : Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        '正在录入中...',
                        style: TextStyle(
                            color: AppColors.darkGrayTextColor,
                            fontSize: 22.sp),
                        textAlign: TextAlign.center,
                      )
                    ],
                  ),
          )
        ],
      ),
    );
  }
}