index.vue 3.7 KB

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