login_main_page.dart 12.3 KB
import 'package:appframe/bloc/login_main_cubit.dart';
import 'package:appframe/config/locator.dart';
import 'package:appframe/ui/widgets/login/login_page_agreed_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:fluwx/fluwx.dart';

class LoginMainPage extends StatelessWidget {
  const LoginMainPage({super.key});

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => LoginMainCubit(LoginMainState()),
      child: BlocConsumer<LoginMainCubit, LoginMainState>(
        builder: (context, state) {
          var loginMainCubit = context.read<LoginMainCubit>();
          return Stack(
            children: [
              Scaffold(
                backgroundColor: Colors.white,
                body: SafeArea(
                  top: false,
                  child: SingleChildScrollView(
                    child: Column(
                      children: [
                        SizedBox(height: 100),
                        Center(
                          child: Image.asset(
                            'assets/images/login_v2/banner_1.png',
                          ),
                        ),
                        SizedBox(height: 30),
                        Center(
                          child: Image.asset(
                            'assets/images/login_v2/main.png',
                          ),
                        ),
                        SizedBox(height: 40),
                        Padding(
                          padding: EdgeInsets.symmetric(horizontal: 42.5),
                          child: SizedBox(
                            width: double.infinity,
                            height: 50,
                            child: ElevatedButton(
                              onPressed: () async {
                                if (await getIt.get<Fluwx>().isWeChatInstalled) {
                                  loginMainCubit.wechatAuth();
                                } else {
                                  _showWechatNotInstallDialog(context);
                                }
                              },
                              style: ElevatedButton.styleFrom(
                                backgroundColor: Color(0xFF26C445),
                                foregroundColor: Colors.white,
                                textStyle: TextStyle(fontSize: 19),
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(27),
                                ),
                              ),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Image.asset('assets/images/login_v2/wechat_white_icon.png'),
                                  SizedBox(width: 4.5),
                                  Text('微信登录'),
                                ],
                              ),
                            ),
                          ),
                        ),
                        SizedBox(height: 15),
                        _buildAgreement(context, loginMainCubit, state.agreed),
                        SizedBox(height: 82.5),
                        Text(
                          '其他方式登录',
                          style: TextStyle(
                            fontSize: 14,
                            color: Color(0xFF999999),
                          ),
                          strutStyle: StrutStyle(height: 16 / 14),
                        ),
                        SizedBox(height: 15),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            InkWell(
                              onTap: () {
                                context.read<LoginMainCubit>().goLoginQr();
                              },
                              child: Image.asset(
                                'assets/images/login_v2/qr_green_icon.png',
                              ),
                            ),
                            SizedBox(width: 25),
                            InkWell(
                              onTap: () {
                                context.read<LoginMainCubit>().goLoginPhone();
                              },
                              child: Image.asset(
                                'assets/images/login_v2/phone_blue_icon.png',
                              ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                ),
              ),
              state.loading
                  ? Container(
                      color: Colors.black54,
                      width: MediaQuery.of(context).size.width,
                      child: Center(
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            CircularProgressIndicator(
                              color: Color(0xFF7691FA),
                            ),
                          ],
                        ),
                      ),
                    )
                  : SizedBox(),
            ],
          );
        },
        listener: (context, state) {
          if (state.showAgreed) {
            _showAgreementDialog(context, context.read<LoginMainCubit>());
          }
        },
      ),
    );
  }

  Widget _buildAgreement(BuildContext context, LoginMainCubit loginMainCubit, bool agreed) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Theme(
          data: Theme.of(context).copyWith(
            checkboxTheme: CheckboxThemeData(
              shape: CircleBorder(
                side: BorderSide(width: 0.5, color: Color(0xFF999999)),
              ),
              fillColor: WidgetStateProperty.resolveWith<Color>(
                (Set<WidgetState> states) {
                  if (states.contains(WidgetState.selected)) {
                    return Color(0xFF7691FA); // 选中时的颜色
                  }
                  return Colors.white; // 未选中时的颜色
                },
              ),
              checkColor: WidgetStateProperty.all<Color>(Colors.white),
              side: BorderSide(width: 0.5, color: Color(0xFF999999)),
            ),
            cardColor: Colors.white,
            unselectedWidgetColor: Color(0xFF999999),
          ),
          child: SizedBox(
            height: 19, // 设置高度为19
            child: Checkbox(
              value: agreed,
              onChanged: (bool? value) {
                loginMainCubit.toggleAgreed(value!);
              },
              materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
            ),
          ),
        ),
        LoginPageAgreedWidget(),
      ],
    );
  }

  Future<void> _showAgreementDialog(BuildContext context, LoginMainCubit loginMainCubit) async {
    final result = await showDialog(
      context: context,
      barrierDismissible: false,
      builder: (BuildContext context) {
        return AlertDialog(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(
              Radius.circular(5),
            ),
          ),
          title: Text(
            '个人信息保护指引',
            style: TextStyle(
              fontSize: 17,
              color: Color(0xFF000000),
              // fontWeight: FontWeight.bold,
            ),
            textAlign: TextAlign.center,
          ),
          content: Text.rich(
            TextSpan(
              children: [
                TextSpan(
                  text: '感谢使用班小二APP,为保护您的个人权益,请仔细阅读并充分理解',
                  style: TextStyle(color: Color(0xFF666666), fontSize: 14),
                ),
                TextSpan(
                  text: '《班小二数据据安全和隐私政策》',
                  style: TextStyle(color: Color(0xFF7691FA), fontSize: 14),
                ),
                TextSpan(
                  text: '与',
                  style: TextStyle(color: Color(0xFF666666), fontSize: 14),
                ),
                TextSpan(
                  text: '《用户协议》',
                  style: TextStyle(color: Color(0xFF7691FA), fontSize: 14),
                ),
                TextSpan(
                  text: '。如您同意上述文件的全部内容,请点击“同意”以继续。',
                  style: TextStyle(color: Color(0xFF666666), fontSize: 14),
                ),
              ],
            ),
          ),
          actions: [
            Table(
              children: [
                TableRow(
                  children: [
                    TableCell(
                      child: TextButton(
                        onPressed: () {
                          Navigator.of(context).pop();
                        },
                        style: TextButton.styleFrom(
                          foregroundColor: Color(0xFF666666),
                          textStyle: TextStyle(fontSize: 17),
                          padding: EdgeInsets.zero,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.zero,
                          ),
                        ),
                        child: Text('放弃登录'),
                      ),
                    ),
                    TableCell(
                      child: TextButton(
                        onPressed: () {
                          Navigator.of(context).pop('OK');
                        },
                        style: TextButton.styleFrom(
                          foregroundColor: Color(0xFF7691FA),
                          textStyle: TextStyle(fontSize: 17),
                          minimumSize: Size.fromHeight(40),
                          padding: EdgeInsets.zero,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.zero,
                          ),
                        ),
                        child: Text('同意'),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ],
        );
      },
    );
    if (result != null) {
      loginMainCubit.confirmAgreed();
    } else {
      loginMainCubit.cancelAgreed();
    }
  }

  Future<void> _showWechatNotInstallDialog(BuildContext context) async {
    showDialog(
      context: context,
      barrierDismissible: false,
      builder: (BuildContext context) {
        return AlertDialog(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(
              Radius.circular(5),
            ),
          ),
          title: Text(
            '提示',
            style: TextStyle(
              fontSize: 17,
              color: Color(0xFF000000),
              // fontWeight: FontWeight.bold,
            ),
            textAlign: TextAlign.center,
          ),
          content: Text.rich(
            TextSpan(
              text: '此设备未安装微信App,请选择其他方式登录。',
              style: TextStyle(color: Color(0xFF666666), fontSize: 14),
            ),
          ),
          actions: [
            Table(
              children: [
                TableRow(
                  children: [
                    TableCell(
                      child: TextButton(
                        onPressed: () {
                          Navigator.of(context).pop('OK');
                        },
                        style: TextButton.styleFrom(
                          foregroundColor: Color(0xFF7691FA),
                          textStyle: TextStyle(fontSize: 17),
                          minimumSize: Size.fromHeight(40),
                          padding: EdgeInsets.zero,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.zero,
                          ),
                        ),
                        child: Text('确定'),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ],
        );
      },
    );
  }
}