upPassword.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <template>
  2. <mobile-frame :frameStyle="frameStyle" @toPath="toPath">
  3. <view class="main">
  4. <view class="one">
  5. <uni-forms ref="form" :modelValue="form" :rules="rules" label-width="auto">
  6. <uni-forms-item label="账号" name="phone">
  7. <uni-easyinput type="text" v-model="form.phone" placeholder="请输入账号" disabled />
  8. </uni-forms-item>
  9. <uni-forms-item label="新密码" name="password">
  10. <uni-easyinput type="password" v-model="form.password" placeholder="请输入新密码" />
  11. </uni-forms-item>
  12. <uni-forms-item label="确认密码" name="is_password">
  13. <uni-easyinput type="is_password" v-model="form.is_password" placeholder="请输入确认密码" />
  14. </uni-forms-item>
  15. </uni-forms>
  16. <view class="btn">
  17. <button type="primary" @click="onSubmit('form')" size="small">提交</button>
  18. <view class="name">提示:为了您的账户安全,建议定期修改密码</view>
  19. </view>
  20. </view>
  21. </view>
  22. </mobile-frame>
  23. </template>
  24. <script>
  25. export default {
  26. data() {
  27. return {
  28. frameStyle: {
  29. useBar: false
  30. },
  31. form: {},
  32. rules: {
  33. password: {
  34. rules: [{
  35. required: true,
  36. errorMessage: '请输入新密码',
  37. }]
  38. },
  39. },
  40. };
  41. },
  42. onLoad: function(e) {
  43. const that = this;
  44. that.watchLogin();
  45. },
  46. onShow: function() {},
  47. methods: {
  48. watchLogin() {
  49. const that = this;
  50. uni.getStorage({
  51. key: 'token',
  52. success: (res) => {
  53. let user = that.$jwt(res.data);
  54. if (user) {
  55. that.$set(that, `form`, {
  56. id: user.id,
  57. phone: user.phone
  58. })
  59. }
  60. },
  61. fail: (err) => {}
  62. })
  63. },
  64. toPath(e) {
  65. if (e && e.route) uni.redirectTo({
  66. url: `/${e.route}`
  67. })
  68. },
  69. // 提交保存
  70. onSubmit(ref) {
  71. const that = this;
  72. that.$refs[ref].validate().then(async params => {
  73. if (params.password == params.is_password) {
  74. const arr = that.$api(`/user/resetPwd/${that.form.id}`, 'POST', params);
  75. console.log(arr);
  76. if (arr.errcode == '0') {
  77. uni.showToast({
  78. title: `密码修改成功`,
  79. icon: 'success',
  80. });
  81. // uni.clearStorage();
  82. // uni.redirectTo({
  83. // url: '/pages/login/index'
  84. // })
  85. } else {
  86. uni.showToast({
  87. title: arr.errmsg,
  88. })
  89. }
  90. } else {
  91. uni.showToast({
  92. title: `密码不一致`,
  93. });
  94. }
  95. // let arr;
  96. // if (data._id) {
  97. // arr = await that.$api(``, 'POST', data)
  98. // } else {
  99. // arr = await that.$api(``, 'POST', data)
  100. // }
  101. })
  102. },
  103. }
  104. }
  105. </script>
  106. <style lang="scss">
  107. .main {
  108. display: flex;
  109. flex-direction: column;
  110. width: 100vw;
  111. height: 100vh;
  112. .one {
  113. padding: 2vw;
  114. .uni-input {
  115. border: #f1f1ff 1px solid;
  116. padding: 2vw 2vw;
  117. border-radius: 1vw;
  118. }
  119. .btn {
  120. text-align: center;
  121. button {
  122. margin: 0 2vw 2vw 2vw;
  123. background-color: var(--ff0Color);
  124. color: var(--fffColor);
  125. }
  126. .name {
  127. color: var(--f85Color);
  128. font-size: var(--font14Size);
  129. }
  130. }
  131. }
  132. }
  133. .uni-forms-item {
  134. margin-bottom: 6vw !important;
  135. display: flex;
  136. flex-direction: row;
  137. }
  138. </style>