ufutx_official_website/src/App.vue
2026-03-03 15:50:38 +08:00

90 lines
2.8 KiB
Vue

<script setup>
import Header from '@/components/pc/Header.vue'
import mobileHeader from '@/components/mobile/Header.vue'
import Footer from '@/components/pc/Footer.vue'
import mobileFooter from '@/components/mobile/Footer.vue'
import GoTop from '@/components/pc/GoTop.vue'
import contactTheCustomerS from '@/components/pc/contactTheCustomerS.vue'
import {useRouter} from "vue-router";
import { onMounted, onUnmounted, ref } from 'vue'
const router = useRouter()
const fuliterTop = [
'/examHome',
'/examDetail',
'/examGuide',
'/examHomeReport',
'/onlineTest',
'/reportCard',
'/examPdf',
'/examCheckCertificate',
]
let small_width = ref(true)
let realityWidth = ref(0)
// const isMobile = () => {
// let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i);
// return flag;
// }
const getWidth =() => {
realityWidth.value = document.documentElement.clientWidth
if ( realityWidth.value< 750){
small_width.value = true
}else {
small_width.value = false
console.log(router.currentRoute.value,'==')
if (router.currentRoute.value.fullPath != '/'){
console.log(router.currentRoute.value.path,'==')
console.log(fuliterTop.includes(router.currentRoute.value.path),'ggg--')
if (fuliterTop.includes(router.currentRoute.value.path)){
}else {
console.log('222')
location.href = 'https://www.ufutx.com/web/#/'
}
}else {
setTimeout(() => {
getWidth()
},100)
// location.href = 'https://www.ufutx.com/web/#/'
}
}
}
onMounted(() => {
window.addEventListener('resize', getWidth)
getWidth()
})
onUnmounted(() => {
window.removeEventListener('resize', getWidth)
})
</script>
<template>
<div v-if="router.currentRoute.value.fullPath != '/'">
<div v-if="fuliterTop.includes(router.currentRoute.value.path)">
<router-view></router-view>
</div>
<div v-else>
<Header v-if='!small_width' :key="router.currentRoute.value.fullPath"></Header>
<mobileHeader v-else :key="router.currentRoute.value.path"></mobileHeader>
<!-- 路由出口 :key="router.currentRoute.value.fullPath"-->
<!-- 路由匹配到的组件将渲染在这里 -->
<router-view></router-view>
<Footer v-if='!small_width'></Footer>
<mobileFooter v-else ></mobileFooter>
<GoTop v-if='!small_width'></GoTop>
<contactTheCustomerS v-if='!small_width'></contactTheCustomerS>
</div>
</div>
</template>
<style scoped>
#app {
position: relative;
font-family: Source Han Sans CN-Normal, Source Han Sans CN;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/*text-align: center;*/
/*color: #2c3e50;*/
}
</style>