changePayPwd.vue 2.2 KB

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