<!--底部弹窗start-->
<view class="drawer-screen" bindtap="closeModal" data-statu="close" wx:if="{{showModalStatus}}"></view>
<view w-extract class="drawer-box" wx:if="{{showModalStatus}}">
<view class="drawer-box-body">
<text class="drawer-box-header">设置支付密码</text>
<view class="drawer-box-content">
<view class="drawer-box-item">
<text class="drawer-box-item-left">新支付密码:</text>
<view class="drawer-box-item-right">
<input type="password" class="add_num_input" value="{{password}}" bindinput="getPassword"></input>
</view>
</view>
<view class="drawer-box-item">
<text class="drawer-box-item-left">新确认支付密码:</text>
<view class="drawer-box-item-right">
<input type="password" class="add_num_input" value="{{confirm_password}}" bindinput="getConfirmPassword"></input>
</view>
</view>
</view>
<view class="drawer-box-footer">
<view class="drawer-box-footer-cancel" catchtap="cancleSelect">
<text>取消</text>
</view>
<view class="drawer-box-footer-ok" catchtap="okSelect">
<text>确认</text>
</view>
</view>
</view>
</view>
<!--底部弹窗end-->
.drawer-screen {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 12;
background: #000;
opacity: 0.5;
overflow: hidden;
}
.drawer-box {
width: 750rpx;
position: fixed;
bottom: 0rpx;
left: 0;
z-index: 1300;
background: #fff;
animation: showModel 0.3s ease-in-out;
}
.drawer-box-body {
width: 750rpx;
flex-direction: column;
display: flex;
align-items: flex-start;
border-top-left-radius: 30rpx;
border-top-right-radius: 30rpx;
background-color: #ffffff;
padding: 0 0 14rpx 0;
}
.drawer-box-header {
color: #363636;
font-size: 36rpx;
text-overflow: ellipsis;
margin: 62rpx 0 0 56rpx;
}
.drawer-box-content {
display: flex;
align-items: flex-start;
align-self: center;
white-space: normal;
margin: 28rpx 0 0 0;
flex-direction: column;
}
.drawer-box-item{
display: flex;
padding: 20rpx 0;
}
.drawer-box-item-left {
line-height: 28rpx;
color: #363636;
font-size: 28rpx;
margin: 22rpx 26rpx 0 0;
}
.drawer-box-item-right {
box-sizing: border-box;
display: flex;
align-items: center;
border-radius: 10rpx;
background-color: #f5f5f5;
padding: 6rpx 28rpx 6rpx 32rpx;
}
.drawer-box-footer {
display: flex;
align-items: center;
align-self: center;
margin: 112rpx 0 0 0;
}
.drawer-box-footer-cancel {
box-sizing: border-box;
display: flex;
align-items: center;
border-radius: 40rpx;
background-color: #00000f;
padding: 28rpx 126rpx 28rpx 124rpx;
margin: 2rpx 18rpx 0 0;
color: #fec015;
font-size: 28rpx;
}
.drawer-box-footer-ok {
box-sizing: border-box;
display: flex;
align-items: center;
border-radius: 40rpx;
background-color: var(--maincolor,#fec015);
padding: 28rpx 126rpx 28rpx 124rpx;
margin: 2rpx 18rpx 0 0;
color: var(--mainfontcolor,#fec015);
font-size: 28rpx;
}
closeModal() {
this.setData({
showModalStatus: false
})
},
cancleSelect() {
this.setData({
showModalStatus: false
});
},
okSelect() {
if(this.data.passowrd != this.data.confirm_password){
app.tips("两次密码不一致");
return;
}
this.data.lim.setPayPassword({
pay_password:this.data.passowrd
}).then((res)=>{
this.setData({
showModalStatus: false
});
app.tips("支付密码设置成功");
});
},
toSettingPassword(){
this.setData({
passowrd: '',
showModalStatus: true,
});
},
getPassword(e){
this.setData({
passowrd:e.detail.value,
});
},
getConfirmPassword(e){
this.setData({
confirm_password:e.detail.value,
});
}
data:{
showModalStatus:false,
passowrd:'',
confirm_password:'',
}