微信小程序 首页弹出用户协议

话不多说，直接上代码

wxml


  
  

css

.mask{
  position:absolute;top:0;left:0;background:rgba(0,0,0,0.5);z-index:999;width:100%;height:100%;
}
.model_box{
  width:80%;position:fixed;top:50%;left:50%;transform: translate(-50%,-50%);z-index:1000;background:#fff;height:75%;
  border-radius:15rpx;
}
.mb-content{
  padding:10rpx 20rpx 10rpx 25rpx;
  box-sizing:border-box;
  height:80%;
  overflow:scroll;
}
.mb-tit{
  padding:15rpx 0rpx;
  box-sizing:border-box;
  font-size: 34rpx;
  text-align:center;
}
.mb-con{
  font-size:30rpx;
  text-indent:2rem;
  line-height: 1.5;
}
.checkbox{
  display:flex;
  justify-content:center;
  align-items:center;
  height:11%;
}
.checkbox .qx{
  width:50%;
  text-align:center;
  border-right:1rpx solid #efefef;
}
.checkbox .qr{
  position:relative;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:100%;
  box-szing:border-box;
  padding-right:10%;
}

js

data:{
    hidem:1,
    cb:0,
}

handleMove(e){
  //不做任何处理
  },
  qx:function(e){
    this.setData({
        hidem:1
    });
  },
  qx2:function(e){
    this.setData({
      hidem:1
    })
  },
  qr:function(e){
    let that = this;
    if(that.data.cb==0){
      wx.showToast({
        title: '请点击确认框',
        icon:'none'
      })
      return;
    }else{
      
      s.get('common/read_agreement',{},function(res){
        if(res.status==1){
            that.setData({
                hidem:1
            });
        }else{
          if(res.status==-1){
            wx.navigateTo({
              url: '/pages/auth/index',
            })
          }
        }
      });
    }
  },
  cb:function(e){
    let that = this;
    if(that.data.cb==0){
      that.setData({
        cb:1
      })
    }else{
      that.setData({
        cb:0
      })
    }
  },

## 成品图

麻烦各位看官看完点个赞支持一下呗，谢谢啦！