基础库
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

login_page.dart 20 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613
  1. import 'dart:convert';
  2. import 'dart:io';
  3. import 'package:cached_network_image/cached_network_image.dart';
  4. import 'package:flutter/cupertino.dart';
  5. import 'package:flutter/gestures.dart';
  6. import 'package:flutter/material.dart';
  7. import 'package:flutter_alibc/alibc_model.dart';
  8. import 'package:flutter_alibc/flutter_alibc.dart';
  9. import 'package:flutter_bloc/flutter_bloc.dart';
  10. import 'package:fluttertoast/fluttertoast.dart';
  11. import 'package:sharesdk_plugin/sharesdk_plugin.dart';
  12. import 'package:zhiying_comm/pages/login_page/account/login_account_page.dart';
  13. import 'package:zhiying_comm/pages/login_page/bind/login_bind_phone_page.dart';
  14. import 'package:zhiying_comm/util/dialog/loading/loading.dart';
  15. import 'package:zhiying_comm/util/empty_util.dart';
  16. import 'package:zhiying_comm/util/mob_util/mob_util.dart';
  17. import 'package:zhiying_comm/zhiying_comm.dart';
  18. import 'package:provider/provider.dart';
  19. import 'package:ali_auth_wbq/ali_auth_wbq.dart';
  20. import 'bloc/bloc.dart';
  21. import 'bloc/login_repository.dart';
  22. import 'login_page_sk.dart';
  23. import 'model/login_style_model.dart';
  24. ///
  25. /// 登陆页面
  26. ///
  27. class LoginPage extends StatelessWidget {
  28. const LoginPage({Key key}) : super(key: key);
  29. @override
  30. Widget build(BuildContext context) {
  31. return Scaffold(
  32. backgroundColor: HexColor.fromHex('#FFFFFF'),
  33. body: BlocProvider<LoginBloc>(
  34. create: (_) => LoginBloc(repository: LoginRepository())..add(LoginInitEvent()),
  35. child: LoginPageContainer(),
  36. ),
  37. );
  38. }
  39. }
  40. class LoginPageContainer extends StatefulWidget {
  41. @override
  42. _LoginPageContainerState createState() => _LoginPageContainerState();
  43. }
  44. class _LoginPageContainerState extends State<LoginPageContainer> {
  45. LoginModel _taoBao;
  46. var _qqUserData;
  47. var _wxUserData;
  48. String _appleData;
  49. bool checkBool = false;
  50. LoginStyleModel loginStyleModel;
  51. @override
  52. void initState() {
  53. // 登录监听
  54. AliAuthPlugin.loginListen(type: false, onEvent: _onAppleLoginEvent);
  55. super.initState();
  56. }
  57. // 返回授权信息
  58. // returnCode: 200成功 500失败
  59. // returnMsg
  60. // user
  61. // familyName //可能为 @""
  62. // givenName //可能为 @""
  63. // email //可能为 @""
  64. // identityTokenStr //需要使用的参数
  65. // authorizationCodeStr
  66. void _onAppleLoginEvent(event) {
  67. var stateCode = event['returnCode'];
  68. String stateMsg = event['returnMsg'];
  69. // _appleData = event['identityTokenStr'];
  70. _appleData = event['user'];
  71. Logger.debug('event == ' + event?.toString());
  72. if (stateCode == 200 && !EmptyUtil.isEmpty(_appleData)) {
  73. Loading.dismiss();
  74. print("成功------$event");
  75. BlocProvider.of<LoginBloc>(context).add(LoginThirdAppleEvent(identityToken: _appleData));
  76. } else {
  77. Loading.dismiss();
  78. print("失败------$stateMsg");
  79. }
  80. }
  81. /// 微信or手机登陆
  82. void _loginClick(String type, LoginStyleModel model) {
  83. if (!isCheck()) {
  84. return;
  85. }
  86. print('登陆$type');
  87. RouterUtil.hideKeyboard(context);
  88. if ('mobile' == type) {
  89. if (model?.flashLoginEnable == '1') {
  90. // mob 一键登录
  91. // MobUtil.openQuickLoginPage(context, model?.quick);
  92. Navigator.push(context, CupertinoPageRoute(builder: (_) => LoginAccountPage(null)));
  93. } else {
  94. Navigator.push(context, CupertinoPageRoute(builder: (_) => LoginAccountPage(null)));
  95. }
  96. } else if ('wechat' == type) {
  97. /// 微信登录
  98. Loading.show(context);
  99. SharesdkPlugin.getUserInfo(ShareSDKPlatforms.wechatSession, (SSDKResponseState state, Map userdata, SSDKError error) {
  100. Logger.log('state = ${state?.toString()}, userInfo = ${userdata?.toString()}');
  101. if (state == SSDKResponseState.Success) {
  102. try {
  103. if (Platform.isIOS) {
  104. Map credentialDic = userdata['credential'];
  105. Map rawDatalDic = userdata['rawData'];
  106. var name = userdata['nickname'];
  107. var gender = userdata['gender'];
  108. var icon = userdata['icon'];
  109. var userID = userdata['uid'];
  110. var unionid = rawDatalDic['unionid'];
  111. var token = credentialDic['token'];
  112. Map dbInfoDic = {
  113. 'nickname': name,
  114. 'gender': gender,
  115. 'icon': icon,
  116. 'userID': userID,
  117. 'unionid': unionid,
  118. 'token': token,
  119. };
  120. Map tempUserData = {'dbInfo': jsonEncode(dbInfoDic)};
  121. _wxUserData = jsonDecode(tempUserData['dbInfo']);
  122. BlocProvider.of<LoginBloc>(context).add(LoginThirdWeChatEvent(model: tempUserData));
  123. } else if (Platform.isAndroid) {
  124. _wxUserData = jsonDecode(userdata['dbInfo']);
  125. BlocProvider.of<LoginBloc>(context).add(LoginThirdWeChatEvent(model: userdata));
  126. }
  127. Loading.dismiss();
  128. } catch (e) {
  129. Fluttertoast.showToast(msg: '登录失败');
  130. Loading.dismiss();
  131. }
  132. } else {
  133. Loading.dismiss();
  134. }
  135. });
  136. }
  137. }
  138. /// 第三方登陆
  139. void _otherLoginClick(BottomIcons model) async {
  140. if (!isCheck()) {
  141. return;
  142. }
  143. print('第三方登陆${model.type}');
  144. if (EmptyUtil.isEmpty(model) || EmptyUtil.isEmpty(model.type)) {
  145. Fluttertoast.showToast(msg: '暂不支持~');
  146. return;
  147. }
  148. /// 淘宝登录
  149. if ('taobao' == model.type) {
  150. Loading.show(context);
  151. _taoBao = await FlutterAlibc.loginTaoBao();
  152. if (!EmptyUtil.isEmpty(_taoBao) && !EmptyUtil.isEmpty(_taoBao?.errorCode) && _taoBao.errorCode == '0') {
  153. BlocProvider.of<LoginBloc>(context).add(LoginThirdAliEvent(
  154. nick: _taoBao?.data?.nick,
  155. avatarUrl: _taoBao?.data?.avatarUrl,
  156. openId: _taoBao?.data?.openId,
  157. openSid: _taoBao?.data?.openSid,
  158. topAccessToken: _taoBao?.data?.topAccessToken,
  159. topAuthCode: _taoBao?.data?.topAuthCode));
  160. // Logger.warn(' tao login = ${_taoBao?.errorCode} , msg = ${_taoBao?.errorMessage}, nick = ${_taoBao?.data?.nick}, '
  161. // 'avatar = ${_taoBao?.data?.avatarUrl}, openId = ${_taoBao?.data?.openId}, openSid = ${_taoBao?.data?.openSid}, '
  162. // 'topAccessToken = ${_taoBao?.data?.topAccessToken}, topAuthCode = ${_taoBao?.data?.topAuthCode}');
  163. }
  164. Loading.dismiss();
  165. }
  166. /// QQ登录
  167. if ('qq' == model.type) {
  168. Loading.show(context);
  169. SharesdkPlugin.getUserInfo(ShareSDKPlatforms.qq, (SSDKResponseState state, Map userdata, SSDKError error) {
  170. Logger.log('state = ${state?.toString()}\nuserData = ${userdata?.toString()}');
  171. if (state == SSDKResponseState.Success && !EmptyUtil.isEmpty(userdata)) {
  172. try {
  173. _qqUserData = jsonDecode(userdata['dbInfo']);
  174. BlocProvider.of<LoginBloc>(context).add(LoginThirdQQEvent(model: userdata));
  175. Loading.dismiss();
  176. } catch (e) {
  177. Fluttertoast.showToast(msg: '登录失败');
  178. Loading.dismiss();
  179. }
  180. } else {
  181. Loading.dismiss();
  182. }
  183. });
  184. // Fluttertoast.showToast(msg: '暂不支持~');
  185. }
  186. /// 苹果登录
  187. if ('apple' == model.type) {
  188. if (Platform.isIOS) {
  189. Loading.show(context);
  190. await AliAuthPlugin.appleLogin;
  191. // final appleLogin = await AliAuthPlugin.appleLogin;
  192. } else {
  193. Fluttertoast.showToast(msg: '暂不支持~');
  194. }
  195. }
  196. }
  197. /// 跳到用户协议
  198. void _jumpUserAgreement(String url) {
  199. if (!EmptyUtil.isEmpty(url)) {
  200. print('协议');
  201. RouterUtil.openWebview(url, context);
  202. }
  203. }
  204. /// 跳到绑定手机号
  205. void _jumpBindPhonePage(String thirdType) {
  206. /// 如果是苹果登录
  207. if (GlobalConfig.LOGIN_THIRD_APPLE == thirdType) {
  208. Navigator.push(
  209. context,
  210. CupertinoPageRoute(
  211. builder: (_) => LoginBindPhonePage({
  212. 'thirdType': thirdType,
  213. 'identityTokenStr': _appleData,
  214. })));
  215. }
  216. /// 如果是淘宝登录
  217. if (GlobalConfig.LOGIN_THIRD_ALI == thirdType) {
  218. Navigator.push(
  219. context,
  220. CupertinoPageRoute(
  221. builder: (_) => LoginBindPhonePage({
  222. 'thirdType': thirdType,
  223. 'nick': _taoBao?.data?.nick,
  224. 'avatarUrl': _taoBao?.data?.avatarUrl,
  225. 'openId': _taoBao?.data?.openId,
  226. 'openSid': _taoBao?.data?.openSid,
  227. 'topAccessToken': _taoBao?.data?.topAccessToken,
  228. 'topAuthCode': _taoBao?.data?.topAuthCode,
  229. })));
  230. }
  231. /// 如果是QQ登录
  232. if (GlobalConfig.LOGIN_THIRD_QQ == thirdType) {
  233. if (!EmptyUtil.isEmpty(_qqUserData)) {
  234. Navigator.push(
  235. context,
  236. CupertinoPageRoute(
  237. builder: (_) => LoginBindPhonePage({
  238. 'thirdType': thirdType,
  239. 'nickname': _qqUserData['nickname']?.toString(),
  240. 'avatar_url': _qqUserData['icon']?.toString(),
  241. 'open_id': _qqUserData['userID']?.toString(),
  242. 'gender': _qqUserData['gender']?.toString() == '0' ? '1' : '2',
  243. 'unionid': _qqUserData['unionid']?.toString(),
  244. 'token': _qqUserData['token']?.toString(),
  245. })));
  246. }
  247. }
  248. /// 微信登录
  249. if (GlobalConfig.LOGIN_THIRD_WECHAT == thirdType) {
  250. if (!EmptyUtil.isEmpty(_wxUserData)) {
  251. Navigator.push(
  252. context,
  253. CupertinoPageRoute(
  254. builder: (_) => LoginBindPhonePage({
  255. 'thirdType': thirdType,
  256. 'nickname': _wxUserData['nickname']?.toString(),
  257. 'avatar_url': _wxUserData['icon']?.toString(),
  258. 'open_id': _wxUserData['userID']?.toString(),
  259. 'gender': _wxUserData['gender']?.toString() == '0' ? '1' : '2',
  260. 'unionid': _wxUserData['unionid']?.toString(),
  261. 'token': _wxUserData['token']?.toString(),
  262. })));
  263. }
  264. }
  265. }
  266. /// 跳到首页
  267. void _jumpHomePage() {
  268. RouterUtil.goBackHomePage(context);
  269. }
  270. /// 展开关闭其它登陆
  271. void _showOrCloseOtherLogin() {
  272. setState(() {
  273. _showOther = !_showOther;
  274. });
  275. }
  276. final _sizedHeight50 = const SizedBox(height: 50);
  277. final _sizedHeight9 = const SizedBox(height: 9);
  278. final _sizedHeight18 = const SizedBox(height: 18);
  279. final _sizedHeight21 = const SizedBox(height: 21);
  280. bool _showOther = true;
  281. @override
  282. Widget build(BuildContext context) {
  283. return BlocConsumer<LoginBloc, LoginState>(
  284. listener: (context, state) {
  285. // Fluttertoast.showToast(msg: '网络异常');
  286. },
  287. buildWhen: (prev, current) {
  288. if (current is LoginErrorState) {
  289. return false;
  290. }
  291. /// 登录失败
  292. if (current is LoginThirdLoginErrorState) {
  293. return false;
  294. }
  295. /// 登录成功
  296. if (current is LoginThirdLoginSuccessState) {
  297. // 需要绑定手机号
  298. if (current.model.bindPhoneEnable == '1') {
  299. // 打开绑定手机号页面
  300. _jumpBindPhonePage(current.thirdType);
  301. } else {
  302. // 更新登录数据
  303. Provider.of<UserInfoNotifier>(context, listen: false)?.setUserInfo(current.model);
  304. // 直接打开首页
  305. _jumpHomePage();
  306. Fluttertoast.showToast(msg: '登录成功~');
  307. }
  308. return false;
  309. }
  310. return true;
  311. },
  312. builder: (context, state) {
  313. if (state is LoginCacheState) {
  314. return _getMainWidget(state.model);
  315. }
  316. if (state is LoginLoadedState) {
  317. return _getMainWidget(state.model);
  318. }
  319. return LoginPageSkeleton(); // 骨架屏幕
  320. },
  321. );
  322. }
  323. /// 主视图
  324. Widget _getMainWidget(LoginStyleModel model) {
  325. return Column(
  326. children: <Widget>[
  327. /// 头部
  328. _headWidget(model),
  329. _sizedHeight50,
  330. /// 按钮
  331. _buttonsWidget(model),
  332. _sizedHeight9,
  333. ///账号密码登录
  334. _buildOrderLogin(),
  335. _sizedHeight9,
  336. /// 协议
  337. _protocolWidget(model),
  338. /// 其它登陆方式
  339. _otherLoginWidget(model),
  340. ],
  341. );
  342. }
  343. /// 头部Widget
  344. Widget _headWidget(LoginStyleModel model) {
  345. return Container(
  346. height: 228 + MediaQuery.of(context).padding.top,
  347. width: double.infinity,
  348. decoration: BoxDecoration(
  349. image: DecorationImage(
  350. image: CachedNetworkImageProvider(model?.main?.backgroundImg ?? ''),
  351. fit: BoxFit.fill,
  352. ),
  353. ),
  354. child: Stack(
  355. alignment: Alignment.center,
  356. children: <Widget>[
  357. AppBar(
  358. backgroundColor: Colors.transparent,
  359. elevation: 0,
  360. leading: IconButton(
  361. icon: Icon(
  362. Icons.arrow_back_ios,
  363. size: 22,
  364. color: HexColor.fromHex('#333333'),
  365. ),
  366. onPressed: () => Navigator.maybePop(context),
  367. ),
  368. ),
  369. Column(
  370. crossAxisAlignment: CrossAxisAlignment.center,
  371. mainAxisAlignment: MainAxisAlignment.center,
  372. children: <Widget>[
  373. /// logo
  374. Container(
  375. margin: EdgeInsets.only(bottom: 12, top: MediaQuery.of(context).padding.top),
  376. decoration: BoxDecoration(
  377. borderRadius: BorderRadius.circular(14),
  378. boxShadow: [
  379. BoxShadow(color: Colors.grey[300], offset: Offset(0.0, 0.0), blurRadius: 10.0, spreadRadius: 1.0),
  380. BoxShadow(color: Colors.grey[300], offset: Offset(0.0, 0.0)),
  381. ],
  382. ),
  383. height: 80,
  384. width: 80,
  385. child: CachedNetworkImage(imageUrl: model?.logoImg ?? ''),
  386. ),
  387. /// logo 名字
  388. // CachedNetworkImage(
  389. // imageUrl: model?.main?.appNameImg ?? '',
  390. // width: 90,
  391. // ),
  392. Container(
  393. margin: EdgeInsets.only(top: 0, bottom: 6),
  394. child: Center(
  395. child: Text(
  396. model?.main?.appName ?? "",
  397. style: TextStyle(color: HexColor.fromHex("#FF333333"), fontSize: 20,fontWeight: FontWeight.bold),
  398. )),
  399. )
  400. ],
  401. ),
  402. ],
  403. ),
  404. );
  405. }
  406. /// 按钮
  407. Widget _buttonsWidget(LoginStyleModel model) {
  408. return Container(
  409. padding: const EdgeInsets.symmetric(horizontal: 27.5),
  410. child: Column(
  411. children: model.main.importanceLogin.map((item) {
  412. if(item?.type=="mobile"){
  413. item?.btnText="密码登录";
  414. loginStyleModel=model;
  415. }
  416. return Padding(
  417. padding: const EdgeInsets.only(bottom: 8),
  418. child: _customButton(
  419. height: 40,
  420. text: item?.btnText,
  421. iconUrl: item?.btnMobileIcon ?? '',
  422. textColor: item?.btnTextColor,
  423. bgColor: item?.btnBgColor,
  424. borderColor: item?.btnBorderColor,
  425. onTap: () => _loginClick(item?.type, model)),
  426. );
  427. }).toList(),
  428. ),
  429. );
  430. }
  431. /// 协议
  432. Widget _protocolWidget(LoginStyleModel model) {
  433. return Row(
  434. mainAxisAlignment: MainAxisAlignment.center,
  435. children: <Widget>[
  436. InkWell(
  437. borderRadius: BorderRadius.circular(20),
  438. onTap: () {
  439. checkBool = !checkBool;
  440. setState(() {});
  441. },
  442. child: Container(
  443. width: 32,
  444. height: 32,
  445. child: Icon(
  446. checkBool ? Icons.check_box : Icons.check_box_outline_blank,
  447. size: 16,
  448. color: checkBool ? Colors.red : Colors.black12,
  449. ),
  450. ),
  451. ),
  452. RichText(
  453. text: TextSpan(
  454. text: '',
  455. children: model.main.agreements.map((item) {
  456. return TextSpan(
  457. text: item?.text,
  458. style: TextStyle(color: HexColor.fromHex(item?.textColor), fontSize: 10),
  459. recognizer: TapGestureRecognizer()
  460. ..onTap = () {
  461. _jumpUserAgreement(item?.url);
  462. });
  463. }).toList()),
  464. ),
  465. ],
  466. );
  467. }
  468. /// 其它登陆方式
  469. Widget _otherLoginWidget(LoginStyleModel model) {
  470. return Expanded(
  471. child: Column(
  472. mainAxisAlignment: MainAxisAlignment.end,
  473. children: <Widget>[
  474. _getOtherLoginTitle(model),
  475. _sizedHeight18,
  476. Visibility(visible: _showOther, child: _getOtherLoginIcons(model)),
  477. Visibility(visible: _showOther, child: _sizedHeight21),
  478. ],
  479. ),
  480. );
  481. }
  482. /// 其它登陆方式的title
  483. Widget _getOtherLoginTitle(LoginStyleModel model) {
  484. return GestureDetector(
  485. behavior: HitTestBehavior.opaque,
  486. onTap: () => _showOrCloseOtherLogin(),
  487. child: Row(
  488. mainAxisAlignment: MainAxisAlignment.center,
  489. crossAxisAlignment: CrossAxisAlignment.center,
  490. children: <Widget>[
  491. Text('${model?.main?.otherIconsTitle}', style: TextStyle(fontSize: 13, color: HexColor.fromHex(model?.main?.otherIconsTitleColor))),
  492. SizedBox(width: 5.5),
  493. RotatedBox(
  494. quarterTurns: _showOther ? 0 : 2,
  495. child: CachedNetworkImage(imageUrl: model?.main?.otherExpansionIcon ?? '', width: 12),
  496. ),
  497. ],
  498. ),
  499. );
  500. }
  501. /// 其它登陆方式的按钮
  502. Widget _getOtherLoginIcons(LoginStyleModel model) {
  503. return Row(
  504. mainAxisAlignment: MainAxisAlignment.center,
  505. children: model.main.bottomIcons.map((item) {
  506. return GestureDetector(
  507. behavior: HitTestBehavior.opaque,
  508. onTap: () => _otherLoginClick(item),
  509. child: Container(
  510. width: 30,
  511. margin: const EdgeInsets.symmetric(horizontal: 20),
  512. child: CachedNetworkImage(imageUrl: item?.img ?? ''),
  513. ),
  514. );
  515. }).toList(),
  516. );
  517. }
  518. /// 自定义按钮
  519. Widget _customButton({double height, String text, String iconUrl, String textColor, String bgColor, String borderColor, GestureTapCallback onTap}) {
  520. return GestureDetector(
  521. onTap: onTap,
  522. child: Container(
  523. width: double.infinity,
  524. height: height ?? 0,
  525. decoration: BoxDecoration(
  526. border: Border.all(color: HexColor.fromHex(borderColor), width: 0.5),
  527. borderRadius: BorderRadius.circular(height ?? 0 / 2),
  528. color: HexColor.fromHex(bgColor),
  529. ),
  530. child: Row(
  531. mainAxisAlignment: MainAxisAlignment.center,
  532. crossAxisAlignment: CrossAxisAlignment.center,
  533. children: <Widget>[
  534. // icon
  535. CachedNetworkImage(imageUrl: iconUrl, width: 12),
  536. SizedBox(width: 8),
  537. // text
  538. Text(text, style: TextStyle(color: HexColor.fromHex(textColor), fontSize: 15))
  539. ],
  540. ),
  541. ),
  542. );
  543. }
  544. ///账号密码登录 update:与手机一键登录互换
  545. _buildOrderLogin() {
  546. return Center(
  547. child: GestureDetector(
  548. behavior: HitTestBehavior.opaque,
  549. onTap: () {
  550. if (isCheck()) {
  551. //Navigator.push(context, CupertinoPageRoute(builder: (_) => LoginAccountPage(null)));
  552. MobUtil.openQuickLoginPage(context, loginStyleModel?.quick);
  553. }
  554. },
  555. child: Text(
  556. "本机号码登录",
  557. style: TextStyle(color: HexColor.fromHex("#FFFF4242"), fontSize: 14),
  558. ),
  559. ),
  560. );
  561. }
  562. bool isCheck() {
  563. if (!checkBool) {
  564. Fluttertoast.showToast(msg: "请阅读并勾选同意用户协议选项");
  565. return false;
  566. } else {
  567. return true;
  568. }
  569. }
  570. }