set_pwd_page.dart 9.25 KB
import 'package:flutter/cupertino.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/extension/string_extension.dart';
import 'package:wow_english/common/widgets/textfield_customer_widget.dart';
import 'package:wow_english/route/route.dart';
import 'package:wow_english/utils/toast_util.dart';

import 'bloc/set_pwd_bloc.dart';

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

  /// 忘记重设密码,必传手机号和验证码
  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(),
    );
  }

  /// [pageType]= [resetPwd] or [changePwd] 时,必传手机号和验证码
  static push(BuildContext context, SetPwdPageType pageType, {String? phoneNum, String? smsCode}) {
    Navigator.of(context).push(CupertinoPageRoute(builder: (context) {
      return SetPassWordPage(
        phoneNum: phoneNum,
        smsCode: smsCode,
        pageType: pageType,
      );
    }));
  }
}

class _SetPassWordPageView extends StatelessWidget {
  late final SetPwdBloc bloc;

  @override
  Widget build(BuildContext context) {
    bloc = BlocProvider.of<SetPwdBloc>(context);
    return BlocListener<SetPwdBloc, SetPwdState>(
      listener: (context, state) {
        if (state is PasswordSetSuccessState) {
          if (bloc.pageType == SetPwdPageType.initPwd) {
            showToast('密码设置成功');
          } else {
            showToast('密码修改成功');
          }
          pushNamedAndRemoveUntil(AppRouteName.home, (route) => false);
        } else if (state is PasswordSetFailedState) {
          state.message.toast();
        }
      },
      child: _buildSetPwdView(),
    );
  }

  String _getTipsText() {
    String text = '接下来请设置一下您的新密码吧!';

    switch (bloc.pageType) {
      case SetPwdPageType.initPwd:
        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,
                        )
                      ],
                    ),
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  });
}