liangchengyou / wow_english

  import 'package:flutter/gestures.dart';

  import 'package:flutter/material.dart';
  import 'package:flutter_bloc/flutter_bloc.dart';

  import 'package:flutter_screenutil/flutter_screenutil.dart';

  import 'package:wow_english/common/core/app_consts.dart';

  import 'package:wow_english/common/extension/string_extension.dart';

  import 'package:wow_english/common/widgets/textfield_customer_widget.dart';

  import 'package:wow_english/pages/login/loginpage/time_widget.dart';

  import 'package:wow_english/route/route.dart';

  import 'bloc/login_bloc.dart';
  

  class LoginPage extends StatelessWidget {

    const LoginPage({super.key});

  
    @override
    Widget build(BuildContext context) {

      return BlocProvider(
        create: (context) => LoginBloc(),

        child: _LoginPageView(),
      );
    }
  }
  
  class _LoginPageView extends StatelessWidget {
    @override
    Widget build(BuildContext context) {

      return BlocListener<LoginBloc, LoginState>(
        listener: (context, state) {
          if (state is LoginResultChangeState) {

            // 调试用
            // Navigator.of(context).pushNamed(AppRouteName.home);

            pushNamedAndRemoveUntil(AppRouteName.home, (route) => false);

          }
        },

        child: _buildLoginViewWidget(),
      );
    }
  

    Widget _buildLoginViewWidget() => BlocBuilder<LoginBloc, LoginState>(

      builder: (context, state) {
        final bloc = BlocProvider.of<LoginBloc>(context);
        return Scaffold(
          body: SafeArea(
            child: SingleChildScrollView(
              child: Container(
                padding: EdgeInsets.only(top: 25.h),
                child: Stack(
                  children: [
                    Positioned(
                        right: 29.w,
                        child: GestureDetector(
                          onTap: () => bloc.add(ChangeLoginTypeEvent()),
                          child: Container(
                            decoration: BoxDecoration(
                              image: DecorationImage(image: AssetImage('login_logo'.assetPng), fit: BoxFit.fill),
                            ),
                            padding: EdgeInsets.symmetric(horizontal: 18.w, vertical: 5.h),
                            child: Text(
                              bloc.isSmsLoginType ? '密码登录' : '验证码登录',
                              style: TextStyle(fontSize: 16.sp),
                            ),
                          ),
                        )),
                    Center(
                      child: Column(
                        children: [
                          Image.asset(
                            'wow_logo'.assetPng,
                            height: 81.h,
                            width: 131.w,
                          ),
                          Offstage(
                            offstage: !bloc.isSmsLoginType,
                            child: _buildSmsViewWidget(),
                          ),
                          Offstage(
                            offstage: bloc.isSmsLoginType,
                            child: _buildPwdViewWidget(),
                          ),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.center,

                            children: [

                              GestureDetector(

                                onTap: () => bloc.add(AgreementChangeEvent()),
                                child: Icon(bloc.agreement ? Icons.check_circle_outlined : Icons.circle_outlined,
                                    color: bloc.agreement ? Colors.green : Colors.black),
                              ),
                              6.horizontalSpace,
                              RichText(
                                text: TextSpan(children: [
                                  TextSpan(
                                      text: '我已阅读并同意',
                                      style: TextStyle(
                                        fontSize: 12.sp,
                                        color: const Color(0xFF333333),
                                      )),
                                  TextSpan(
                                      text: '《用户隐私协议》',
                                      style: TextStyle(
                                        fontSize: 12.sp,
                                        color: const Color(0xFF333333),
                                      ),
                                      recognizer: TapGestureRecognizer()
                                        ..onTap = () {
                                          Navigator.of(context).pushNamed(AppRouteName.webView, arguments: {
                                            'urlStr': AppConsts.userPrivacyPolicyUrl,
                                            'webViewTitle': '用户隐私协议'
                                          });
                                        }),
                                  TextSpan(
                                      text: '，', style: TextStyle(fontSize: 12.sp, color: const Color(0xFF333333))),
                                  TextSpan(
                                      text: '《儿童隐私政策》',
                                      style: TextStyle(fontSize: 12.sp, color: const Color(0xFF333333)),
                                      recognizer: TapGestureRecognizer()
                                        ..onTap = () {
                                          Navigator.of(context).pushNamed(AppRouteName.webView, arguments: {
                                            'urlStr': AppConsts.childrenPrivacyPolicyUrl,
                                            'webViewTitle': '儿童隐私协议'
                                          });
                                        })
                                ]),

                              )
                            ],
                          ),

                          GestureDetector(
                            onTap: () {
                              if (bloc.canLogin) {
                                bloc.add(RequestLoginEvent());
                              }
                            },
                            child: Container(
                              decoration: BoxDecoration(
                                image: DecorationImage(
                                    image: AssetImage(
                                        bloc.canLogin ? 'login_enter'.assetPng : 'login_enter_dis'.assetPng),
                                    fit: BoxFit.fill),
                              ),
                              padding: EdgeInsets.symmetric(horizontal: 28.w, vertical: 14.h),
                              child: Text(
                                '登录',
                                style: TextStyle(fontSize: 16.sp),
                              ),
                            ),
                          )
                        ],
                      ),
                    )
                  ],

                ),
              ),

            ),
          ),

        );

      },
    );

    Widget _buildSmsViewWidget() => BlocBuilder<LoginBloc, LoginState>(builder: (context, state) {

      final bloc = BlocProvider.of<LoginBloc>(context);
      return Padding(
        padding: EdgeInsets.symmetric(horizontal: 135.w),
        child: Column(
          children: [
            15.verticalSpace,
            TextFieldCustomerWidget(
              height: 55.h,
              hitText: '请输入手机号',
              textInputType: TextInputType.phone,
              bgImageName: 'Input_layer_up',
              onChangeValue: (String value) {
                bloc.add(PhoneNumChangeEvent());
              },
              controller: bloc.phoneNumController,
            ),
            6.5.verticalSpace,
            Text(
              '未注册用户登录默认注册',
              style: TextStyle(fontSize: 12.sp, color: const Color(0xFF999999)),
            ),
            4.5.verticalSpace,
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,

              children: [

                Expanded(
                    child: TextFieldCustomerWidget(

                      height: 50.h,
                      hitText: '请输入验证码',
                      textInputType: TextInputType.number,
                      bgImageName: 'Input_layer_down',
                      onChangeValue: (String value) {
                        bloc.add(CheckFieldChangeEvent());
                      },
                      controller: bloc.checkNumController,
                    )),

                TimerWidget(
                  canSendSms: bloc.canSendSms,
                  sendSmsEvent: () => bloc.add(RequestSmsCodeEvent()),

                )
              ],

            )
          ],
        ),
      );
    });

    Widget _buildPwdViewWidget() => BlocBuilder<LoginBloc, LoginState>(builder: (context, state) {

      final bloc = BlocProvider.of<LoginBloc>(context);
      return Padding(
        padding: EdgeInsets.symmetric(horizontal: 90.w),
        child: Column(
          children: [
            15.verticalSpace,
            Row(
              mainAxisAlignment: MainAxisAlignment.center,

              children: [

                Image.asset(
                  'phone'.assetPng,
                  height: 45.h,
                  width: 35.w,
                ),
                10.5.horizontalSpace,
                Expanded(
                    child: TextFieldCustomerWidget(

                      height: 50.h,
                      hitText: '请输入手机号',
                      textInputType: TextInputType.phone,
                      bgImageName: 'Input_layer_up',
                      onChangeValue: (String value) {
                        bloc.add(PhoneNumChangeEvent());
                      },
                      controller: bloc.phoneNumController,
                    )),

                5.horizontalSpace,
                SizedBox(
                  width: 100.w,
                  height: 55.h,
                )
              ],
            ),
            12.verticalSpace,
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Image.asset(
                  'lock'.assetPng,
                  height: 34.h,
                  width: 31.w,

                ),

                10.5.horizontalSpace,
                Expanded(
                    child: TextFieldCustomerWidget(

                      hitText: '请输入密码',

                      obscureText: true,

                      bgImageName: 'Input_layer_down',
                      onChangeValue: (String value) {
                        bloc.add(CheckFieldChangeEvent());
                      },
                      controller: bloc.checkNumController,
                    )),

                5.horizontalSpace,
                GestureDetector(
                  onTap: () {
                    Navigator.of(context).pushNamed(AppRouteName.fogPwd);
                  },
                  child: Container(
                    width: 100.w,
                    height: 55.h,
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '忘记密码 ?',
                      style: TextStyle(fontSize: 12.sp),
                    ),
                  ),

                )
              ],

            )
          ],
        ),
      );
    });

  }