1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
| <template>
| <view v-if="showPrivacy" class="privacy">
| <view class="content">
| <view class="title">隐私保护指引</view>
| <view class="des">
| 在使用当前小程序服务之前，请仔细阅读
| <text class="link" @tap="openPrivacyContract">{{privacyContractName}}</text>
| 。如你同意{{privacyContractName}}，请点击“同意”开始使用，拒绝将退出使用当前小程序。
| </view>
| <view class="btns">
| <button class="item reject" @tap="exitMiniProgram">拒绝</button>
| <button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization"
| @agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
| </view>
| </view>
| </view>
| </template>
|
| <script>
| export default {
| name: 'PrivacyPopup',
| data() {
| return {
| privacyContractName: '',
| showPrivacy: false,
| isRead: false,
| resolvePrivacyAuthorization: null,
| };
| },
| mounted() {
| if (wx.onNeedPrivacyAuthorization) {
| wx.onNeedPrivacyAuthorization((resolve) => {
| this.resolvePrivacyAuthorization = resolve;
| });
| }
|
| if (wx.getPrivacySetting) {
| wx.getPrivacySetting({
| success: (res) => {
| console.log(res, 'getPrivacySetting');
| if (res.needAuthorization) {
| this.privacyContractName = res.privacyContractName;
| this.showPrivacy = true;
| }
| },
| });
| }
| },
|
| methods: {
| openPrivacyContract() {
| wx.openPrivacyContract({
| success: () => {
| this.isRead = true;
| },
| fail: () => {
| uni.showToast({
| title: '遇到错误',
| icon: 'error',
| });
| },
| });
| },
| exitMiniProgram() {
|
| wx.exitMiniProgram();
|
| },
| handleAgreePrivacyAuthorization() {
| if (this.isRead) {
| this.showPrivacy = false;
| if (typeof this.resolvePrivacyAuthorization === 'function') {
| this.resolvePrivacyAuthorization({
| buttonId: 'agree-btn',
| event: 'agree',
| });
| }
| } else {
| uni.showToast({
| title: '请先阅读隐私授权协议',
| icon: 'error',
| });
| }
| },
| },
| };
| </script>
|
| <style>
| .privacy {
| position: fixed;
| top: 0;
| right: 0;
| bottom: 0;
| left: 0;
| background: rgba(0, 0, 0, .5);
| z-index: 9999999;
| display: flex;
| align-items: center;
| justify-content: center;
| }
|
| .content {
| width: 632rpx;
| padding: 48rpx;
| box-sizing: border-box;
| background: #fff;
| border-radius: 16rpx;
| }
|
| .content .title {
| text-align: center;
| color: #333;
| font-weight: bold;
| font-size: 32rpx;
| }
|
| .content .des {
| font-size: 26rpx;
| color: #666;
| margin-top: 40rpx;
| text-align: justify;
| line-height: 1.6;
| }
|
| .content .des .link {
| color: #3e989d;
| text-decoration: underline;
| }
|
| .btns {
| margin-top: 48rpx;
| display: flex;
| }
|
| .btns .item {
| width: 244rpx;
| height: 80rpx;
| overflow: visible;
| display: flex;
| align-items: center;
| margin: 0 12px;
| justify-content: center;
| /* border-radius: 16rpx; */
| box-sizing: border-box;
| border: none !important;
| }
|
| .btns .reject {
| background: #f4f4f5;
| color: #909399;
| }
|
| .btns .agree {
| background: #3e989d;
| color: #fff;
| }
| </style>
|
|
