推广小程序前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

188 lines
4.2 KiB

<template>
<uv-popup ref="popup" z-index="99999" :closeOnClickOverlay="false"
:customStyle="{ backgroundColor: 'transparent' }">
<view class="privacyPopup">
<view class="icon">
<image src="@/static/image/PrivacyAgreementPoup/icon.png" mode="widthFix"></image>
</view>
<view class="title">
<view>协议与隐私政策</view>
</view>
<view class="content_pri">
<view class="text">
请您务必审慎阅读充分理解用户协议和隐私政策各条款包括但不限于用户注意事项用户行为规范以及为了向你提供服务而收集使用存储你个人信息的情况等你可阅读<text
class="blk" @tap="handleOpenPrivacyContract">工程项目打卡平台用户服务协议</text><text
class="blk" @tap="handleOpenPrivacyContract">工程项目打卡平台隐私权政策</text>了解详细信息如你同意请点击下方按钮开始接受我们的服务
</view>
</view>
<!-- <view class="config">
<uv-checkbox-group v-model="checkboxValue" shape="circle">
<view class="content">
<view style="display: flex;">
<uv-checkbox size="30rpx" :name="1"></uv-checkbox>
同意<text @tap="handleOpenPrivacyContract">工程项目打卡平台用户服务协议</text>
</view>
<view class="">
以及<text @tap="handleOpenPrivacyContract">工程项目打卡平台隐私权政策</text>
</view>
</view>
</uv-checkbox-group>
</view> -->
<view class="pri_btn">
<button class="confuse_btn" @click="confusePrivacy">拒绝</button>
<button class="confirm_btn" id="agree-btn" open-type="agreePrivacyAuthorization"
@agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
</view>
</view>
</uv-popup>
</template>
<script>
export default {
name: 'PrivacyAgreementPoup',
data() {
return {
resolvePrivacyAuthorization: {},
checkboxValue: false
}
},
mounted() {
if (wx.getPrivacySetting) {
wx.getPrivacySetting({
success: res => {
// console.log(res)
if (res.needAuthorization) {
// 需要弹出隐私协议
this.init()
}
},
fail: () => {}
})
}
},
methods: {
//初始化
init(resolve) {
this.$refs.popup.open('center')
this.resolvePrivacyAuthorization = resolve
},
// 打开隐私协议
goToPrivacy() {
wx.openPrivacyContract({
success: () => {
console.log('打开成功');
}, // 打开成功
fail: () => {
uni.showToast({
title: '打开失败,稍后重试',
icon: 'none'
})
} // 打开失败
})
},
// 拒绝
confusePrivacy() {
this.$refs.popup.close()
this.resolvePrivacyAuthorization({
event: 'disagree'
})
},
// 同意
handleAgreePrivacyAuthorization() {
// 告知平台用户已经同意,参数传同意按钮的id
this.resolvePrivacyAuthorization({
buttonId: 'agree-btn',
event: 'agree'
})
this.$refs.popup.close()
},
handleOpenPrivacyContract() {
// 打开隐私协议页面
wx.openPrivacyContract({
success: () => {}, // 打开成功
fail: () => {}, // 打开失败
complete: () => {}
})
}
}
}
</script>
<style lang="scss" scoped>
.privacyPopup {
width: 90%;
margin: 0rpx auto;
background: white;
border-radius: 20rpx;
box-sizing: border-box;
padding: 40rpx 30rpx;
.icon {
display: flex;
justify-content: center;
image {
width: 100rpx;
}
}
.title {
text-align: center;
font-size: 36rpx;
margin: 30rpx 0rpx;
}
.content_pri {
margin-bottom: 30rpx;
font-size: 28rpx;
color: #707070;
.text {
.blk {
color: black;
}
}
}
.config {
font-size: 28rpx;
text-align: center;
line-height: 40rpx;
margin-bottom: 30rpx;
text {
color: #00aaff;
}
.content {
display: flex;
}
}
.pri_btn {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
button {
width: 40%;
padding: 5rpx 0rpx;
// background: $main-color;
outline: none;
color: white;
font-size: 30rpx;
&:nth-child(1){
background: #F2F2F2;
color: #707070;
}
}
}
}
</style>