YY-Hotel-Business-ER/packages/cpt_auth/lib/modules/login/login_page.dart

import 'package:cs_resources/constants/color_constants.dart';
import 'package:cs_resources/generated/assets.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:plugin_basic/base/base_stateful_page.dart';
import 'package:plugin_basic/base/base_state.dart';
import 'package:plugin_basic/base/mixin_state_lifecycle.dart';
import 'package:plugin_basic/utils/ext_get_nav.dart';
import 'package:router/path/router_path.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_button.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/my_text_field.dart';
import 'package:widgets/my_text_view.dart';
import 'package:widgets/widget_export.dart';
import 'login_controller.dart';
import 'login_state.dart';

/*
   App 登录页面
 */
class LoginPage extends BaseStatefulPage<LoginController> {
  LoginPage({super.key});

  //启动当前页面
  static void startInstance() {
    return Get.start(RouterPath.AUTH_LOGIN, launchModel: LaunchModel.standard);
  }

  static void startWithPopAll() {
    Get.offAllNamed(RouterPath.AUTH_LOGIN);
  }

  @override
  State<LoginPage> createState() => _MainPageState();

  @override
  LoginController createRawController() {
    return LoginController();
  }
}

/**
 * 页面
 */
class _MainPageState extends BaseState<LoginPage, LoginController> with StateLifecycle {
  late LoginState state;

  @override
  void initState() {
    super.initState();
    state = controller.state;
  }

  @override
  void dispose() {
    Get.delete<LoginController>();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    Log.d("LoginPage Lifecycle - build走了一遍");

    return autoCtlGetBuilder(
      builder: (controller) {
        return Scaffold(
          body: Container(
            width: double.infinity,
            height: double.infinity,
            decoration: const BoxDecoration(
              gradient: LinearGradient(
                colors: [
                  Color(0xFF091D44),
                  Color(0xFF245A8A),
                  Color(0xFF7F7CEC),
                ],
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
              ),
            ),
            child: SingleChildScrollView(
              scrollDirection: Axis.vertical,
              physics: const BouncingScrollPhysics(),
              child: Column(
                mainAxisSize: MainAxisSize.max,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  //顶部Logo
                  MyAssetImage(
                    Assets.assetsYyBusinessTopLogo,
                    width: 164.5,
                    height: 101,
                  ).marginOnly(top: 75),

                  //中间的输入框布局
                  Container(
                    width: double.infinity,
                    margin: EdgeInsets.symmetric(vertical: 45, horizontal: 15),
                    padding: EdgeInsets.symmetric(vertical: 33, horizontal: 20),
                    decoration: BoxDecoration(
                      color: Color(0xFF4DCFF6).withOpacity(0.2), // 设置背景颜色和不透明度
                      borderRadius: BorderRadius.circular(5.0), // 设置圆角
                    ),
                    child: Center(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          //登录文本
                          MyTextView(
                            "Login Code".tr,
                            isFontMedium: true,
                            fontSize: 17,
                            textColor: ColorConstants.white,
                          ),

                          // 登录表单 - 账号
                          _buildInputLayout(
                            "code",
                            textInputAction: TextInputAction.next,
                            errorText: controller.codeErrorText,
                            onSubmit: (formKey, value) {
                              state.formData[formKey]!['focusNode'].unfocus();
                              FocusScope.of(context).requestFocus(state.formData['password']!['focusNode']);
                            },
                          ),

                          //密码文本
                          MyTextView(
                            "Password".tr,
                            isFontMedium: true,
                            fontSize: 17,
                            textColor: ColorConstants.white,
                            marginTop: 18,
                          ),

                          // 登录表单 - 密码
                          _buildInputLayout(
                            "password",
                            obscureText: !controller.pwdVisibility,
                            errorText: controller.passwordErrorText,
                            showRightIcon: true,
                            rightWidget: IconButton(
                              highlightColor: Colors.transparent,
                              splashColor: Colors.transparent,
                              icon: controller.pwdVisibility
                                  ? const MyAssetImage(
                                      Assets.cptAuthPasswordShowIcon,
                                      width: 21,
                                      height: 21,
                                      color: ColorConstants.white,
                                    )
                                  : const MyAssetImage(
                                      Assets.cptAuthPasswordHideIcon,
                                      width: 21,
                                      height: 21,
                                      color: ColorConstants.white,
                                    ),
                              onPressed: () {
                                controller.switchPwdVisibility();
                              },
                            ),
                            onSubmit: (formKey, value) {
                              state.formData[formKey]!['focusNode'].unfocus();
                              controller.doInputLogin();
                            },
                          ),

                          MyButton(
                            type: ClickType.throttle,
                            milliseconds: 500,
                            onPressed: () {
                              FocusScope.of(context).unfocus();
                              controller.doInputLogin();
                            },
                            text: "Log in".tr,
                            textColor: ColorConstants.white,
                            fontSize: 16,
                            radius: 22.5,
                            backgroundColor: hexToColor("#FFBB1B"),
                            fontWeight: FontWeight.w500,
                          ).marginOnly(top: 31)
                        ],
                      ),
                    ), // 传递子部件
                  ),
                ],
              ),
            ),
          ),
        );
      },
    );
  }

  /// 输入框 账号与密码
  _buildInputLayout(
    String key, {
    double marginTop = 0,
    bool? showRightIcon = false, //是否展示右侧的布局
    Widget? rightWidget, //右侧的布局
    TextInputType textInputType = TextInputType.text,
    String? errorText,
    bool obscureText = false,
    TextInputAction textInputAction = TextInputAction.done,
    Function? onSubmit,
  }) {
    return IgnoreKeyboardDismiss(
      child: MyTextField(
        key,
        state.formData[key]!['value'],
        hintText: state.formData[key]!['hintText'],
        hintStyle: TextStyle(
          color: hexToColor("#AECAE5"),
          fontSize: 15.0,
          fontWeight: FontWeight.w500,
        ),
        controller: state.formData[key]!['controller'],
        focusNode: state.formData[key]!['focusNode'],
        margin: EdgeInsets.only(top: marginTop),
        showDivider: true,
        dividerColor: hexToColor("#7BABC8"),
        style: TextStyle(
          color: ColorConstants.white,
          fontSize: 15.0,
          fontWeight: FontWeight.w500,
        ),
        inputType: textInputType,
        height: 35,
        textInputAction: textInputAction,
        onSubmit: onSubmit,
        cursorColor: ColorConstants.white,
        obscureText: obscureText,
        errorText: errorText,
        showLeftIcon: true,
        showRightIcon: showRightIcon,
        rightWidget: rightWidget,
      ),
    );
  }
}