绑定手机提示窗

<!-- 绑定手机提示窗 -->
<view v-if="checkPhoneShow" class="checkPhone">
<view class="cpwrap">
<view class="cpcon">
需要手机认证,才可以投诉,立即一键授权认证
</view>
<view class="cpbtns">
<view @tap="closeCPWin">取消</view>
<view @tap="getPhoneNumber">去授权</view>
</view>
</view>
</view>


getPhoneNumber(e) {
if (!e.detail.iv) {
uni.showToast({
title: "您取消了授权",
icon: "none",
});
return false;
} else {
uni.showLoading({
title: "正在获取手机号...",
mask: true,
});
var model = {
code: this.code,
state: "Csproj_wxOpen_Bind",
encryptedData: e.detail.encryptedData,
iv: e.detail.iv,
};
this.$store
.dispatch("session/wxOpenGetPhoneNumber", model)
.then((result) => {
this.model.phoneNumber = result.purePhoneNumber;
this.wxLogin();
uni.hideLoading();
})
.catch((error) => {
this.wxLogin();
uni.hideLoading();
});
}
},
.checkPhone{
position: fixed;
z-index: 10001;
width: 100%;
height: 100vh;
top:0;
left:0;
background: rgba(0,0,0,0.6);
.cpwrap{
width: 630rpx;
height:240rpx;
margin: 40% auto 0;
border-radius: 20rpx;
background: #fff url("https://s228.app1110631619.qqopenapp.com/jnimg/static/layout/check_phone.png") no-repeat left top;
background-size: 100% auto;
padding-top: 280rpx;
.cpcon{
height: 150rpx;
line-height: 50rpx;
font-size: 36rpx;
text-align: center;
color:#7e7e7e;
width: 407rpx;
font-size: 32rpx;
padding-left: 120rpx;
}
.cpbtns{
widows: 100%;
display: flex;
justify-content: space-between;
border-top: 1rpx solid #dfdede;
view{
width: 300rpx;
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 20rpx;
&:first-child{
color: #3d3d3d;
}
&:last-child{
color: #2f58b5;
border-left:1rpx solid #dfdede;
}
}
}
}
}