138 lines
3.6 KiB
Vue
138 lines
3.6 KiB
Vue
<template>
|
||
<uni-popup ref="refPopup" type="center" @change='change' :safe-area="false">
|
||
<view class="popup-wrapper">
|
||
<view class="title">用户服务协议与隐私政策</view>
|
||
<view class="content">
|
||
在你使用【 {{ $appName }} 】小程序之前，请仔细阅读
|
||
<text class="info" @tap="toService">《用户服务协议》</text>
|
||
与<text class="info" @tap="toPrivacy">《隐私政策》</text>。
|
||
<text>如你同意《用户服务协议》与《隐私政策》请点击“同意”。</text>
|
||
<text>开始使用【 {{ $appName }}】小程序</text>
|
||
</view>
|
||
<view class="but-wrapper">
|
||
<view class="but-item" hover-class="touch-button" @tap="disagreeClose">拒绝</view>
|
||
<button class="but-item agree" id="agree-btn" open-type="agreePrivacyAuthorization"
|
||
@agreeprivacyauthorization="handAgree">同意</button>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { reactive, ref, onMounted } from 'vue'
|
||
const props = defineProps({
|
||
service: { type: String },
|
||
privacy: { type: String }
|
||
})
|
||
const openFlag=ref(false)
|
||
const refPopup = ref(null)
|
||
const emits = defineEmits(['agree'])
|
||
const open = () => {
|
||
getPrivacy()
|
||
refPopup.value.open()
|
||
}
|
||
const vdata = reactive({})
|
||
const close = () => refPopup.value.close()
|
||
const toPrivacy = () => {
|
||
// #ifdef APP-PLUS
|
||
if (props.privacy) return uni.navigateTo(props.privacy)
|
||
// #endif
|
||
// 打开小程序隐私政策
|
||
// #ifdef MP-WEIXIN
|
||
wx.openPrivacyContract(
|
||
{
|
||
fail: () => {
|
||
uni.showToast({
|
||
title: '打开失败请稍后重试', // 打开失败
|
||
icon: 'none'
|
||
})
|
||
},
|
||
}
|
||
)
|
||
// #endif
|
||
|
||
}
|
||
function disagreeClose () {
|
||
close()
|
||
}
|
||
// 获取微信你用户是否同意过隐私政策
|
||
const getPrivacy = () => {
|
||
wx.getPrivacySetting({
|
||
success: (r) => {
|
||
Object.assign(vdata, r)
|
||
if (vdata.needAuthorization) {
|
||
wx.onNeedPrivacyAuthorization(res => {
|
||
vdata.resolve = res
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
const handAgree = () => {
|
||
if (vdata.needAuthorization) {
|
||
vdata.resolve({ buttonId: 'agree-btn', event: 'agree' })
|
||
}
|
||
emits('agree')
|
||
close()
|
||
}
|
||
const toService = () => {
|
||
uni.navigateTo({ url: props.service })
|
||
}
|
||
defineExpose({ open, close })
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.popup-wrapper {
|
||
width: 600rpx;
|
||
border-radius: 20rpx;
|
||
background: #FFF;
|
||
overflow: hidden;
|
||
|
||
.title {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
padding: 30rpx 0 50rpx;
|
||
text-align: center;
|
||
color: rgba(0, 0, 0, 0.50);
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.content {
|
||
|
||
padding-bottom: 70rpx;
|
||
margin: 0 auto;
|
||
width: 500rpx;
|
||
color: #000;
|
||
font-size: 28rpx;
|
||
line-height: 1.5;
|
||
|
||
.info {
|
||
color: $primaryColor;
|
||
}
|
||
}
|
||
|
||
.but-wrapper {
|
||
display: flex;
|
||
|
||
.but-item {
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
height: 110rpx;
|
||
color: rgba(0, 0, 0, 0.70);
|
||
font-size: 32rpx;
|
||
font-weight: 400;
|
||
border-radius: 0;
|
||
}
|
||
|
||
.agree {
|
||
background: $primaryColor;
|
||
color: #fff;
|
||
padding: 0;
|
||
}
|
||
}
|
||
}
|
||
</style>
|
||
|