llpreheat/pages/index/index.vue

<template>
	<view>
		<image src="https://aliyunoss.hn12301.net/learnlaw/xfsp_p_bj.jpg" style="width: 750rpx;" mode="widthFix"></image>
		<view style="position: absolute;top: 1210rpx;width: 300rpx;left: 225rpx;height: 80rpx;" @click="goRegister"></view>
		
		<view class="side-tab" style="top: 350rpx;" hover-class="side-tab-hover" @click="goRecords">答题记录</view>
		<view class="side-tab" style="top: 430rpx;" hover-class="side-tab-hover" @click="goRules">活动规则</view>
		<view class="blocked-mask" v-if="blocked">
			<text class="blocked-tip">{{ blockTip }}</text>
			<text class="blocked-sub">本活动仅支持手机微信访问</text>
		</view>
	</view>
</template>

<script>
	const APP_ID = 'wx71c218bd9ff0e2da'
	const SCOPE = 'snsapi_base'

	export default {
		data() {
			return {
				blocked: false,
				blockTip: ''
			}
		},
		onLoad() {
			// if (new Date().getTime() < new Date('2026/09/02 10:00:00')) {
			// 	uni.redirectTo({
			// 		url:'/pages/jqqd/jqqd'
			// 	})
			// }
			this.initLogin()
		},
		onShow() {
			if (this.blocked) return
			const openId = uni.getStorageSync('openId')
			const isRegistered = uni.getStorageSync('isRegistered')
			const userId = uni.getStorageSync('userId')
			if (openId && (!isRegistered || !userId)) {
				this.loginWithOpenId(openId)
			}
		},
		methods: {
			initLogin() {
				if (!this.isWechatBrowser()) {
					this.block('请在微信中打开')
					return
				}
				if (this.isPcWechat()) {
					this.block('请使用手机微信打开')
					return
				}
				let openId = uni.getStorageSync('openId')
				if (openId) {
					this.loginWithOpenId(openId)
					return
				}
				const code = this.getCodeFromUrl()
				if (code) {
					this.exchangeOpenId(code)
				} else {
					this.wechatAuth()
				}
			},
			block(tip) {
				this.blocked = true
				this.blockTip = tip
			},
			isWechatBrowser() {
				return /MicroMessenger/i.test(navigator.userAgent)
			},
			isPcWechat() {
				return /MicroMessenger/i.test(navigator.userAgent) && /WindowsWechat|MacWechat/i.test(navigator.userAgent)
			},
			getCodeFromUrl() {
				const match = window.location.href.match(/[?&]code=([^&#]+)/)
				return match ? match[1] : null
			},
			cleanUrlCode() {
				const cleanUrl = window.location.href.replace(/[?&]code=[^&#]*(&|#|$)/, (m, p1) => p1 === '&' ? '?' : (
					p1 === '#' ? '#' : ''))
				window.history.replaceState({}, '', cleanUrl)
			},
			wechatAuth() {
				const redirectUri = encodeURIComponent(window.location.href.split('?')[0].split('#')[0])
				const url =
					`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APP_ID}&redirect_uri=${redirectUri}&response_type=code&scope=${SCOPE}&state=STATE#wechat_redirect`
				window.location.href = url
			},
			loginWithOpenId(openId) {
				this.$u.api.wxOpenidLogin({ wenjuan_id: 1001, open_id: openId }).then(loginRes => {
					if (!loginRes.Data) {
						uni.setStorageSync('isRegistered', false)
						return
					}
					if (loginRes.code === 0 && loginRes.Data?.user_name && loginRes.Data?.user_phone) {
						uni.setStorageSync('isRegistered', true)
						uni.setStorageSync('userId', loginRes.Data.user_id)
						uni.setStorageSync('userName', loginRes.Data.user_name)
						uni.setStorageSync('userPhone', loginRes.Data.user_phone)
					}
				}).catch(err => {
					console.error('登录请求失败', err)
				})
			},
			goRegister() {
				const isRegistered = uni.getStorageSync('isRegistered')
				if (isRegistered) {
					uni.navigateTo({
						url: '/pages/answer/answer'
					})
					return
				}
				uni.navigateTo({
					url: '/pages/register/register'
				})
			},
goRecords() {
				uni.navigateTo({
					url: '/pages/records/records'
				})
			},
			goRules() {
				uni.navigateTo({
					url: '/pages/rules/rules'
				})
			},
			exchangeOpenId(code) {
				this.$u.api.getWxOpenId(code).then(res => {
					if (res.code !== 0 || !res.Data || !res.Data.openid) return
					const openId = res.Data.openid
					uni.setStorageSync('openId', openId)
					this.cleanUrlCode()
					return this.$u.api.wxOpenidLogin({ wenjuan_id: 1001, open_id: openId })
				}).then(loginRes => {
					if (loginRes && loginRes.code === 0 && loginRes.Data && loginRes.Data.user_name && loginRes.Data.user_phone) {
						uni.setStorageSync('isRegistered', true)
						uni.setStorageSync('userId', loginRes.Data.user_id || loginRes.Data.uesr_id)
						uni.setStorageSync('userName', loginRes.Data.user_name)
						uni.setStorageSync('userPhone', loginRes.Data.user_phone)
					} else if (loginRes && !loginRes.Data) {
						uni.setStorageSync('isRegistered', false)
					}
				}).catch(err => {
					console.error('请求失败', err)
				})
			}
		}
	}
</script>

<style>
	page{
		background-color: #7CC6EB;
	}

	.blocked-mask {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		background-color: #7CC6EB;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.blocked-tip {
		font-size: 36rpx;
		font-weight: 600;
		color: #fff;
	}

	.blocked-sub {
		font-size: 26rpx;
		color: rgba(255, 255, 255, 0.85);
		margin-top: 16rpx;
	}

	.side-tab {
		position: absolute;
		right: 0;
		width: 160rpx;
		height: 60rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 30rpx 0 0 30rpx;
		background: linear-gradient(135deg, #FD5401, #FF8A3D);
		color: #fff;
		font-size: 24rpx;
		font-weight: 600;
		letter-spacing: 2rpx;
		border-left: 6rpx solid rgba(255, 255, 255, 0.65);
		box-shadow: 0 6rpx 16rpx rgba(253, 84, 1, 0.35);
	}

	.side-tab-hover {
		opacity: 0.85;
	}
</style>