//获取用户信息授权弹窗
<!--弹窗 -->
<view class="modal {{showAmountModal.showModal}}">
<view class="modal-content">
<view class="modal-line-box amount-title">
<text>温馨提示</text>
</view>
<view>点击授权获取微信头像和微信名字</view>
</view>
<button open-type="getUserInfo" type='primary' bindgetuserinfo='onGotUserInfo' class="button-color">授权</button>
</view>
<view class="mask {{showAmountModal.showMask}}"></view>
/* 弹窗 */
.modal{
position: absolute;
left: 0rpx;
top: 20%;
z-index: 200;
width:100%;
}
.modal-content{
width:60%;
height:300rpx;
margin:0 auto;
background:#fff;
font-size:30rpx;
font-family:"微软雅黑";
padding:20rpx;
border-radius:5px;
}
.modal-line-box{
margin: 30rpx 0rpx;
}
.modal-line-box.amount-title{
text-align: center;
font-size: 40rpx;
}
.mask{
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height:100%;
z-index: 100;
background:rgba(0,0,0,0.5);
}
.showMask,.showModal{
display: block;
}
.hideMask,.hideModal{
display: none;
}
.button-color{
width:30%;
margin-top:-94rpx;
height:65rpx;
display:flex;
align-items:center;
justify-content:center;
}
//js
showAmountModal: {
showModal: 'hideModal',
showMask: 'hideModal',
},
that.setData({
showAmountModal: {
showModal: 'showModal',
showMask: 'showMask',
}
})
that.setData({
showAmountModal: {
showModal: 'hideModal',
showMask: 'hideMask',
},
})
//选择按钮弹窗
<!--弹窗 -->
<view class="modal {{showAmountModal.showModal}}">
<view class="modal-content">
<view class="modal-line-box amount-title">
<text>温馨提示</text>
</view>
<view class='modal-mian'>请对该订单选择您的评价</view>
</view>
<view class='button_all'>
<button type='primary' size='mini' class="button-color" bindtap='good' style='margin-left:-130rpx;'>好评</button>
<button type='primary' size='mini' class="button-color" bindtap='bad' style='margin-left:130rpx;'>差评</button>
</view>
</view>
<view class="mask {{showAmountModal.showMask}}"></view>
/* 弹窗 */
.modal{
position: absolute;
left: 0rpx;
top: 20%;
z-index: 200;
width:100%;
}
.modal-content{
width:70%;
height:400rpx;
margin:0 auto;
background:#fff;
font-size:30rpx;
font-family:"微软雅黑";
padding:20rpx;
border-radius:5px;
}
.modal-mian{
text-align:center;
padding-top:40rpx;
}
.modal-line-box{
margin: 30rpx 0rpx;
}
.modal-line-box.amount-title{
text-align: center;
font-size: 40rpx;
}
.mask{
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height:100%;
z-index: 100;
background:rgba(0,0,0,0.5);
}
.showMask,.showModal{
display: block;
}
.hideMask,.hideModal{
display: none;
}
.button-color{
width:30%;
margin-top:-94rpx;
height:65rpx;
display:flex;
align-items:center;
justify-content:center;
position: absolute;
}
.button_all{
position: relative;
display:flex;
justify-content:center;
}
js
showAmountModal: {
showModal: 'hideModal',
showMask: 'hideModal',
},
//评价
evaluate(e) {
var that = this
console.log(e.currentTarget.dataset.dele)
that.setData({
showAmountModal: {
showModal: 'showModal',
showMask: 'showMask',
}
})
},