import 'package:ef/ef.dart';
import 'package:flutter/material.dart';
import 'package:vbvs_app/common/color/appConstants.dart';
import 'package:vbvs_app/common/util/CommonVariables.dart';
import 'package:vbvs_app/common/util/FitTool.dart';
import 'package:vbvs_app/common/util/MyUtils.dart';
import 'package:vbvs_app/component/tool/CustomCard.dart';
import 'package:vbvs_app/component/tool/TopSlideNotification.dart';
import 'package:vbvs_app/controller/time/countdown_controller.dart';
import 'package:vbvs_app/pages/common/selectDialog.dart';
import 'package:vbvs_app/pages/mh_page/user/controller/mht_register_controller.dart';

class RegisterPage extends GetView<MHTRegisterController> {
  final scaffoldKey = GlobalKey<ScaffoldState>();
  BoxConstraints? bodysize;

  final ScrollController _scrollController = ScrollController();

  RegisterPage() {
    controller.model.pdshow = true;
    controller.model.cpdshow = true;
  }

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(builder: (context, cc) {
      bodysize = cc;

      return GestureDetector(
          child: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage('assets/images/new_background.png'),
            fit: BoxFit.fill,
          ),
        ),
        child: Scaffold(
            backgroundColor: Colors.transparent,
            appBar: AppBar(
              backgroundColor: Colors.transparent,
              automaticallyImplyLeading: false,
              iconTheme: IconThemeData(color: Colors.white),
              titleSpacing: 0,
              title: Container(
                width: double.infinity,
                height: 180.rpx,
                child: Stack(
                  alignment: Alignment.center,
                  children: [
                    Text(
                      '用户注册',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 30.rpx,
                      ),
                    ),
                    Positioned(
                      left: 0.rpx,
                      child: returnIconButtomNew,
                    ),
                  ],
                ),
              ),
              actions: [],
              centerTitle: false,
            ),
            body: SingleChildScrollView(
              controller: _scrollController,
              child: Container(
                width: bodysize!.maxWidth,
                height: bodysize!.maxHeight * 1,
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  children: [
                    Expanded(
                      child: Padding(
                        padding: EdgeInsetsDirectional.fromSTEB(
                            98.rpx, 0, 98.rpx, 0),
                        child: Container(
                          width: bodysize!.maxWidth,
                          height: bodysize!.maxHeight * 0.886,
                          child: Container(
                            width: bodysize!.maxWidth,
                            height: bodysize!.maxHeight * 1,
                            child: Column(
                              mainAxisSize: MainAxisSize.max,
                              children: [                     
                                Align(
                                  alignment: AlignmentDirectional(-1, 0),
                                  child: Padding(
                                    padding: EdgeInsetsDirectional.fromSTEB(
                                        0, 184.rpx, 0, 0),
                                    child: Container(
                                      width: double.infinity,
                                      height: bodysize!.maxHeight * 0.06,
                                      decoration: BoxDecoration(
                                        color: Color(0xFFF3F5F6),
                                        borderRadius: BorderRadius.circular(12),
                                      ),
                                      constraints: BoxConstraints(
                                        minHeight: 92.rpx,
                                      ),
                                      child: Padding(
                                        padding: EdgeInsetsDirectional.fromSTEB(
                                            35.rpx, 0, 35.rpx, 0),
                                        child: Row(
                                          mainAxisSize: MainAxisSize.max,
                                          mainAxisAlignment:
                                              MainAxisAlignment.spaceBetween,
                                          children: [
                                            Expanded(
                                              child: Container(
                                                child: Align(
                                                  alignment:
                                                      AlignmentDirectional(
                                                          -1, 0),
                                                  child: TextFormField(
                                                    onChanged: (value) {
                                                      controller.model
                                                              .register_phone =
                                                          value;
                                                    },
                                                    decoration: InputDecoration(
                                                      isDense: true,
                                                      hintText: '请输入手机号'.tr,
                                                      hintStyle: TextStyle(
                                                        fontFamily:
                                                            'Readex Pro',
                                                        color:
                                                            Color(0xFF929699),
                                                        fontSize: 26.rpx,
                                                      ),
                                                      border: InputBorder.none,
                                                    ),
                                                    style: TextStyle(
                                                      fontFamily: 'Readex Pro',
                                                      fontSize: 26.rpx,
                                                      color: Colors.black,
                                                    ),
                                                  ),
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ),
                                ),
                                Align(
                                  alignment: AlignmentDirectional(-1, 0),
                                  child: Padding(
                                    padding: EdgeInsetsDirectional.fromSTEB(
                                        0, 32.rpx, 0, 0),
                                    child: Container(
                                      width: double.infinity,
                                      height: bodysize!.maxHeight * 0.06,
                                      decoration: BoxDecoration(
                                        color: Color(0xFFF3F5F6),
                                        borderRadius: BorderRadius.circular(12),
                                      ),
                                      constraints: BoxConstraints(
                                        minHeight: 92.rpx,
                                      ),
                                      child: Padding(
                                        padding: EdgeInsetsDirectional.fromSTEB(
                                            35.rpx, 0, 35.rpx, 0),
                                        child: Row(
                                          mainAxisSize: MainAxisSize.max,
                                          mainAxisAlignment:
                                              MainAxisAlignment.spaceBetween,
                                          children: [
                                            Expanded(
                                              child: Container(
                                                child: Align(
                                                  alignment:
                                                      AlignmentDirectional(
                                                          -1, 0),
                                                  child: Obx(() =>
                                                      TextFormField(
                                                        onChanged: (value) {
                                                          controller.model
                                                                  .register_pd =
                                                              value;
                                                        },
                                                        obscureText: controller
                                                            .model.pdshow!,
                                                        decoration:
                                                            InputDecoration(
                                                          isDense: true,
                                                          hintText: '请输入密码'.tr,
                                                          hintStyle: TextStyle(
                                                            fontFamily:
                                                                'Readex Pro',
                                                            color: Color(
                                                                0xFF929699),
                                                            fontSize: 26.rpx,
                                                          ),
                                                          border:
                                                              InputBorder.none,
                                                          suffixIcon:
                                                              IconButton(
                                                            icon: Icon(
                                                              controller.model
                                                                      .pdshow!
                                                                  ? Icons
                                                                      .visibility_off
                                                                  : Icons
                                                                      .visibility,
                                                              color: Color(
                                                                  0xFF333333),
                                                              size: 16,
                                                            ),
                                                            onPressed: () {
                                                              controller.model
                                                                      .pdshow =
                                                                  !controller
                                                                      .model
                                                                      .pdshow!;
                                                              controller
                                                                  .updateAll();
                                                            },
                                                          ),
                                                        ),
                                                        style: TextStyle(
                                                          fontFamily:
                                                              'Readex Pro',
                                                          fontSize: 26.rpx,
                                                          color: Colors.black,
                                                        ),
                                                      )),
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ),
                                ),

// 确认密码输入框
                                Align(
                                  alignment: AlignmentDirectional(-1, 0),
                                  child: Padding(
                                    padding: EdgeInsetsDirectional.fromSTEB(
                                        0, 32.rpx, 0, 0),
                                    child: Container(
                                      width: double.infinity,
                                      height: bodysize!.maxHeight * 0.06,
                                      decoration: BoxDecoration(
                                        color: Color(0xFFF3F5F6),
                                        borderRadius: BorderRadius.circular(12),
                                      ),
                                      constraints: BoxConstraints(
                                        minHeight: 92.rpx,
                                      ),
                                      child: Padding(
                                        padding: EdgeInsetsDirectional.fromSTEB(
                                            35.rpx, 0, 35.rpx, 0),
                                        child: Row(
                                          mainAxisSize: MainAxisSize.max,
                                          mainAxisAlignment:
                                              MainAxisAlignment.spaceBetween,
                                          children: [
                                            Expanded(
                                              child: Container(
                                                child: Align(
                                                  alignment:
                                                      AlignmentDirectional(
                                                          -1, 0),
                                                  child: Obx(() =>
                                                      TextFormField(
                                                        onChanged: (value) {
                                                          controller.model
                                                                  .register_confirm_pd =
                                                              value;
                                                        },
                                                        obscureText: controller
                                                            .model.cpdshow!,
                                                        decoration:
                                                            InputDecoration(
                                                          isDense: true,
                                                          hintText:
                                                              '请输入确认密码'.tr,
                                                          hintStyle: TextStyle(
                                                            fontFamily:
                                                                'Readex Pro',
                                                            color: Color(
                                                                0xFF929699),
                                                            fontSize: 26.rpx,
                                                          ),
                                                          border:
                                                              InputBorder.none,
                                                          suffixIcon:
                                                              IconButton(
                                                            icon: Icon(
                                                              controller.model
                                                                      .pdshow!
                                                                  ? Icons
                                                                      .visibility_off
                                                                  : Icons
                                                                      .visibility,
                                                              color: Color(
                                                                  0xFF333333),
                                                              size: 16,
                                                            ),
                                                            onPressed: () {
                                                              controller.model
                                                                      .cpdshow =
                                                                  !controller
                                                                      .model
                                                                      .cpdshow!;
                                                              controller
                                                                  .updateAll();
                                                            },
                                                          ),
                                                        ),
                                                        style: TextStyle(
                                                          fontFamily:
                                                              'Readex Pro',
                                                          fontSize: 26.rpx,
                                                          color: Colors.black,
                                                        ),
                                                      )),
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ),
                                ),

// 验证码输入框
                                Align(
                                  alignment: AlignmentDirectional(-1, 0),
                                  child: Padding(
                                    padding: EdgeInsetsDirectional.fromSTEB(
                                        0, 32.rpx, 0, 0),
                                    child: Container(
                                      width: double.infinity,
                                      height: bodysize!.maxHeight * 0.06,
                                      decoration: BoxDecoration(
                                        color: Color(0xFFF3F5F6),
                                        borderRadius: BorderRadius.circular(12),
                                      ),
                                      constraints: BoxConstraints(
                                        minHeight: 92.rpx,
                                      ),
                                      child: Padding(
                                        padding: EdgeInsetsDirectional.fromSTEB(
                                            35.rpx, 0, 35.rpx, 0),
                                        child: Row(
                                          mainAxisSize: MainAxisSize.max,
                                          mainAxisAlignment:
                                              MainAxisAlignment.spaceBetween,
                                          children: [
                                            Expanded(
                                              child: Container(
                                                child: Align(
                                                  alignment:
                                                      AlignmentDirectional(
                                                          -1, 0),
                                                  child: TextFormField(
                                                    onChanged: (value) {
                                                      controller.model
                                                              .register_code =
                                                          value;
                                                    },
                                                    decoration: InputDecoration(
                                                      isDense: true,
                                                      hintText: '请输入验证码',
                                                      hintStyle: TextStyle(
                                                        fontFamily:
                                                            'Readex Pro',
                                                        color:
                                                            Color(0xFF929699),
                                                        fontSize: 26.rpx,
                                                      ),
                                                      border: InputBorder.none,
                                                    ),
                                                    style: TextStyle(
                                                      fontFamily: 'Readex Pro',
                                                      fontSize: 26.rpx,
                                                      color: Colors.black,
                                                    ),
                                                  ),
                                                ),
                                              ),
                                            ),
                                            Container(
                                              width: 1.rpx,
                                              height: 38.rpx,
                                              color: Color(0xFF929699),
                                            ),
                                            Obx(() {
                                              final countdownController = Get
                                                  .find<CountdownController>();
                                              return InkWell(
                                                onTap: () async {
                                                  if (countdownController
                                                          .countdown.value !=
                                                      0) return;
                                                  String msg = await controller
                                                      .getCode(context);
                                                  if (msg.isEmpty) {
                                                    countdownController
                                                        .startCountdown(
                                                            AppConstants
                                                                .code_time);
                                                  }
                                                },
                                                child: Text(
                                                  countdownController.countdown
                                                              .value ==
                                                          0
                                                      ? '获取验证码'.tr
                                                      : '${countdownController.countdown.value}秒'
                                                          .tr,
                                                  style: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    color: Color(0xFF333333),
                                                    fontSize: 20.rpx,
                                                  ),
                                                ),
                                              );
                                            }),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ),
                                ),
                                // 其他部分保持不变...
                                Padding(
                                  padding: EdgeInsetsDirectional.fromSTEB(
                                      0, 19, 0, 0),
                                  child: Container(
                                    width: bodysize!.maxWidth,
                                    height: bodysize!.maxHeight * 0.022,
                                    constraints: BoxConstraints(
                                      minWidth: 466,
                                      minHeight: 30,
                                    ),
                                    decoration: BoxDecoration(),
                                    child: Container(
                                      width: bodysize!.maxWidth,
                                      height: bodysize!.maxHeight * 0.022,
                                      constraints: BoxConstraints(
                                        minWidth: 466,
                                        minHeight: 30,
                                      ),
                                      decoration: BoxDecoration(),
                                      child: Row(
                                        mainAxisSize: MainAxisSize.max,
                                        mainAxisAlignment:
                                            MainAxisAlignment.start,
                                        children: [
                                          Align(
                                            alignment:
                                                AlignmentDirectional(0, 0),
                                            child: Padding(
                                              padding: EdgeInsetsDirectional
                                                  .fromSTEB(0, 3, 0, 0),
                                              child: Container(
                                                width: 36,
                                                height: 36,
                                                decoration: BoxDecoration(),
                                                child: Align(
                                                  alignment:
                                                      AlignmentDirectional(
                                                          0, 0),
                                                  child: Theme(
                                                      data: ThemeData(
                                                        checkboxTheme:
                                                            CheckboxThemeData(
                                                          visualDensity:
                                                              VisualDensity
                                                                  .compact,
                                                          materialTapTargetSize:
                                                              MaterialTapTargetSize
                                                                  .shrinkWrap,
                                                          shape:
                                                              RoundedRectangleBorder(
                                                            borderRadius:
                                                                BorderRadius
                                                                    .circular(
                                                                        64),
                                                          ),
                                                        ),
                                                        unselectedWidgetColor:
                                                            Color(0xFFD3D3D3),
                                                      ),
                                                      child: Obx(
                                                        () => Checkbox(
                                                          value: controller
                                                                  .model
                                                                  .register_agree ??
                                                              false,
                                                          onChanged:
                                                              (newValue) async {
                                                            controller.model
                                                                    .register_agree =
                                                                newValue;

                                                            controller
                                                                .updateAll();
                                                          },
                                                          side: BorderSide(
                                                            width: 1.5,
                                                            color: Colors.white,
                                                          ),
                                                          activeColor:
                                                              const Color(
                                                                  0xFF84F5FF),
                                                          checkColor:
                                                              Color(0xFF003058),
                                                          visualDensity:
                                                              VisualDensity(
                                                                  horizontal:
                                                                      -4.0,
                                                                  vertical:
                                                                      -4.0),
                                                        ),
                                                      )),
                                                ),
                                              ),
                                            ),
                                          ),
                                          Flexible(
                                            child: Padding(
                                              padding: EdgeInsetsDirectional
                                                  .fromSTEB(0, 0, 0, 0),
                                              child: Container(
                                                width:
                                                    MediaQuery.sizeOf(context)
                                                            .width *
                                                        0.622,
                                                height:
                                                    MediaQuery.sizeOf(context)
                                                            .height *
                                                        1,
                                                constraints: BoxConstraints(
                                                  minWidth: 466,
                                                  minHeight: 30,
                                                ),
                                                decoration: BoxDecoration(),
                                                child: Container(
                                                  width: 100,
                                                  height: 100,
                                                  decoration: BoxDecoration(),
                                                  child: Row(
                                                    mainAxisSize:
                                                        MainAxisSize.max,
                                                    children: [
                                                      Align(
                                                        alignment:
                                                            AlignmentDirectional(
                                                                0, 0),
                                                        child: Text(
                                                          '我已阅读并同意'.tr,
                                                          style: TextStyle(
                                                            fontFamily:
                                                                'Readex Pro',
                                                            color: Colors.white,
                                                            fontSize: 12,
                                                            letterSpacing: 0,
                                                          ),
                                                        ),
                                                      ),
                                                      Align(
                                                        alignment:
                                                            AlignmentDirectional(
                                                                0, 0),
                                                        child: InkWell(
                                                          onTap: () {
                                                            showCustomConfirmOfWebViewDialog(
                                                                context,
                                                                "用户协议",
                                                                "/#/pages/agreement/agreement?type=2&hideHead=true");
                                                          },
                                                          child: Text(
                                                            '《用户协议》'.tr,
                                                            style: TextStyle(
                                                              fontFamily:
                                                                  'Readex Pro',
                                                              color:
                                                                  stringToColor(
                                                                      "FF9F66"),
                                                              fontSize: 12,
                                                              letterSpacing: 0,
                                                            ),
                                                          ),
                                                        ),
                                                      ),
                                                      Align(
                                                        alignment:
                                                            AlignmentDirectional(
                                                                0, 0),
                                                        child: Text(
                                                          '与'.tr,
                                                          style: TextStyle(
                                                            fontFamily:
                                                                'Readex Pro',
                                                            color: Colors.white,
                                                            fontSize: 12,
                                                            letterSpacing: 0,
                                                          ),
                                                        ),
                                                      ),
                                                      Align(
                                                        alignment:
                                                            AlignmentDirectional(
                                                                0, 0),
                                                        child: InkWell(
                                                          onTap: () {
                                                            showCustomConfirmOfWebViewDialog(
                                                                context,
                                                                "隐私协议",
                                                                "/#/pages/agreement/agreement?type=1&hideHead=true");
                                                          },
                                                          child: Text(
                                                            '《隐私协议》'.tr,
                                                            style: TextStyle(
                                                              fontFamily:
                                                                  'Readex Pro',
                                                              color:
                                                                  stringToColor(
                                                                      "FF9F66"),
                                                              fontSize: 12,
                                                              letterSpacing: 0,
                                                            ),
                                                          ),
                                                        ),
                                                      ),
                                                    ],
                                                  ),
                                                ),
                                              ),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  ),
                                ),
                                Padding(
                                  padding: EdgeInsetsDirectional.fromSTEB(
                                      0, 29, 0, 0),
                                  child: Container(
                                      width: bodysize!.maxWidth,
                                      height: bodysize!.maxHeight * 0.056,
                                      decoration: BoxDecoration(),
                                      child: CustomCard(
                                        borderRadius: 16.rpx,
                                        gradientDirection:
                                            GradientDirection.vertical,
                                        onTap: () async {
                                          if (CommonVariables.isNetWorkOn ==
                                              false) {
                                            TopSlideNotification.show(context,
                                                text: "网络未连接，请开启设备网络后重试".tr,
                                                textColor: themeController
                                                    .currentColor.sc9);
                                            return;
                                          }
                                          String msg = await controller
                                              .registerUser(context);
                                          if (msg == null || msg.isEmpty) {
                                            Get.toNamed("/loginPage");
                                          }
                                        },
                                        colors: const [
                                          Color(0xFFFCFCFC),
                                          Color(0xFFF8FAF9),
                                          Color(0XFFECF6F3),
                                          Color(0XFFD9F0E9),
                                          Color(0xFFCEECE3)
                                        ],
                                        child: Container(
                                          width: double.infinity,
                                          height: 90.rpx,
                                          alignment: Alignment.center,
                                          decoration: BoxDecoration(
                                            borderRadius:
                                                BorderRadius.circular(16.rpx),
                                          ),
                                          child: Text(
                                            "提交".tr,
                                            style: TextStyle(
                                              fontFamily: 'Readex Pro',
                                              color: stringToColor("#011D33"),
                                              letterSpacing: 0,
                                              fontSize: 30.rpx,
                                            ),
                                          ),
                                        ),
                                      )),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            )),
      ));
    });
  }
}
