profile.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. /**
  2. * 账号相关js
  3. *
  4. * @author CaiAoLin
  5. * @date 2018/1/26
  6. * @version
  7. */
  8. $(document).ready(function() {
  9. autoFlashHeight();
  10. try {
  11. if (user !== '') {
  12. $(".sidebar-title").text(user);
  13. }
  14. $.validator.addMethod("isMobile", function(value, element) {
  15. var length = value.length;
  16. var mobile = /^1[3456789]\d{9}$/;
  17. return this.optional(element) || (length == 11 && mobile.test(value));
  18. }, "请正确填写您的手机号码");
  19. const options = {
  20. rules: '',
  21. errorPlacement: function(error, element) {
  22. $(element).addClass('is-invalid');
  23. $('.input-group-append').after(error);
  24. },
  25. errorClass: "invalid-feedback",
  26. errorElement: "div",
  27. highlight: false,
  28. success: function(element) {
  29. $(element).siblings('input').removeClass('is-invalid');
  30. $(element).remove();
  31. },
  32. };
  33. options.rules = {
  34. auth_mobile: {
  35. required: true,
  36. isMobile: true,
  37. },
  38. };
  39. $("#mobile-form").validate(options);
  40. // 获取验证码
  41. let isPosting = false;
  42. $("#get-code").click(function() {
  43. if (isPosting) {
  44. return false;
  45. }
  46. if(!$("#mobile-form").valid()) {
  47. return false;
  48. }
  49. const mobile = $("input[name='auth_mobile']").val();
  50. const btn = $(this);
  51. $.ajax({
  52. url: '/profile/code?_csrf_j=' + csrf,
  53. type: 'post',
  54. data: { mobile: mobile },
  55. dataTye: 'json',
  56. error: function() {
  57. isPosting = false;
  58. },
  59. beforeSend: function() {
  60. isPosting = true;
  61. },
  62. success: function(response) {
  63. isPosting = false;
  64. if (response.err === 0) {
  65. codeSuccess(btn);
  66. $("input[name='code']").removeAttr('readonly');
  67. $("#bind-btn").removeClass('disabled').removeClass('btn-secondary').addClass('btn-primary');
  68. } else {
  69. toast(response.msg, 'error');
  70. }
  71. }
  72. });
  73. });
  74. // 绑定按钮
  75. $("#bind-btn").click(function() {
  76. const code = $("input[name='code']").val();
  77. const mobile = $("input[name='auth_mobile']").val();
  78. if ($(this).hasClass('disabled')) {
  79. return false;
  80. }
  81. if (!(/^1[3456789]\d{9}$/.test(mobile))) {
  82. toast('请填写正确的手机号码', 'error');
  83. return false;
  84. }
  85. if (code.length < 6) {
  86. // alert('请填写正确的验证码');
  87. toast('请填写正确的验证码', 'error');
  88. return false;
  89. }
  90. $.ajax({
  91. url: '/profile/bind?_csrf_j=' + csrf,
  92. type: 'post',
  93. data: { auth_mobile: mobile, code: code },
  94. dataTye: 'json',
  95. success: function(response) {
  96. if (response.err === 0) {
  97. window.location.href = response.url;
  98. } else {
  99. toast(response.msg, 'error');
  100. }
  101. }
  102. });
  103. });
  104. // 修改手机
  105. $('#change-mobile').click(function () {
  106. $(this).parents('.form-group').hide();
  107. $('#mobile-form').show();
  108. });
  109. // 移除签名
  110. $('#delete-sign').click(function () {
  111. postData('/profile/sign/delete', {}, function (result) {
  112. $('#sign-show').html('');
  113. toast('移除成功', 'success');
  114. })
  115. });
  116. // 签名模式切换
  117. $('.sign-type').click(function () {
  118. if (parseInt($(this).val()) === 1) {
  119. $('#show-upload').hide();
  120. $('#show-qrcode').show();
  121. } else {
  122. $('#show-upload').show();
  123. $('#show-qrcode').hide();
  124. }
  125. });
  126. // 上传签名
  127. $('#sign-upload').change(function () {
  128. const file = this.files[0];
  129. const ext = file.name.toLowerCase().split('.').splice(-1)[0];
  130. const imgStr = /(jpg|jpeg|png|bmp|BMP|JPG|PNG|JPEG)$/;
  131. if (!imgStr.test(ext)) {
  132. toast('请上传正确的图片格式文件','error');
  133. return
  134. }
  135. if ($(this).val()) {
  136. const formData = new FormData();
  137. formData.append('file', this.files[0]);
  138. postDataWithFile('/profile/sign/upload', formData, function (result) {
  139. const html = '<img src="/public/upload/sign/'+ result.sign_path +'" width="90">';
  140. $('#sign-show').html(html);
  141. $('#sign-upload').val('');
  142. });
  143. }
  144. })
  145. } catch (error) {
  146. console.log(error);
  147. }
  148. });
  149. /**
  150. * 获取成功后的操作
  151. *
  152. * @param {Object} btn - 点击的按钮
  153. * @return {void}
  154. */
  155. function codeSuccess(btn) {
  156. let counter = 60;
  157. btn.addClass('disabled').text('重新获取 ' + counter + 'S');
  158. btn.parent().siblings('input').removeAttr('readonly').attr('placeholder', '输入短信中的6位验证码');
  159. const bindBtn = $("#bind-btn");
  160. bindBtn.removeClass('btn-secondary disabled').addClass('btn-primary');
  161. const countDown = setInterval(function() {
  162. const countString = counter - 1 <= 0 ? '' : ' ' + (counter - 1) + 'S';
  163. // 倒数结束后
  164. if (countString === '') {
  165. clearInterval(countDown);
  166. btn.removeClass('disabled');
  167. }
  168. const text = '重新获取' + countString;
  169. btn.text(text);
  170. counter -= 1;
  171. }, 1000);
  172. }