index.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. <template>
  2. <view class="register absolute">
  3. <view class="shading">
  4. <view class="pictrue acea-row row-center-wrapper">
  5. <image src="/static/images/logo2.png"></image>
  6. </view>
  7. </view>
  8. <view class="whiteBg">
  9. <view class="title">找回密码</view>
  10. <view class="list">
  11. <view class="item">
  12. <view class="acea-row row-middle">
  13. <image src="/static/images/phone_1.png"></image>
  14. <input type="text" placeholder="输入手机号码" placeholder-class="placeholder" v-model="account" class="input"/>
  15. </view>
  16. </view>
  17. <view class="item">
  18. <view class="align-left acea-row row-middle">
  19. <image src="/static/images/code_2.png"></image>
  20. <input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" placeholder-class="placeholder"/>
  21. <button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
  22. {{ text }}
  23. </button>
  24. </view>
  25. </view>
  26. <view class="item">
  27. <view class="acea-row row-middle">
  28. <image src="/static/images/code_1.png"></image>
  29. <input type="password" placeholder="填写您的登录密码" v-model="password" placeholder-class="placeholder" class="input"/>
  30. </view>
  31. </view>
  32. </view>
  33. <view class="logon" @click="registerReset">确认</view>
  34. <navigator url="/pages/users/login/index" class="tip">
  35. <text class="font-color">立即登录</text>
  36. </navigator>
  37. </view>
  38. <view class="bottom"></view>
  39. </view>
  40. </template>
  41. <script>
  42. import sendVerifyCode from "@/mixins/SendVerifyCode";
  43. import { registerVerify, registerReset } from "@/api/user";
  44. export default {
  45. data() {
  46. return {
  47. account: "",
  48. password: "",
  49. captcha: ""
  50. };
  51. },
  52. mixins: [sendVerifyCode],
  53. methods: {
  54. registerReset() {
  55. let that = this;
  56. if (!that.account) return that.$util.Tips({
  57. title: '请填写手机号码'
  58. });
  59. if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
  60. title: '请输入正确的手机号码'
  61. });
  62. if (!that.captcha) return that.$util.Tips({
  63. title: '请填写验证码'
  64. });
  65. if (!/^[\w\d]+$/i.test(that.captcha)) return that.$util.Tips({
  66. title: '请输入正确的验证码'
  67. });
  68. if (!that.password) return that.$util.Tips({
  69. title: '请填写密码'
  70. });
  71. if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/i.test(that.password)) return that.$util.Tips({
  72. title: '您输入的密码过于简单'
  73. });
  74. registerReset({
  75. account: that.account,
  76. captcha: that.captcha,
  77. password: that.password
  78. })
  79. .then(res => {
  80. that.$util.Tips({
  81. title: res.msg,
  82. success: () => {
  83. uni.navigateTo({
  84. url: '/pages/login/index'
  85. });
  86. }
  87. });
  88. })
  89. .catch(res => {
  90. console.log(res);
  91. that.$util.Tips({
  92. title: res.msg
  93. });
  94. });
  95. },
  96. async code() {
  97. let that = this;
  98. if (!that.account) return that.$util.Tips({
  99. title: '请填写手机号码'
  100. });
  101. if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
  102. title: '请输入正确的手机号码'
  103. });
  104. registerVerify({ phone: that.account })
  105. .then(res => {
  106. that.$util.Tips({
  107. title: res.msg
  108. });
  109. that.sendCode();
  110. })
  111. .catch(res => {
  112. that.$util.Tips({
  113. title: res
  114. });
  115. });
  116. }
  117. }
  118. };
  119. </script>
  120. <style>
  121. </style>