resetPassword.vue 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. <template>
  2. <view class="">
  3. <view class="navbar">
  4. <view class="back">
  5. <text class="iconfont icon-fanhui " @click="backLast()"></text>
  6. </view>
  7. <text>修改密码</text>
  8. </view>
  9. <view class="reset">
  10. <view class="list">
  11. <view class="text">
  12. 请输入新密码:
  13. </view>
  14. <input type="text" v-model="password" value="" placeholder="请输入新密码" :password="oldIsshow" />
  15. <view class="eyes" @click="showEyes(1)">
  16. <text v-if="oldIsshow==true" class="iconfont icon-yanjing-bi" style="font-size: 40upx;"></text>
  17. <text v-else class="iconfont icon-yanjing" style="font-size: 40upx; font-weight: bold;"></text>
  18. </view>
  19. </view>
  20. <view class="list">
  21. <view class="text">
  22. 确认新密码:
  23. </view>
  24. <input type="text" value="" v-model="surePassword" placeholder="确认密码" :password="newIshow" />
  25. <view class="eyes" @click="showEyes(2)">
  26. <text v-if="newIshow==true" class="iconfont icon-yanjing-bi" style="font-size: 40upx;"></text>
  27. <text v-else class="iconfont icon-yanjing" style="font-size: 40upx; font-weight: bold;"></text>
  28. </view>
  29. </view>
  30. </view>
  31. <view class="submit" @click="submit()">
  32. 确认修改
  33. </view>
  34. </view>
  35. </template>
  36. <script>
  37. var app = getApp()
  38. import navBar from '../../components/navBar/navbar.vue';
  39. export default {
  40. components: {
  41. navBar
  42. },
  43. data() {
  44. return {
  45. password: "",
  46. surePassword: '',
  47. oldIsshow: true,
  48. newIshow: true
  49. }
  50. },
  51. methods: {
  52. backLast:function(){
  53. console.log(this.url)
  54. uni.reLaunch({
  55. url:'./index'
  56. })
  57. },
  58. showEyes: function(e) {
  59. if (e == 1) {
  60. this.oldIsshow = !this.oldIsshow
  61. } else {
  62. this.newIshow = !this.newIshow
  63. }
  64. },
  65. submit: function() {
  66. if (this.password !== this.surePassword) {
  67. uni.showToast({
  68. title: '您两次输入的密码不相同,请重新输入',
  69. icon: 'none'
  70. })
  71. } else {
  72. const data = {
  73. id: uni.getStorageSync('userId'),
  74. password: this.password
  75. };
  76. app.request('/user-remake-password', data, 'post').then(res => {
  77. console.log(res)
  78. if (res.statusCode !== 200) {
  79. uni.showToast({
  80. title: '修改失败,请联系管理员',
  81. icon: 'none'
  82. })
  83. } else {
  84. uni.showToast({
  85. title: '修改成功,请重新登录',
  86. icon: 'none'
  87. })
  88. setTimeout(function() {
  89. app.request('/authorization', '', 'delete').then(res => {
  90. uni.reLaunch({
  91. url: '../login/index'
  92. })
  93. })
  94. }, 500)
  95. }
  96. })
  97. }
  98. }
  99. }
  100. }
  101. </script>
  102. <style lang="scss">
  103. page {
  104. background-color: #f4f4f4;
  105. }
  106. .navbar {
  107. font-size: 32upx;
  108. height: 100upx;
  109. line-height: 100upx;
  110. color: #888888;
  111. position: relative;
  112. position: fixed;
  113. top: 0;
  114. z-index: 9999999;
  115. width: 100%;
  116. background-color: #FFFFFF;
  117. text-align: center;
  118. border-bottom: solid 2upx #EFF1F6;
  119. .back {
  120. height: 100upx;
  121. width: 100upx;
  122. text-align: center;
  123. // background-color: #007AFF;
  124. position: absolute;
  125. float: left;
  126. left: 0upx;
  127. font-size: 32upx;
  128. }
  129. }
  130. .reset {
  131. margin-top: 130upx;
  132. background-color: #FFFFFF;
  133. padding: 50upx;
  134. .list {
  135. border-bottom: solid 2upx #f0f0f0;
  136. padding: 10upx 0;
  137. position: relative;
  138. .text {
  139. height: 70upx;
  140. line-height: 70upx;
  141. color: #afafaf;
  142. font-size: 28upx;
  143. }
  144. input {
  145. height: 50upx;
  146. line-height: 50upx;
  147. font-size: 28upx;
  148. padding-left: 55upx;
  149. color: #232323;
  150. background-image: url(../../static/images/password.png);
  151. background-size: 30upx;
  152. background-position: 10upx;
  153. background-repeat: no-repeat;
  154. }
  155. .eyes {
  156. position: absolute;
  157. height: 90upx;
  158. width: 90upx;
  159. z-index: 30000;
  160. bottom: 0upx;
  161. right: 0;
  162. line-height: 90upx;
  163. text-align: center;
  164. color: #e69d90;
  165. font-size: 40upx;
  166. }
  167. }
  168. }
  169. .submit {
  170. width: 70%;
  171. font-size: 30upx;
  172. color: #FFFFFF;
  173. height: 70upx;
  174. line-height: 70upx;
  175. background-color: #e61916;
  176. margin: 0 auto;
  177. margin-top: 100upx;
  178. text-align: center;
  179. border-radius: 10upx;
  180. }
  181. </style>