register_person.blade.php 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410
  1. @extends('mobile.module.layouts.content')
  2. @push('meta')
  3. @endpush
  4. @push('css')
  5. <link href="{{ theme_asset('mobile/css/members.css') }}" rel="stylesheet">
  6. @endpush
  7. @push('js')
  8. <script type="text/javascript" src="{{ theme_asset('gt/gt.js') }}"></script>
  9. <script type="text/javascript" src="{{ theme_asset('gt/gt.handle.js') }}"></script>
  10. @endpush
  11. @section('content')
  12. <div class="qs-top-nav x2 list_height">
  13. <div class="n-cell active">手机注册<div class="b-line"></div></div>
  14. <div class="n-cell" onclick="javascript:location.href='{{route($sub_site.'mobile.register.person.email')}}'">邮箱注册<div class="b-line"></div></div>
  15. <div class="clear"></div>
  16. </div>
  17. <div class="split-block"></div>
  18. <form id="regMobileForm" method="post" action="{{route($sub_site.'mobile.register.person')}}">
  19. {{csrf_field()}}
  20. <div class="loging-input-group">
  21. {{--<div class="group-list verfy">
  22. <input id="id_card" name="id_card" type="text" class="l-input font14" placeholder="请输入身份证号码" autocomplete="off">
  23. </div>--}}
  24. <div class="group-list mobile">
  25. <input id="mobile" name="mobile" type="text" class="l-input font14" placeholder="请输入手机号码" autocomplete="off" value="">
  26. <a href="javascript:;" id="getVerfyCode" class="qs-btn qs-btn-inline qs-btn-medium qs-btn-border-gray font14">获取验证码</a>
  27. </div>
  28. <div class="group-list had-remind-box qs-center link_blue" onclick="javascript:location.href='{{route($sub_site.'mobile.login')}}'"><a href="javascript:;"><span class="mal"></span><span class="txt-o-red">点击立即登录</span></a></div>
  29. <div class="group-list verfy">
  30. <input id="mobile_vcode" name="mobile_vcode" type="text" class="l-input font14" placeholder="请输入手机验证码" autocomplete="off">
  31. </div>
  32. <div class="group-list pwd">
  33. <input id="password" name="password" type="password" class="l-input font14" placeholder="请输入账户密码" autocomplete="off">
  34. </div>
  35. <div class="group-list pwd">
  36. <input id="password_confirmation" name="password_confirmation" type="password" class="l-input font14" placeholder="请确认账户密码" autocomplete="off">
  37. </div>
  38. <div class="group-list">
  39. <select name="member_status" id="member_status" class="l-input font14">
  40. <option value="1">需要找工作</option>
  41. <option value="2">已找到工作</option>
  42. <option value="3">我是人才</option>
  43. </select>
  44. </div>
  45. <div class="talent-form" style="display:none;">
  46. <div class="group-list">
  47. <input id="password_confirmation" name="realname" class="l-input font14" placeholder="请输入真实姓名" autocomplete="off">
  48. </div>
  49. <div class="group-list">
  50. <select name="card_t_cn" id="card_t_cn" class="l-input font14">
  51. <option value="306">身份证</option>
  52. <option value="307">通过证</option>
  53. <option value="308">户照</option>
  54. </select>
  55. </div>
  56. <div class="group-list">
  57. <input id="password_confirmation" name="id_card" class="l-input font14" placeholder="请输入证件号" autocomplete="off">
  58. </div>
  59. </div>
  60. </div>
  61. <div class="l-tool-bar list_height">
  62. <div class="read-agreement">
  63. <div class="for-checkbox active" id="for-checkbox">我已阅读并同意
  64. </div>
  65. </div>
  66. <div class="agreement link_gray6"><a href="#userAgreenment" id="reg_agreement">《用户服务协议》</a></div>
  67. <div class="clear"></div>
  68. </div>
  69. <div class="split-block"></div>
  70. <div class="btn-spacing btn-spacing-nmb"><a id="btnRegPersonal" href="javascript:;" class="qs-btn qs-btn-blue font18">注册个人会员</a></div>
  71. <input type="hidden" name="reg_type" value="1" />
  72. <input type="hidden" name="utype" value="2" />
  73. <input type="hidden" name="reg_source" value="2" />
  74. <input type="hidden" name="agreement" value="1" />
  75. </form>
  76. <div class="r-link-box qs-center link_blue"><a href="{{route($sub_site.'mobile.login')}}">已有账号,立即登录</a></div>
  77. <input type="hidden" id="J_config_varify_reg" value="1"/>
  78. <!--用户服务协议-->
  79. <script type="text/html" id="agreementTxt">
  80. <div class="headernavfixed">
  81. <div class="headernav font18"><div class="title">用户服务协议<div class="return js-back"></div><div class="rbtn"></div></div></div>
  82. </div>
  83. <div class="agreement-content">{!! str_replace(["\r\n","\n"], ["",""], config('aix.system.register_agreement.register_agreement.reg_agreement')) !!}</div>
  84. </script>
  85. @endsection
  86. @section('script')
  87. <script type="text/javascript" src="{{ theme_asset('app/js/regular.js') }}"></script>
  88. <script type="text/javascript" src="{{ theme_asset('mobile/js/popWin.js') }}"></script>
  89. <script>
  90. //是否人才
  91. $('#member_status').change(function(){
  92. var val = $(this).val();
  93. if (val == 3) {
  94. $('.talent-form').show();
  95. } else {
  96. $('.talent-form').hide();
  97. }
  98. });
  99. // 用户服务协议
  100. $('#for-checkbox').on('click', function() {
  101. $(this).toggleClass('active');
  102. if ($(this).hasClass('active')) {
  103. $('input[name=agreement]').val(1);
  104. } else {
  105. $('input[name=agreement]').val(0);
  106. }
  107. })
  108. var agreementTemp = $('#agreementTxt').html();
  109. $("#reg_agreement").on("click",function(){
  110. popWin.init({
  111. from:"right",
  112. html:agreementTemp,
  113. handle:function (a) {
  114. }
  115. })
  116. })
  117. var config_varify_reg = eval($('#J_config_varify_reg').val());
  118. // 配置极验
  119. if (config_varify_reg) {
  120. //手机注册
  121. var handlerRegMobile = function(captchaObj) {
  122. captchaObj.bindForm("#regMobileForm");
  123. captchaObj.onSuccess(function() {
  124. regPerByMobileHandler();
  125. });
  126. captchaObj.onError(function() {
  127. });
  128. $('#btnRegPersonal').on('click', function () {
  129. // var id_cardValue = $.trim($('input[name=id_card]').val());
  130. var mobileValue = $.trim($('input[name=mobile]').val());
  131. var verifycodeValue = $.trim($('input[name=mobile_vcode]').val());
  132. var passwordValue = $.trim($('input[name=password]').val());
  133. var password_confirmation = $.trim($('input[name=password_confirmation]').val());
  134. var agreementValue = $('input[name=agreement]').val();
  135. /*if (id_cardValue == '') {
  136. qsToast({type:2,context: '请输入身份证号码'});
  137. return false;
  138. }
  139. if(!IsCardVali('id_card',id_cardValue)) {
  140. qsToast({type:2,context: '身份证格式错误'});
  141. return false;
  142. }
  143. if(!IsCard('id_card',id_cardValue)) {
  144. qsToast({type:2,context: '该身份证已被注册'});
  145. return false;
  146. }*/
  147. if (mobileValue == '') {
  148. qsToast({type:2,context: '请输入手机号码'});
  149. return false;
  150. }
  151. if (mobileValue != "" && !regularMobile.test(mobileValue)) {
  152. qsToast({type:2,context: '手机号码格式不正确'});
  153. return false;
  154. }
  155. if (verifycodeValue == '') {
  156. qsToast({type:2,context: '请输入手机验证码'});
  157. return false;
  158. }
  159. if (passwordValue == '') {
  160. qsToast({type:2,context: '请输入账户密码'});
  161. return false;
  162. }
  163. if(!inputRegValiPassword(passwordValue)){
  164. qsToast({type:2,context: '密码长度要求为6-16个字符'});
  165. return false;
  166. }
  167. if (password_confirmation == '') {
  168. qsToast({type:2,context: '请确认账户密码'});
  169. return false;
  170. }
  171. if (passwordValue != password_confirmation) {
  172. qsToast({type:2,context: '两次输入的密码不一致'});
  173. return false;
  174. }
  175. if (agreementValue !=1) {
  176. qsToast({type:2,context: '请接受用户服务协议'});
  177. return false;
  178. }
  179. captchaObj.verify();
  180. });
  181. };
  182. //发送短信
  183. var handler = function(captchaObj) {
  184. captchaObj.appendTo("#popup-captcha");
  185. captchaObj.onSuccess(function() {
  186. var result = captchaObj.getValidate();
  187. toSetSms(result);
  188. });
  189. captchaObj.onError(function() {
  190. });
  191. $('#getVerfyCode').on('click', function () {
  192. var mobileValue = $.trim($('input[name=mobile]').val());
  193. if (mobileValue == '') {
  194. qsToast({type:2,context: '请输入手机号'});
  195. return false;
  196. }
  197. captchaObj.verify();
  198. });
  199. };
  200. gt_init(handlerRegMobile);
  201. gt_init(handler);
  202. }
  203. $('input[name=mobile]').change(function () {
  204. var currentValue = $(this).val();
  205. if (currentValue.length >= 11) {
  206. if(regularMobile.test(currentValue) && !remoteValid('mobile',currentValue)) {
  207. $('.had-remind-box .mal').text('手机号 ' + currentValue + ' 已注册,');
  208. $('.had-remind-box').show();
  209. } else {
  210. $('.had-remind-box').hide();
  211. }
  212. } else {
  213. $('.had-remind-box').hide();
  214. }
  215. });
  216. $('input[name=id_card]').change(function () {
  217. var currentValue = $(this).val();
  218. if(!IsCardVali('id_card',currentValue)) {
  219. qsToast({type:2,context: '身份证格式错误'});
  220. return false;
  221. }
  222. if(!IsCard('id_card',currentValue)) {
  223. qsToast({type:2,context: '该身份证已被注册'});
  224. return false;
  225. }
  226. });
  227. function IsCard(validType, validValue) {
  228. var result = false;
  229. $.ajax({
  230. url: "{{route('register.check', ['utype'=>2])}}",
  231. cache: false,
  232. async: false,
  233. type: 'post',
  234. dataType: 'json',
  235. data: { type: validType, param: validValue},
  236. success: function(json) {
  237. result= true;
  238. }
  239. });
  240. return result;
  241. }
  242. function IsCardVali(validType, validValue){
  243. var result = false;
  244. $.ajax({
  245. url: "{{route('register.check', ['utype'=>2])}}",
  246. cache: false,
  247. async: false,
  248. type: 'post',
  249. dataType: 'json',
  250. data: { type: validType, param: validValue,vail:1 },
  251. success: function(json) {
  252. result= true;
  253. }
  254. });
  255. return result;
  256. }
  257. // 发送手机验证码
  258. function toSetSms(geet_result) {
  259. var mobileValue = $.trim($('input[name=mobile]').val());
  260. function settime(countdown) {
  261. if (countdown == 0) {
  262. $('#getVerfyCode').removeClass('qs-btn-border-disabled');
  263. $('#getVerfyCode').text('获取验证码');
  264. countdown = 180;
  265. return;
  266. } else {
  267. $('#getVerfyCode').addClass('qs-btn-border-disabled');
  268. $('#getVerfyCode').text('重新发送' + countdown + '秒');
  269. countdown--;
  270. }
  271. setTimeout(function() {
  272. settime(countdown)
  273. },1000)
  274. }
  275. $('#getVerfyCode').prop("disabled", !0);
  276. $('#getVerfyCode').addClass('qs-btn-border-disabled');
  277. $('#getVerfyCode').text('发送中...');
  278. geet_result.mobile= mobileValue;
  279. geet_result.type= "register";
  280. $.ajax({
  281. url: "{{route('sms.send')}}",
  282. type: 'POST',
  283. dataType: 'json',
  284. data: geet_result,
  285. success: function (data) {
  286. // console.log(data);
  287. setTimeout(function() {
  288. qsToast({type:2,context: '验证码已发送,请注意查收'});
  289. // 开始倒计时
  290. var countdowns = 180;
  291. settime(countdowns);
  292. },1000)
  293. },
  294. error: function (errorData) {
  295. // console.log(errorData);
  296. var response=$.parseJSON(errorData.response);
  297. if (errorData.status==422) {//验证错误
  298. $.each(response.errors,function (key,val) {
  299. qsToast({type:2,context: val[0]});
  300. return false;
  301. });
  302. }
  303. else if(errorData.status==400) {//业务错误
  304. qsToast({type:2,context: response.message});
  305. }
  306. setTimeout(function() {
  307. $('#getVerfyCode').prop("disabled", 0);
  308. $('#getVerfyCode').removeClass('qs-btn-border-disabled');
  309. $('#getVerfyCode').text('获取验证码');
  310. },1500)
  311. }
  312. });
  313. }
  314. // 个人手机注册处理程序
  315. function regPerByMobileHandler() {
  316. $('#btnRegPersonal').text('注册中...').addClass('btn_disabled').prop('disabled', !0);
  317. $.ajax({
  318. url: "{{route($sub_site.'mobile.register.person')}}",
  319. type: 'POST',
  320. dataType: 'json',
  321. data: $('#regMobileForm').serialize(),
  322. success: function (data) {
  323. qsToast({type:2,context: "注册成功,正在为你跳转.."});
  324. setTimeout(function () {
  325. window.location.href = data.data.url;
  326. },1000)
  327. },
  328. error:function(errorData) {
  329. $('#btnRegPersonal').text('注册个人会员').removeClass('btn_disabled').prop('disabled', 0);
  330. var response=$.parseJSON(errorData.response);
  331. if (errorData.status==422) {//验证错误
  332. $.each(response.errors,function (key,val) {
  333. qsToast({type:2,context: val[0]});
  334. return false;
  335. });
  336. }
  337. else if(errorData.status==400) {//业务错误
  338. qsToast({type:2,context: response.message});
  339. }
  340. }
  341. });
  342. }
  343. /**
  344. * 验证用户名等是否重复
  345. * @param validType 验证类型
  346. * @param validValue 值
  347. * @returns {boolean|*}
  348. */
  349. function remoteValid(validType, validValue){
  350. var result = false;
  351. $.ajax({
  352. url: "{{route('register.check', ['utype'=>2])}}",
  353. cache: false,
  354. async: false,
  355. type: 'post',
  356. dataType: 'json',
  357. data: { type: validType, param: validValue },
  358. success: function(json) {
  359. result= true;
  360. }
  361. });
  362. return result;
  363. }
  364. /**
  365. * 验证密码长度
  366. * @param value 密码
  367. * @returns {boolean}
  368. */
  369. function inputRegValiPassword(value){
  370. achoice = true;
  371. if(value.length>16 || value.length<6){
  372. achoice = false;
  373. }
  374. return achoice;
  375. }
  376. </script>
  377. @endsection