Browse Source

新增关注公众号组件

xuqiaoying 3 years ago
parent
commit
0cef1940ef
1 changed files with 102 additions and 2 deletions
  1. 102 2
      pages/index/index.vue

+ 102 - 2
pages/index/index.vue

@@ -170,7 +170,16 @@
 		</view>
 
 		<!-- <tab-bar v-model="current" :list="tabbarlist" :mid-button="true" :mid-button-size="50" class="tab_items"></tab-bar> -->
-
+		<!-- <view v-if="isLogin" class="official">
+			<u-icon name="close"></u-icon>
+			<official-account @load='bindload'></official-account>
+		</view> -->
+		<view class="weixin_official_account" v-if="isLogin && (isFollow != 1) && curClose" :style="{'opacity':opacity}">
+			<text class="txt">关注【祥粤学校】公众号,通知不再错过</text>
+			<button type="default" class="btn btn-official">去关注<official-account class="official-account" id="official_account" @click.native="toFollows"></official-account>
+			</button>
+			<u-icon name="close" class="icon-close" @click="closeOff"></u-icon>
+		</view>
 	</view>
 </template>
 
@@ -233,11 +242,16 @@ export default {
 			isLogin:false,
 			isOld:false,
 			current: 0,
-            tabbarlist: this.$store.state.tabLists
+            // tabbarlist: this.$store.state.tabLists,
+			showOfficial: false,
+			opacity: 1,
+			isFollow: false, //是否关注过
+			curClose: true, // 当天时是否关闭过
 		};
 	},
 	onPullDownRefresh() {},
 	async onLoad(option) {
+		this.isLogin = this.$method.isLogin()
 		this.dictObj
 		this.getAdvertising();
 		if(this.$method.isLogin()) {
@@ -268,6 +282,10 @@ export default {
 		})
 	},
 	onShow() {
+		let userInfo = this.$store.state.userInfo
+		this.isFollow = userInfo && userInfo.userFollowWx // 不是1就是没关注
+		this.isClickOff() //关注公众号,每天最多显示1次;当天学员关闭弹窗后,无需再显示
+
 		uni.removeStorageSync('goPath')
 		this.courseList();
 		this.bankList();
@@ -302,6 +320,28 @@ export default {
 	},
 	methods: {
 		...mapActions(['getUserInfo','appCommonConfig']),
+
+		// 每天最多显示1次;当天学员关闭弹窗后,无需再显示
+		isClickOff() {
+			//当天23:59:59秒 转换成的毫秒数
+			const end = new Date(new Date(new Date().toLocaleDateString()).getTime()+24*60*60*1000-1).getTime()
+			const start = new Date().getTime() //当前时间的毫秒数
+			if(uni.getStorageSync('endTime')){	//首先判断本地有没有存入当天23:59:59秒的毫秒数
+				if(start > uni.getStorageSync('endTime')){ //当前时间毫秒数大于当天23:59:59秒
+					this.curClose = true
+					uni.removeStorageSync('curClose')
+					uni.removeStorageSync('endTime')
+				} else {
+					this.curClose = uni.getStorageSync('curClose') ? false : true
+				}
+			}else{
+				uni.setStorageSync("endTime", end) //存入当天晚上23:59:59秒的毫秒数
+			}
+		},
+		closeOff() {
+			this.curClose = false
+			uni.setStorageSync("curClose", '1')
+		},
 		toFixed(number) {
 			if(number > 0) {
 				return number.toFixed(2)
@@ -1177,4 +1217,64 @@ page {
 	font-weight: bold;
 	color: #32467B;
 }
+.official {
+	width:100%;
+	position:fixed;
+	bottom: 0;
+	left: 0;
+	background-color: #fff;
+}
+.weixin_official_account {
+	position: fixed;
+	z-index: 20211208;
+	bottom: 0;
+	left: 0;
+	// transform: translateX(-50%);
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	width: 100%;
+	height: 84rpx;
+	padding: 0 32rpx;
+	background: #EEF6FF;
+	// border-radius: 6rpx;
+
+	.txt {
+		font-size: 24rpx;
+		color: #3577E8;
+	}
+
+	.btn {
+		position: relative;
+		width: 136rpx;
+		height: 56rpx;
+		line-height: 56rpx;
+		padding: 0;
+		background: #3577E8;
+		border-radius: 80rpx;
+		overflow: hidden;
+		text-align: center;
+		font-size: 24rpx;
+		color: #fff;
+
+		.official-account {
+			position: absolute;
+			z-index: 20211209;
+			right: -14px;
+			top: -40px;
+			opacity: 0;
+		}
+	}
+
+	.icon-close {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 50rpx;
+		height: 68rpx;
+		font-size: 22rpx;
+		color: #7B8284;
+	}
+}
+
 </style>