RN-用户中心通用模块

功能介绍

本库基于用户中心后台进行封装。提供功能如下：

• 1.登录(手机号+密码登录、手机号+验证码)，支持用户中心登录成功以后，同时调用调用业务层用户信息查询接口
• 2.注册
• 3.修改密码（手机号+旧密码+新密码）
• 4.忘记密码（手机号+验证码+新密码）
• 5.功能或UI配置

本项目依赖于如下仓库代码：

• 1.xgrn-baseview 基础组件
• 2.xgrn-fetch 网络库、用户中心网络库
• 3.xgrn-navigation 混合路由
• 4.xgrn-asyncstorage 存储库
• 5.react-native-animatable 三方动画

安装说明(基于上述依赖库已经安装的前提下)

yarn add xgrn-auth

使用时建议版本号写死，

JS中使用说明

import XGAuth,{XGAuthConfig} from 'xgrn-auth';
// 配置登录模块样式
XGAuthConfig({
    showRegisterProtocol: true,
    protocolPath: 'mine/RegisterProtocolPage',
    protocolText: '兔波波鲜生用户协议',
    protocolSelectIcon: protocolSelectIcon,
    protocolUnSelectIcon: protocolUnSelectIcon,
    logoIcon: loginLogoTubobo,
    themeColor: "#30C17C",
    userInfoHost: '',       //登录成功以后请求个人用户数据的host
    userInfoPath: '',       //登录成功以后请求个人用户数据的path
});

// 初始化js页面路由
XGNavigation.initializeJSRoutes([
    XGAuth      //登录、注册
]);

登录模块的功能和UI配置可以参考如下代码

// 登录模块配置
export function XGAuthConfig(configObj) {
    InnerConfig.promptText = configObj.promptText;                                          // 登录提示语,有就在输入框下面显示，没有就不显示
    InnerConfig.msgBtnTextColor = configObj.msgBtnTextColor;                                // 发送短信文字背景颜色
    InnerConfig.msgBtnBorderColor = configObj.msgBtnBorderColor;                            // 发送短信边框背景颜色
    InnerConfig.banRegister = !!configObj.banRegister;                                      // 禁止用户注册使用
    InnerConfig.loginByVerifyCode = !!configObj.loginByVerifyCode;                          // 是否验证码登录
    InnerConfig.showRegisterProtocol = !!configObj.showRegisterProtocol;                    // 是否展示注册协议提醒
    InnerConfig.protocolPath = configObj.protocolPath;                                      // 协议页面path
    InnerConfig.protocolText = configObj.protocolText;                                      // 协议按钮文字
    InnerConfig.protocolTextColor = configObj.protocolTextColor;                            // 协议按钮文字颜色
    InnerConfig.protocolSelectIcon = resolveAssetSource(configObj.protocolSelectIcon);      // 同意协议选中图片
    InnerConfig.protocolUnSelectIcon = resolveAssetSource(configObj.protocolUnSelectIcon);  // 不同意协议非选中图片
    InnerConfig.logoIcon = resolveAssetSource(configObj.logoIcon);                          // 登录页logo图片
    InnerConfig.themeColor = configObj.themeColor;                                          // 主题色系
    InnerConfig.userInfoHost = configObj.userInfoHost;                                      // 个人信息查询host
    InnerConfig.userInfoPath = configObj.userInfoPath;                                      // 个人信息查询path
}

跳转到登录页面

LoginPage 属性如下：
static propTypes = {
    showBack: PropTypes.bool,       //是否含有返回按钮,true(ios 允许侧滑退出、android允许返回键退出) false(ios禁止侧滑退出、android返回键退出app进程)
    loginEndAutoPop: PropTypes.bool,//登录后自动pop出去
    callBack: PropTypes.func,//登陆模块的回调函数
        //函数返回值格式如下：{
        //  loginRequestBody: {account  password},  //登录使用的账号密码
        //  userCenterResponse: {},                 //用户中心接口的返回值
        //  userInfo: {},                           //个人信息的返回值
        //  cancelLogin: bool                       //是否取消了登录
        //}
    }

XGNavigation.push({
    pagePath: 'auth/LoginPage',
    transitionsConfig: XGNavigation.transitionsConfig.FromBottom,
    params: {
        /**
         * 登录模块回调
         * @param loginRequestBody      登录时使用的参数
         * @param userCenterResponse    登录后用户中心服务器的响应值
         * @param userInfo              登录后，如果配置用户信息查询接口，则查询到的用户信息
         * @param cancelLogin           用户是否取消登录
         */
        callBack: ({loginRequestBody = {},userCenterResponse,userInfo,cancelLogin} = {}) => {
            if(cancelLogin) return;
            const {account} = loginRequestBody;
            userMobx.setPhone(account);
            this.queryShopCarNum();
            nextAction();
        }
    }
});

业务层跳转到修改登录密码页面

XGNavigation.push({pagePath: 'auth/ModifyLoginPasswordPage'})

IOS跳转到登录页面

        UIViewController * rootVC = [UIApplication sharedApplication].keyWindow.rootViewController;
        UINavigationController * rootNavigationVC = nil;
        if (rootVC && [rootVC isKindOfClass:[UINavigationController class]]){
            rootNavigationVC = (UINavigationController *)rootVC;
        } else {
            failCompletionHandler(OnlyCancelAllRequestAction);
            return ;
        }
        
        JSCallBackBlock callBack = ^(NSDictionary * result){
            
            // 3种可能的情况
            // 1.重新登录同一账号成功
            // 2.切换账号登录 取消
            // 3.取消登录
            
            NSDictionary * loginRequestBody = result[@"loginRequestBody"];
            BOOL cancelLogin = [result[@"cancelLogin"] boolValue];
            if (cancelLogin) {
                //不做任何处理，将原始错误信息返回
                failCompletionHandler(OnlyCancelAllRequestAction);
            } else {
                // 登录成功，处理两中情况
                NSString * account = loginRequestBody[@"account"];
                if (![account isEqualToString:currentPhone?:@""]) {
                    //a.切换账号登录，进行清空数据操作，并将路由还原
                    failCompletionHandler(OnlyCancelAllRequestAction);
                    User.shareInstance.count = 0;
                    User.shareInstance.phone = account;
                    UITabBarController * tabVC = rootNavigationVC.viewControllers[0];
                    tabVC.selectedIndex = 0;
                    UIViewController * vc = tabVC.viewControllers[2];
                    vc.tabBarItem.badgeValue = nil;
                    [rootNavigationVC popToRootViewControllerAnimated:YES];
                } else {
                    //b.同一个账号继续登录，自动刷新刚才的请求
                    failCompletionHandler(ReloadAllRequestAction);
                }
            }
        };
        [rootNavigationVC xg_pushJSPage:@"auth/LoginPage" andParams:@{
                                                                      @"callBack": callBack
                                                                      } andAnimated:YES andTransition:XGTransitionShowFromBottom];