<template> <view class="changePayPwd-container"> <text class="pwd-describe">请输入当前支付密码</text> <view class="pwd-item"> <u-input v-model="oldPwd" border type="text" input-align="center" placeholder="请输入支付密码" maxlength="50" class="inp-pwd" /> </view> <view class="btn-con"> <u-button class="handle-btn" type="info" size="medium" @click="cancel">取消</u-button> <u-button class="handle-btn" type="primary" size="medium" @click="submit">确定</u-button> </view> <view class="linkbtn-con"> <text class="link-btn" @click="goPage">忘记支付密码</text> </view> </view> </template> <script> export default { data() { return { oldPwd: '' // 旧密码 } }, onShow() { }, onLoad() { }, methods:{ // 确定 submit(){ if(this.oldPwd){ }else{ uni.showToast({ title: '请输入支付密码', icon: 'none' }) } }, // 取消 cancel(){ uni.navigateBack({ delta: 1 }) }, // 忘记支付密码 goPage(){ uni.redirectTo({ url: '/pages/userCenter/userInfo/smsVerification' }) } } } </script> <style lang="less"> .changePayPwd-container{ width: 100%; padding: 0 30rpx; box-sizing: border-box; background-color: #fff; .pwd-describe{ display: block; color: #606266; padding: 80rpx 0 70rpx; text-align: center; } .pwd-item{ .inp-pwd{ } } .btn-con{ display: flex; justify-content: space-between; padding-top: 130rpx; .handle-btn{ display: inline-block; width: 45%; margin: 0 auto; text-align: center; } } .linkbtn-con{ text-align: center; .link-btn{ display: inline-block; font-size: 28rpx; color: #298bf2; margin-top: 200rpx; } } } </style>