|
|
@@ -15,19 +15,10 @@ import { ref, onMounted, onUnmounted, watch } from 'vue'
|
|
|
import { useRoute } from 'vue-router'
|
|
|
|
|
|
const route = useRoute()
|
|
|
-const showLandscapeHint = ref(false) // 修改默认值为false
|
|
|
+const showLandscapeHint = ref(false)
|
|
|
const countdown = ref(3) // 倒计时初始值
|
|
|
let countdownTimer = null
|
|
|
-
|
|
|
-// 从本地存储获取是否已经显示过提示的状态
|
|
|
-const getHasShownHint = () => {
|
|
|
- return localStorage.getItem('landscapeHintShown') === 'true'
|
|
|
-}
|
|
|
-
|
|
|
-// 设置已显示提示的状态到本地存储
|
|
|
-const setHasShownHint = (shown) => {
|
|
|
- localStorage.setItem('landscapeHintShown', shown.toString())
|
|
|
-}
|
|
|
+let hasShownOnce = false // 用于跟踪当前会话中是否已经显示过提示
|
|
|
|
|
|
// 检测是否为移动设备
|
|
|
const isMobileDevice = () => {
|
|
|
@@ -40,19 +31,19 @@ const isLandscape = () => {
|
|
|
return window.innerWidth > window.innerHeight
|
|
|
}
|
|
|
|
|
|
-// 检查当前路由是否为父母课堂页面或AI通用课程页面
|
|
|
-const isNewCoursePage = () => {
|
|
|
+// 检查当前路由是否为排除页面
|
|
|
+const isExcludedRoute = () => {
|
|
|
return route.path.includes('/parent-mobile-course') ||
|
|
|
route.path.includes('/parent-mobile-course-detail') ||
|
|
|
- route.path.includes('/login') ||
|
|
|
- route.path.includes('/ai-develop') ||
|
|
|
+ route.path.includes('/login') ||
|
|
|
+ route.path.includes('/ai-develop') ||
|
|
|
route.path.includes('/ai-general-course')
|
|
|
}
|
|
|
|
|
|
// 关闭横屏提示
|
|
|
const closeLandscapeHint = () => {
|
|
|
showLandscapeHint.value = false
|
|
|
- setHasShownHint(true) // 设置标记,表示已经显示过提示
|
|
|
+ hasShownOnce = true // 标记本次会话中已显示过提示
|
|
|
// 清理倒计时定时器
|
|
|
if (countdownTimer) {
|
|
|
clearInterval(countdownTimer)
|
|
|
@@ -81,16 +72,14 @@ const startCountdown = () => {
|
|
|
|
|
|
// 检查是否应该显示横屏提示
|
|
|
const checkLandscapeHint = () => {
|
|
|
- // 对于新课程页面,始终不显示横屏提示
|
|
|
- if (isNewCoursePage()) {
|
|
|
+ // 对于排除的路由,始终不显示横屏提示
|
|
|
+ if (isExcludedRoute()) {
|
|
|
showLandscapeHint.value = false
|
|
|
- setHasShownHint(true) // 标记为已显示,避免后续显示
|
|
|
return
|
|
|
}
|
|
|
|
|
|
- const hasShown = getHasShownHint()
|
|
|
- if (!hasShown && isMobileDevice() && !isLandscape() && !isNewCoursePage()) {
|
|
|
- // 如果是移动设备、竖屏、不是新课程页面,且尚未显示过提示,则显示横屏提示
|
|
|
+ if (isMobileDevice() && !isLandscape() && !isExcludedRoute() && !hasShownOnce) {
|
|
|
+ // 如果是移动设备、竖屏、不在排除路由中,且本次会话中未显示过提示,则显示横屏提示
|
|
|
showLandscapeHint.value = true
|
|
|
// 开始倒计时
|
|
|
startCountdown()
|
|
|
@@ -103,9 +92,8 @@ const handleResize = () => {
|
|
|
if (isLandscape()) {
|
|
|
closeLandscapeHint()
|
|
|
} else {
|
|
|
- // 如果变为竖屏,且不在新课程页面,则检查是否显示提示
|
|
|
- const hasShown = getHasShownHint()
|
|
|
- if (!isNewCoursePage() && isMobileDevice() && !hasShown) {
|
|
|
+ // 如果变为竖屏,且不在排除路由中,且本次会话中未显示过提示,则检查是否显示提示
|
|
|
+ if (!isExcludedRoute() && isMobileDevice() && !hasShownOnce) {
|
|
|
showLandscapeHint.value = true
|
|
|
startCountdown()
|
|
|
}
|
|
|
@@ -114,10 +102,9 @@ const handleResize = () => {
|
|
|
|
|
|
// 监听路由变化
|
|
|
watch(() => route.path, (newPath, oldPath) => {
|
|
|
- // 如果进入新课程页面,立即关闭提示
|
|
|
- if (isNewCoursePage()) {
|
|
|
+ // 如果进入排除路由,立即关闭提示
|
|
|
+ if (isExcludedRoute()) {
|
|
|
showLandscapeHint.value = false
|
|
|
- setHasShownHint(true)
|
|
|
// 清理可能存在的倒计时
|
|
|
if (countdownTimer) {
|
|
|
clearInterval(countdownTimer)
|