隐私协议

manifest.json

@@ -58,6 +58,7 @@
             "minified" : true
         },
         "usingComponents" : true,
+        "__usePrivacyCheck__": true,
         "permission" : {
             "scope.userLocation" : {
                 "desc" : "使用该功能需要获取您的当前位置"

pages/home/index.vue

 <template>
 	<view>
+		<view class="privacy" v-if="showPrivacy">
+			<view class="content">
+				<view class="title">隐私保护指引</view>
+				<view class="des">
+					在使用当前小程序服务之前，请仔细阅读<text class="link" @click="openPrivacyContract">{{privacyContractName}}</text>。如你同意{{privacyContractName}}，请点击“同意”开始使用。
+				</view>
+				<view class="btns">
+					<button class="item reject" @click="exitMiniProgram">拒绝</button>
+					<button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization" @agreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
+				</view>
+			</view>
+		</view>
 		<!-- 顶部图片 -->
-		<image class="top-bg" src="/static/images/common/home-bg.png" mode="widthFix"></image>
-		
-		<!-- 导航栏 -->
-		<c-nav_bar
-			:color="navColor"
-			:title="storeInfo.shop_name"
-			:bg="navBg"
+		<image class="top-bg" src="/static/images/common/home-bg.png" mode="widthFix"></image>
+		
+		<!-- 导航栏 -->
+		<c-nav_bar
+			:color="navColor"
+			:title="storeInfo.shop_name"
+			:bg="navBg"
 		/>
 		
 		<view :style="{height: systemInfo.menuButtonInfo.bottom + 15 + 'px'}"></view>
@@ -94,24 +106,24 @@
 			
 			<view class="w-100 content-wrap">
 				
-				<block v-if="cate_data.xplist.length || cate_data.cxlist.length || cate_data.bklist.length && !searchList.length">
+				<block v-if="cate_data.xplist && cate_data.xplist.length || cate_data.cxlist && cate_data.cxlist.length || cate_data.bklist && cate_data.bklist.length && !searchList.length">
 					<template v-if="cate_data">
 						<goods-module
-							v-if="cate_data.xplist.length > 0"
+							v-if="cate_data.xplist && cate_data.xplist.length > 0"
 							title="新品推荐" 
 							:list="cate_data.xplist" 
 							@purchase="purchase"
 						/>
 						
 						<goods-module
-							v-if="cate_data.cxlist.length > 0"
+							v-if="cate_data.cxlist && cate_data.cxlist.length > 0"
 							title="热销商品"
 							:list="cate_data.cxlist"
 							@purchase="purchase"
 						/>
 						
 						<goods-module
-							v-if="cate_data.bklist.length > 0"
+							v-if="cate_data.bklist && cate_data.bklist.length > 0"
 							title="爆款商品"
 							:list="cate_data.bklist"
 							@purchase="purchase"
@@ -198,7 +210,8 @@ export default {
 	data() {
 		return {
 			rateValue: 0,
-			
+			showPrivacy: false,
+			privacyContractName: '', // 后台定义的协议名
 			baseUrl,
 			cate_data: {},
 			searchList: [],
@@ -215,13 +228,13 @@ export default {
 		overDue,
 		cNavBar
 	},
-	
+	
 	computed: {
-		...mapState(['systemInfo']),
+		...mapState(['systemInfo']),
 		...mapState({
 			isOverdue: state => state.user.isOverdue,
 			token: state => state.user.token
-		})
+		})
 	},
 	
 	mixins: [common_share],
@@ -233,6 +246,7 @@ export default {
 	},
 	
 	onShow() {
+		this.checkPrivacyStatus()
 		// 实时更新店铺信息
 		this.getStoreInfo()
 		if(this.token) {
@@ -263,38 +277,38 @@ export default {
 			uni.hideLoading()
 			uni.stopPullDownRefresh()
 		}, 800)
-	},
-	
-	onPageScroll: throttle(function(e) {
-		const scrollTop = e.scrollTop
-		if(scrollTop > 100) {
-			uni.setNavigationBarColor({
-				frontColor: '#000000',
-				backgroundColor: '#ffffff',
-				animation: true
-			})
-			this.navColor = '#333'
-			this.navBg = 'rgba(255, 255, 255, 1)'
-		} else {
-			uni.setNavigationBarColor({
-				frontColor: '#ffffff',
-				backgroundColor: '#ffffff',
-				animation: true,
-				fail: e=> console.log(e)
-			})
-			this.navColor = '#fff'
-			this.navBg = 'rgba(255, 255, 255, 0)'
-		}
-	}, 300),
-	
-	onReachBottom() {
-		console.log('触底')
-		const cate_data = this.cate_data
-		if(this.checkShowAll(cate_data)) {
-			console.log('pass')
-			this.searchData()
-		}
-	},
+	},
+	
+	onPageScroll: throttle(function(e) {
+		const scrollTop = e.scrollTop
+		if(scrollTop > 100) {
+			uni.setNavigationBarColor({
+				frontColor: '#000000',
+				backgroundColor: '#ffffff',
+				animation: true
+			})
+			this.navColor = '#333'
+			this.navBg = 'rgba(255, 255, 255, 1)'
+		} else {
+			uni.setNavigationBarColor({
+				frontColor: '#ffffff',
+				backgroundColor: '#ffffff',
+				animation: true,
+				fail: e=> console.log(e)
+			})
+			this.navColor = '#fff'
+			this.navBg = 'rgba(255, 255, 255, 0)'
+		}
+	}, 300),
+	
+	onReachBottom() {
+		console.log('触底')
+		const cate_data = this.cate_data
+		if(this.checkShowAll(cate_data)) {
+			console.log('pass')
+			this.searchData()
+		}
+	},
 	
 	methods: {
 		...mapActions('cart', ['setCount']),
@@ -304,7 +318,40 @@ export default {
 		purchase(e) {
 			this.$refs.popup.show(e)
 		},
-		
+		// 适配微信隐私授权
+		checkPrivacyStatus(){
+			if(typeof(wx.getPrivacySetting) != 'function'){
+				return
+			}
+			wx.getPrivacySetting({
+				success: res =>{
+					if(res.needAuthorization){
+						this.showPrivacy = true,
+						wx.hideTabBar()
+						this.privacyContractName = res.privacyContractName
+					}
+				}
+			});
+		},
+		openPrivacyContract() {
+			const _ = this;
+			wx.openPrivacyContract({
+				fail: () => {
+					wx.showToast({
+						title: "遇到错误",
+						icon: "error",
+					});
+				},
+			});
+		},
+		exitMiniProgram(){
+			wx.showTabBar()
+			this.showPrivacy = false
+		},
+		handleAgreePrivacyAuthorization(){
+			wx.showTabBar()
+			this.showPrivacy = false
+		},
 		// 点击菜单
 		handleMenu(type) {
 			checkLogin(() => {
@@ -361,6 +408,15 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.privacy_mask{
+	position: fixed;
+	background-color: rgba(150, 150, 150,.5);
+	height: 100%;
+	width: 100%;
+	left: 0;
+	top: 0;
+	overflow: hidden;
+}
 .top-bg {
 	position: absolute;
 	left: 0;
@@ -438,6 +494,72 @@ export default {
 			}
 		}
 	}
-}
+}
+.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;
+}
 
-</style>
+.content .des {
+    font-size: 26rpx;
+    color: #666;
+    margin-top: 40rpx;
+    text-align: justify;
+    line-height: 1.6;
+}
+
+.content .des .link {
+    color: #07c160;
+    text-decoration: underline;
+}
+
+.btns {
+    margin-top: 48rpx;
+    display: flex;
+}
+
+.btns .item {
+    justify-content: space-between;
+    width: 244rpx;
+    height: 80rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 16rpx;
+    box-sizing: border-box;
+    border: none;
+}
+
+.btns .reject {
+    background: #f4f4f5;
+    color: #909399;
+}
+
+.btns .agree {
+    background: #07c160;
+    color: #fff;
+}
+</style>