set_pwd_page.dart 9.17 KB
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:wow_english/common/extension/string_extension.dart';
import 'package:wow_english/common/widgets/textfield_customer_widget.dart';
import 'package:wow_english/route/route.dart';

import 'bloc/set_pwd_bloc.dart';

enum SetPwdPageType {
  /// 第一次设置密码
  setPwd,

  /// 忘记重设密码,必传手机号和验证码
  resetPwd,

  /// 修改密码
  changePwd,
}

class SetPassWordPage extends StatelessWidget {
  const SetPassWordPage({super.key, this.phoneNum, this.smsCode, required this.pageType});

  final SetPwdPageType pageType;
  final String? phoneNum;
  final String? smsCode;

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => SetPwdBloc(phoneNum, smsCode, pageType),
      child: _SetPassWordPageView(),
    );
  }

  static push(BuildContext context, SetPwdPageType pageType, {String? phoneNum, String? smsCode}) {
    Navigator.of(context).pushNamed(AppRouteName.setPwd, arguments: {
      'pageType': pageType,
      'phoneNum': phoneNum,
      'smsCode': smsCode,
    });
  }
}

class _SetPassWordPageView extends StatelessWidget {
  late final SetPwdBloc bloc;

  @override
  Widget build(BuildContext context) {
    bloc = BlocProvider.of<SetPwdBloc>(context);
    return BlocListener<SetPwdBloc, SetPwdState>(
      listener: (context, s) {
        if (s is PasswordSetSuccessState) {
          Navigator.of(context).pushNamedAndRemoveUntil(AppRouteName.home, (route) => false);
        }
      },
      child: _buildSetPwdView(),
    );
  }

  String _getTipsText() {
    String text = '';

    switch (bloc.pageType) {
      case SetPwdPageType.setPwd:
        text = '欢迎登录wow english\n接下来请设置一下您的密码吧!';
        break;
      case SetPwdPageType.resetPwd:
      case SetPwdPageType.changePwd:
        text = '修改密码\n接下来请设置一下您的新密码吧!';
        break;
    }
    return text;
  }

  Widget _buildSetPwdView() => BlocBuilder<SetPwdBloc, SetPwdState>(builder: (context, state) {
        return Scaffold(
          body: Container(
            color: Colors.white,
            child: SafeArea(
              child: ListView(
                children: [
                  Padding(
                    padding: EdgeInsets.symmetric(horizontal: 40.w),
                    child: Column(
                      children: [
                        34.verticalSpace,
                        Row(
                          children: [
                            Image.asset(
                              'wow_logo'.assetPng,
                              height: 49.w,
                              width: 83.5.h,
                            ),
                            12.5.horizontalSpace,
                            Text(
                              _getTipsText(),
                              style: TextStyle(fontSize: 16.5.sp, color: const Color(0xFF666666)),
                            )
                          ],
                        ),
                        Row(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Expanded(
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.start,
                                children: [
                                  43.verticalSpace,
                                  Row(
                                    children: [
                                      Expanded(
                                          child: TextFieldCustomerWidget(
                                        height: 55.h,
                                        hitText: '请输入八位以上密码',
                                        bgImageName: 'Input_layer_up',
                                        controller: bloc.passWordFirstController,
                                        obscureText: true,
                                        textInputType: TextInputType.emailAddress,
                                        onChangeValue: (String value) => bloc.add(PwdEnsureEvent()),
                                      )),
                                      10.horizontalSpace,
                                      Opacity(
                                        opacity: bloc.showPwdIcon ? 1 : 0,
                                        child: Image.asset(
                                          bloc.passwordEnsure ? 'login_pass'.assetPng : 'login_error'.assetPng,
                                          height: 30,
                                          width: 30,
                                        ),
                                      )
                                    ],
                                  ),
                                  9.verticalSpace,
                                  Offstage(
                                    offstage: !bloc.passwordLarger,
                                    child: const Text('您已达到密码最大输入数,请妥善调整密码'),
                                  ),
                                  9.verticalSpace,
                                  Row(
                                    children: [
                                      Expanded(
                                          child: TextFieldCustomerWidget(
                                        height: 55.h,
                                        hitText: '请再次输入相同密码',
                                        bgImageName: 'Input_layer_up',
                                        obscureText: true,
                                        textInputType: TextInputType.emailAddress,
                                        controller: bloc.passWordSecondController,
                                        onChangeValue: (String value) => bloc.add(PwdCheckEvent()),
                                      )),
                                      10.horizontalSpace,
                                      Opacity(
                                        opacity: bloc.showCheckPwdIcon ? 1 : 0,
                                        child: Image.asset(
                                          bloc.passwordCheck ? 'login_pass'.assetPng : 'login_error'.assetPng,
                                          height: 30,
                                          width: 30,
                                        ),
                                      )
                                    ],
                                  ),
                                  9.verticalSpace,
                                  Offstage(
                                    offstage: bloc.passwordCheck,
                                    child: Text(
                                      '请确认两次输入的密码是否一致',
                                      style: TextStyle(fontSize: 16.sp, color: const Color(0xFF333333)),
                                    ),
                                  ),
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.end,
                                    children: [
                                      GestureDetector(
                                        onTap: () {
                                          if (!bloc.ensure) {
                                            return;
                                          }
                                          bloc.add(SetPasswordEvent());
                                        },
                                        child: Container(
                                          decoration: BoxDecoration(
                                            image: DecorationImage(
                                                image: AssetImage(
                                                    bloc.ensure ? 'login_enter'.assetPng : 'login_enter_dis'.assetPng),
                                                fit: BoxFit.fill),
                                          ),
                                          padding: EdgeInsets.symmetric(horizontal: 28.w, vertical: 14.h),
                                          child: Text(
                                            '确定',
                                            style: TextStyle(color: Colors.white, fontSize: 16.sp),
                                          ),
                                        ),
                                      ),
                                      50.horizontalSpace
                                    ],
                                  )
                                ],
                              ),
                            ),
                            30.horizontalSpace,
                            Image.asset(
                              'steven'.assetPng,
                              height: 254.h,
                              width: 100.w,
                            )
                          ],
                        ),
                      ],
                    ),
                  )
                ],
              ),
            ),
          ),
        );
      });
}