changePayPwd.vue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <template>
  2. <view class="changePayPwd-container">
  3. <text class="pwd-describe">请输入当前支付密码</text>
  4. <view class="pwd-item">
  5. <input v-model="oldPwd" border type="password" placeholder="请输入支付密码" :maxlength="30" class="inp-pwd" />
  6. </view>
  7. <view class="btn-con">
  8. <u-button class="handle-btn" type="info" size="medium" @click="cancel">取消</u-button>
  9. <u-button class="handle-btn" type="primary" size="medium" @click="submit">确定</u-button>
  10. </view>
  11. <view class="linkbtn-con">
  12. <text class="link-btn" @click="goPage">忘记支付密码</text>
  13. </view>
  14. </view>
  15. </template>
  16. <script>
  17. import { checkPayPwd } from '@/api/order.js'
  18. import md5 from 'md5'
  19. export default {
  20. data() {
  21. return {
  22. oldPwd: '' // 旧密码
  23. }
  24. },
  25. onShow() {
  26. },
  27. onLoad() {
  28. },
  29. methods:{
  30. // 确定
  31. submit(){
  32. if(this.oldPwd){
  33. checkPayPwd({oldPayPassword:md5(this.oldPwd)}).then(res=>{
  34. if(res.status == 200) {
  35. // 跳转到设置密码
  36. uni.redirectTo({
  37. url: `/pages/userCenter/userInfo/paymentPwd?oldPwd=${this.oldPwd}`
  38. })
  39. }
  40. })
  41. }else{
  42. uni.showToast({ title: '请输入支付密码', icon: 'none' })
  43. }
  44. },
  45. // 取消
  46. cancel(){
  47. uni.navigateBack({ delta: 1 })
  48. },
  49. // 忘记支付密码
  50. goPage(){
  51. uni.redirectTo({
  52. url: '/pages/userCenter/userInfo/smsVerification'
  53. })
  54. }
  55. }
  56. }
  57. </script>
  58. <style lang="less">
  59. .changePayPwd-container{
  60. width: 100%;
  61. padding: 0 30rpx;
  62. box-sizing: border-box;
  63. background-color: #fff;
  64. .pwd-describe{
  65. display: block;
  66. color: #606266;
  67. padding: 80rpx 0 70rpx;
  68. text-align: center;
  69. }
  70. .pwd-item{
  71. .inp-pwd{
  72. padding: 10upx 0;
  73. border: 1px solid #cacaca;
  74. text-align: center;
  75. }
  76. }
  77. .btn-con{
  78. display: flex;
  79. justify-content: space-between;
  80. padding-top: 130rpx;
  81. .handle-btn{
  82. display: inline-block;
  83. width: 45%;
  84. margin: 0 auto;
  85. text-align: center;
  86. }
  87. }
  88. .linkbtn-con{
  89. text-align: center;
  90. .link-btn{
  91. display: inline-block;
  92. font-size: 28rpx;
  93. color: #298bf2;
  94. margin-top: 200rpx;
  95. }
  96. }
  97. }
  98. </style>