Files
huangjingfen/pro_v3.5.1/view/uniapp_v2/components/privacyAgreementPopup/index.vue
apple 8e17762510 feat(uniapp_v2): 二开功能迁移与小程序主包优化
- 从 uniapp 迁移 HJF 页面、API、组件及用户/订单相关改动
- queue、assets 使用独立分包以降低主包体积
- 修复首页单根节点与支付结果页 v-if 链
- 关闭 HjfDemoPanel 全局注册;uniNoticeBar 注释 $getAppWebview 避免 __webviewId__ 报错
- 配置域名与 manifest 应用名称;cache/store 防御性处理

Made-with: Cursor
2026-03-26 12:16:01 +08:00

200 lines
4.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view :style="colorStyle">
<view class="mask" @touchmove.prevent :hidden="isShow === false"></view>
<view class="product-window" :class="{'on':isShow}">
<view class="mp-data">
<text class="mp-name">服务与隐私协议</text>
</view>
<view class="trip-msg">
<view class="trip">
{{`请仔细阅读以下内容,并作出适当的选择:`}}
</view>
</view>
<view class="trip-title">
隐私政策概要
</view>
<view class="trip-msg">
<view class="trip">
当您点击同意并继续使用产品服务时即表示您已理解并同意该条款内容该条款将对您产生法律约束力如您拒绝将无法继续下一步操作
</view>
</view>
<view class="main-color" @click.stop="privacy('privacy')">点击阅读{{agreementName}}</view>
<view class="bottom">
<button class="save open" type="default" id="agree-btn" open-type="agreePrivacyAuthorization"
@agreeprivacyauthorization="handleAgree">同意并继续</button>
<button class="reject" @click="rejectAgreement">取消</button>
</view>
</view>
</view>
</template>
<script>
import colors from "@/mixins/color";
export default {
mixins: [colors],
data() {
return {
isShow: false,
agreementName: '',
configData: this.$Cache.get('BASIC_CONFIG'),
};
},
mounted() {
wx.getPrivacySetting({
success: res => {
if (res.needAuthorization) {
// 需要弹出隐私协议
this.isShow = true
this.agreementName = res.privacyContractName
} else {
this.$emit('onAgree');
// 用户已经同意过隐私协议,所以不需要再弹出隐私协议,也能调用已声明过的隐私接口
// wx.getUserProfile()
// wx.chooseMedia()
// wx.getClipboardData()
// wx.startRecord()
}
},
fail: () => {},
complete: () => {}
})
},
methods: {
// 同意
handleAgree() {
this.isShow = false
this.$emit('onAgree');
},
// 拒绝
rejectAgreement() {
this.isShow = false
uni.switchTab({
url: '/pages/index/index'
})
this.$emit('onReject');
},
// 跳转协议
privacy(type) {
uni.navigateTo({
url: "/pages/users/privacy/index?type=" + type
})
},
}
}
</script>
<style>
.pl-sty {
color: #999999;
font-size: 30rpx;
}
</style>
<style scoped lang="scss">
.product-window.on {
transform: translate3d(0, 0, 0);
}
.mask {
z-index: 99;
}
.product-window {
position: fixed;
bottom: 0;
width: 100%;
left: 0;
background-color: #fff;
z-index: 1000;
border-radius: 40rpx 40rpx 0 0;
transform: translate3d(0, 100%, 0);
transition: all .3s cubic-bezier(.25, .5, .5, .9);
padding: 64rpx 40rpx;
padding-bottom: 38rpx;
padding-bottom: calc(38rpx + constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
padding-bottom: calc(38rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.06);
.icon-guanbi {
position: absolute;
top: 40rpx;
right: 40rpx;
font-size: 24rpx;
font-weight: bold;
color: #999;
}
.mp-data {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 40rpx;
.mp-name {
font-size: 34rpx;
font-weight: 500;
color: #333333;
line-height: 48rpx;
}
}
.trip-msg {
padding-bottom: 32rpx;
.title {
font-size: 30rpx;
font-weight: bold;
color: #000;
margin-bottom: 6rpx;
}
.trip {
color: #333333;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
}
}
.trip-title {
font-size: 28rpx;
font-weight: 500;
color: #333333;
margin-bottom: 8rpx;
}
.main-color {
font-size: 28rpx;
font-weight: 400;
color: var(--view-theme);
margin-bottom: 40rpx;
}
.bottom {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
.save,
.reject {
display: flex;
align-items: center;
justify-content: center;
width: 670rpx;
height: 80rpx;
border-radius: 80rpx;
background-color: #F5F5F5;
color: #333;
font-size: 30rpx;
font-weight: 500;
}
.save {
background-color: var(--view-theme);
color: #fff;
margin-bottom: 24rpx;
}
}
}
</style>