修改了首页飘窗，取消了控制台打印的数据
This commit is contained in:
zhangyong
parent
c82842f2ca
commit
c1d46bb3ca
19
package-lock.json
generated
19
package-lock.json
generated
@ -18,7 +18,7 @@
|
||||
"layer-src": "^3.5.1",
|
||||
"vue": "^3.3.11",
|
||||
"vue-amazing-ui": "^0.1.38",
|
||||
"vue-router": "^4.2.5",
|
||||
"vue-router": "^4.4.2",
|
||||
"vue-scrollto": "^2.20.0",
|
||||
"vue3-layer": "^1.0.18",
|
||||
"vuex": "^4.0.2"
|
||||
@ -855,9 +855,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@vue/devtools-api": {
|
||||
"version": "6.5.1",
|
||||
"resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.5.1.tgz",
|
||||
"integrity": "sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA=="
|
||||
"version": "6.6.3",
|
||||
"resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.6.3.tgz",
|
||||
"integrity": "sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw=="
|
||||
},
|
||||
"node_modules/@vue/reactivity": {
|
||||
"version": "3.4.27",
|
||||
@ -2622,11 +2622,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/vue-router": {
|
||||
"version": "4.3.2",
|
||||
"resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.3.2.tgz",
|
||||
"integrity": "sha512-hKQJ1vDAZ5LVkKEnHhmm1f9pMiWIBNGF5AwU67PdH7TyXCj/a4hTccuUuYCAMgJK6rO/NVYtQIEN3yL8CECa7Q==",
|
||||
"version": "4.4.2",
|
||||
"resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.4.2.tgz",
|
||||
"integrity": "sha512-1qNybkn2L7QsLzaXs8nvlQmRKp8XF8DCxZys/Jr1JpQcHsKUxTKzTxCVA1G7NfBfwRIBgCJPoujOG5lHCCNUxw==",
|
||||
"dependencies": {
|
||||
"@vue/devtools-api": "^6.5.1"
|
||||
"@vue/devtools-api": "^6.6.3"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/posva"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "^3.2.0"
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
"layer-src": "^3.5.1",
|
||||
"vue": "^3.3.11",
|
||||
"vue-amazing-ui": "^0.1.38",
|
||||
"vue-router": "^4.2.5",
|
||||
"vue-router": "^4.4.2",
|
||||
"vue-scrollto": "^2.20.0",
|
||||
"vue3-layer": "^1.0.18",
|
||||
"vuex": "^4.0.2"
|
||||
|
||||
43
src/App.vue
43
src/App.vue
@ -4,7 +4,7 @@
|
||||
<HeaderNav></HeaderNav>
|
||||
|
||||
<!-- <router-view :class="{ active: isActiveRoute }"></router-view> -->
|
||||
|
||||
<!-- <router-view></router-view> -->
|
||||
<!-- 尾部版权 -->
|
||||
<Footer></Footer>
|
||||
|
||||
@ -32,6 +32,47 @@ export default {
|
||||
|
||||
},
|
||||
|
||||
// watch: {
|
||||
// // 监听路由变化
|
||||
// $route(to, from) {
|
||||
// if (to.name === 'Home' && from.name === 'Home') {
|
||||
// // 如果从首页路由离开并再次返回，重置飘窗状态
|
||||
// this.sportStatus = false;
|
||||
// this.floatWindowKey = 0;
|
||||
// this.clearFloatWindowTimer(); // 清除飘窗的定时器
|
||||
// this.resetFloatWindowPosition(); // 重置飘窗位置
|
||||
// console.log(22);
|
||||
// } else if (to.name === 'Home') {
|
||||
// // 如果第一次进入首页路由，启动飘窗
|
||||
// this.sportStatus = true;
|
||||
// this.floatWindowKey++; // 增加 key 值以强制重新渲染
|
||||
// console.log(11);
|
||||
// this.resetFloatWindowPosition(); // 重置飘窗位置
|
||||
// this.startFloatWindowTimer(); // 启动飘窗移动的定时器
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
|
||||
// data() {
|
||||
// return {
|
||||
// shouldReloadHome: false // 标志，用于判断是否需要刷新首页
|
||||
// };
|
||||
// },
|
||||
// methods: {
|
||||
// handleRefreshHome() {
|
||||
// this.shouldReloadHome = true; // 设置刷新标志
|
||||
// }
|
||||
// },
|
||||
// watch: {
|
||||
// $route(to, from) {
|
||||
// // 当路由跳转到首页且设置了刷新标志时，刷新页面
|
||||
// if (to.path === '/' && this.shouldReloadHome) {
|
||||
// window.location.reload(); // 刷新页面
|
||||
// this.shouldReloadHome = false; // 重置刷新标志
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -3,7 +3,8 @@
|
||||
<div class="box">
|
||||
<div class="box-top">
|
||||
<div class="box-left-logo">
|
||||
<a href="#">
|
||||
<!-- <a href="#"> -->
|
||||
<a href="https://www.aimzhu.com">
|
||||
<img src="/assets/img/footerlogo1.png" alt="">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -2,14 +2,16 @@
|
||||
|
||||
<div id="nav" class="header-nav" :class="{ 'fixed-nav': isFixed }">
|
||||
<div class="box">
|
||||
<a href="#" @click="gotoHomePage">
|
||||
<a href="https://www.aimzhu.com" @click="gotoHomePage">
|
||||
<img :src="logoSrc" alt="首页logo">
|
||||
<!-- <img src="/assets/img/headicon1.png" alt=""> -->
|
||||
</a>
|
||||
<!-- <router-link to="/HomePage" @click="gotoHomePage">
|
||||
<img :src="logoSrc" alt="首页logo">
|
||||
</router-link> -->
|
||||
<div class="nav router-container" :class="routerColor">
|
||||
<ul>
|
||||
|
||||
<li><router-link to="/HomePage" @click="activateHomePage" :class="{ activeHomePage: $route.path === '/HomePage' }">首页</router-link></li>
|
||||
<li><router-link to="/HomePage" replace @click="activateHomePage" :class="{ activeHomePage: $route.path === '/HomePage' }">首页</router-link></li>
|
||||
<li><router-link to="/ShouFei" @click="activate" :class="{ active: $route.path === '/ShouFei' }">收费介绍</router-link></li>
|
||||
<li><router-link to="/KeFu" @click="activate" :class="{ active: $route.path === '/KeFu' }">客服中心</router-link></li>
|
||||
<li><router-link to="/ZhengShu" @click="activate" :class="{ active: $route.path === '/ZhengShu' }">证书展示</router-link></li>
|
||||
@ -25,9 +27,6 @@
|
||||
<a id="register" href="https://www.aimzhu.com/Register.html">免费注册</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
@ -38,6 +37,7 @@ export default {
|
||||
// logoSrc: '/src/assets/img/headicon1.png',
|
||||
logoSrc: '/assets/img/headicon1.png',
|
||||
isFixed: false,
|
||||
shouldReloadHomePage: false, // 添加标志，用于判断是否需要刷新首页
|
||||
// isHomePage: true, // 用于跟踪是否在首页
|
||||
// logoSrc: import('/assets/img/headicon1.png'), // 默认的logo图片
|
||||
}
|
||||
@ -46,11 +46,22 @@ export default {
|
||||
methods:{
|
||||
gotoHomePage() {
|
||||
this.$router.push('/HomePage');
|
||||
// window.location.reload(); // 刷新页面
|
||||
|
||||
},
|
||||
activateHomePage() {
|
||||
this.isFixed = false; // 重置为默认样式
|
||||
this.logoSrc = '/assets/img/headicon1.png';
|
||||
// his.shouldReloadHomePage = true; // 设置刷新标志
|
||||
// 如果当前不是在首页，则设置标志以刷新
|
||||
// if (this.$route.path !== '/HomePage') {
|
||||
// this.shouldRefreshHome = true; // 设置刷新标志
|
||||
// }
|
||||
},
|
||||
// refreshHomePage() {
|
||||
// window.location.href = window.location.href
|
||||
// alert(11)
|
||||
// },
|
||||
activate() {
|
||||
this.isFixed = true; // 激活固定样式
|
||||
this.logoSrc = '/assets/img/headicon2.png';
|
||||
@ -82,10 +93,22 @@ export default {
|
||||
$route(to, from) {
|
||||
if (to.path !== '/HomePage') {
|
||||
this.activate(); // 点击非首页路由时激活固定样式
|
||||
|
||||
} else {
|
||||
this.activateHomePage(); // 点击首页路由时重置为默认样式
|
||||
|
||||
}
|
||||
},
|
||||
// $route(to, from) {
|
||||
// // 当路由跳转到首页且设置了刷新标志时，刷新页面
|
||||
// if (to.path === '/HomePage' && this.shouldRefreshHome) {
|
||||
// this.activateHomePage(); // 点击首页路由时重置为默认样式
|
||||
// window.location.reload(); // 刷新页面
|
||||
// this.shouldRefreshHome = false; // 重置刷新标志
|
||||
// } else {
|
||||
// this.activate(); // 点击非首页路由时激活固定样式
|
||||
// }
|
||||
// }
|
||||
|
||||
},
|
||||
|
||||
|
||||
@ -1,17 +1,13 @@
|
||||
<template>
|
||||
<div class="home-page">
|
||||
<!-- 飘窗 -->
|
||||
<div class="pcdiv">
|
||||
<div id="sport_wrap" v-if="sportStatus" :key="floatWindowKey" @mouseover="mouseOver" @mouseleave="mouseLeave">
|
||||
<div class="deleteImg" @click="showSport" >
|
||||
<img class="close" src="/assets/img/close.png" alt="">
|
||||
</div>
|
||||
<img :src="floatImg" @click="windowSkip" alt="">
|
||||
<div id="sport_wrap" v-if="sportStatus" class="float-window" :style="{left: `${floatWindow.left}px`, top: `${floatWindow.top}px`}" @mouseover="mouseOver" @mouseleave="mouseLeave">
|
||||
<div class="deleteImg" @click="showSport">
|
||||
<img class="close" src="/assets/img/close.png" alt="">
|
||||
</div>
|
||||
<img :src="floatImg" @click="windowSkip" alt="">
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="box-top">
|
||||
<div class="headline">
|
||||
<h2>不止</h2>
|
||||
@ -169,6 +165,8 @@
|
||||
|
||||
<script>
|
||||
// import { onMounted, onUnmounted, ref } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { onBeforeRouteUpdate, onBeforeRouteLeave } from 'vue-router';
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
data() {
|
||||
@ -220,26 +218,39 @@ export default {
|
||||
timer: null,
|
||||
|
||||
floatWindowKey: 0, // 添加一个key来强制重新渲染
|
||||
|
||||
floatWindow: {
|
||||
left: 0,
|
||||
top: 0,
|
||||
direction: {
|
||||
top: 1,
|
||||
left: 1
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.sportStatus = true
|
||||
this.timer = setInterval(()=>{
|
||||
this.sportTranstion()
|
||||
}, 30);
|
||||
this.startFloatWindowTimer();
|
||||
// created() {
|
||||
// this.sportStatus = true
|
||||
// // this.timer = setInterval(()=>{
|
||||
// // this.sportTranstion()
|
||||
// // }, 30);
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.sportStatus = false
|
||||
// this.startFloatWindowTimer()
|
||||
// // this.refreshPage();
|
||||
// },
|
||||
// beforeDestroy() {
|
||||
// this.clearFloatWindowTimer();
|
||||
// console.log(222);
|
||||
// this.sportStatus = false
|
||||
// clearInterval(this.timer)
|
||||
this.clearFloatWindowTimer();
|
||||
},
|
||||
|
||||
// },
|
||||
|
||||
|
||||
methods: {
|
||||
refreshPage() {
|
||||
location. reload(); // 刷新页面
|
||||
},
|
||||
|
||||
selectStep1(index) {
|
||||
this.currentStepIndex1 = index; // 设置当前选中的步骤索引
|
||||
@ -288,119 +299,6 @@ export default {
|
||||
this.number2 = response.data.data[1]
|
||||
})
|
||||
},
|
||||
|
||||
// 飘窗所需图片内容
|
||||
floatContent() {
|
||||
let img = document.getElementById("sport_wrap");
|
||||
axios.get('https://www.aimzhu.com/operator/app/content/listByIdentifyingrelease/bayWindow').then(response => {
|
||||
console.log(response.data);
|
||||
if (response.data.length != 0) {
|
||||
const imgFolat = response.data[0].photo
|
||||
this.floatImg = `https://www.aimzhu.com/operator/route/file/download/true/${imgFolat}`
|
||||
} else {
|
||||
img.style.display = 'none'
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('There was an error!', error)
|
||||
})
|
||||
},
|
||||
// 飘窗
|
||||
sportTranstion(){
|
||||
let img = document.getElementById("sport_wrap"); //获得图片所在层的ID
|
||||
let height = document.documentElement.clientHeight; //浏览器的高度
|
||||
let width = document.documentElement.clientWidth; //浏览器的宽度
|
||||
let imgHeight = img.offsetHeight; //飘浮图片的高度
|
||||
let imgWidth = img.offsetWidth; //瓢浮图片的宽度
|
||||
//设置飘浮图片距离浏览器左侧位置
|
||||
img.style.left = parseInt(this.moveX + document.documentElement.scrollLeft) + "px";
|
||||
//设置飘浮图片距离浏览器右侧位置
|
||||
img.style.top = parseInt(this.moveY + document.documentElement.scrollTop) + "px";
|
||||
//设置图片在Y轴上的移动规律
|
||||
if(this.directionY == 0) {
|
||||
//飘浮图片在Y轴方向上向下移动
|
||||
this.moveY += this.stepY;
|
||||
} else {
|
||||
//飘浮图片在Y轴方向上向上移动
|
||||
this.moveY -= this.stepY;
|
||||
}
|
||||
if(this.moveY < 0) {
|
||||
//如果飘浮图片飘浮到顶端的时候，设置图片在Y轴方向上向下移动
|
||||
this.directionY = 0;
|
||||
this.moveY = 0;
|
||||
}
|
||||
if(this.moveY > (height - imgHeight-10)) {
|
||||
//如果飘浮图片飘浮到浏览器底端的时候，设置图片在Y轴方向上向上移动
|
||||
this.directionY = 1;
|
||||
this.moveY = (height - imgHeight-10);
|
||||
}
|
||||
//设置图片在X轴上的移动规律
|
||||
if(this.directionX == 0) {
|
||||
this.moveX += this.stepX;
|
||||
} else {
|
||||
this.moveX -= this.stepX;
|
||||
}
|
||||
if(this.moveX < 0) {
|
||||
//如果飘浮图片飘浮到浏览器左侧的时候，设置图片在X轴方向上向右移动
|
||||
this.directionX = 0;
|
||||
this.moveX = 0;
|
||||
}
|
||||
if(this.moveX > (width - imgWidth)) {
|
||||
//如果飘浮图片飘浮到浏览器右侧的时候，设置图片在X轴方向上向左移动
|
||||
this.directionX = 1;
|
||||
this.moveX = (width - imgWidth);
|
||||
}
|
||||
},
|
||||
showSport(){
|
||||
//关闭漂浮窗
|
||||
this.sportStatus = false
|
||||
clearInterval(this.timer)
|
||||
},
|
||||
mouseLeave(){
|
||||
//鼠标移入
|
||||
this.timer = setInterval(()=>{
|
||||
this.sportTranstion()
|
||||
},30);
|
||||
|
||||
this.startFloatWindowTimer();
|
||||
|
||||
},
|
||||
mouseOver(){
|
||||
//鼠标移出
|
||||
clearInterval(this.timer)
|
||||
|
||||
this.clearFloatWindowTimer();
|
||||
|
||||
},
|
||||
// 飘窗跳转
|
||||
windowSkip() {
|
||||
window.open('https://www.aimzhu.com/floatPage.html');
|
||||
},
|
||||
|
||||
// 启动飘窗移动的定时器
|
||||
startFloatWindowTimer() {
|
||||
if (!this.timer) {
|
||||
this.resetFloatWindowPosition(); // 重置飘窗位置
|
||||
this.timer = setInterval(() => {
|
||||
this.sportTranstion();
|
||||
}, 30);
|
||||
}
|
||||
},
|
||||
|
||||
// 清除飘窗的定时器
|
||||
clearFloatWindowTimer() {
|
||||
if (this.timer) {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
},
|
||||
|
||||
// 重置飘窗位置
|
||||
resetFloatWindowPosition() {
|
||||
this.moveX = 0;
|
||||
this.moveY = 0;
|
||||
},
|
||||
|
||||
startScroll() {
|
||||
this.intervalId = setInterval(() => {
|
||||
this.currentTitleIndex = (this.currentTitleIndex + 1) % this.titles.length;
|
||||
@ -412,101 +310,71 @@ export default {
|
||||
}
|
||||
}, 3000);
|
||||
},
|
||||
// resetTransition() {
|
||||
// // 移除过渡效果，然后立即重新添加，以避免动画
|
||||
// const titleContainer = document.getElementById('title-container');
|
||||
// titleContainer.style.transition = 'none';
|
||||
// titleContainer.offsetHeight; // 触发重排
|
||||
// titleContainer.style.transition = 'transform 0.5s ease-in-out';
|
||||
// },
|
||||
stopScroll() {
|
||||
clearInterval(this.intervalId);
|
||||
},
|
||||
// 飘窗所需图片内容
|
||||
floatContent() {
|
||||
axios.get('https://www.aimzhu.com/operator/app/content/listByIdentifyingrelease/bayWindow').then(response => {
|
||||
// console.log(response.data);
|
||||
if (response.data.length != 0) {
|
||||
const imgFolat = response.data[0].photo
|
||||
this.floatImg = `https://www.aimzhu.com/operator/route/file/download/true/${imgFolat}`
|
||||
} else {
|
||||
this.sportStatus = false
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('There was an error!', error)
|
||||
})
|
||||
},
|
||||
// 飘窗移动
|
||||
floatWindowMove() {
|
||||
let self = this;
|
||||
let winWidth = window.innerWidth;
|
||||
let winHeight = window.innerHeight;
|
||||
this.timer = setInterval(() => {
|
||||
if(self.floatWindow.top + 100 >= winHeight) {
|
||||
self.floatWindow.direction.top = -1;
|
||||
} else if(self.floatWindow.top <= 0) {
|
||||
self.floatWindow.direction.top = 1;
|
||||
}
|
||||
|
||||
if(self.floatWindow.left + 100 >= winWidth) {
|
||||
self.floatWindow.direction.left = -1;
|
||||
} else if(self.floatWindow.left <= 0) {
|
||||
self.floatWindow.direction.left = 1;
|
||||
}
|
||||
self.floatWindow.top += self.floatWindow.direction.top * 2;
|
||||
self.floatWindow.left += self.floatWindow.direction.left * 2;
|
||||
}, 20);
|
||||
},
|
||||
showSport(){
|
||||
//关闭漂浮窗
|
||||
this.sportStatus = false
|
||||
// clearInterval(this.timer)
|
||||
},
|
||||
// 鼠标移入
|
||||
mouseOver(){
|
||||
clearInterval(this.timer); // 清除定时器
|
||||
},
|
||||
// 鼠标移出
|
||||
mouseLeave(){
|
||||
this.floatWindowMove();
|
||||
},
|
||||
// 飘窗跳转
|
||||
windowSkip() {
|
||||
window.open('https://www.aimzhu.com/floatPage.html');
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
// -----------------------------------------
|
||||
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
if (to.name === 'Home') {
|
||||
vm.sportStatus = true;
|
||||
vm.floatWindowKey++; // 增加 key 值以强制重新渲染
|
||||
vm.$nextTick(() => {
|
||||
vm.resetFloatWindowPosition(); // 重置飘窗位置
|
||||
vm.startFloatWindowTimer(); // 启动飘窗移动的定时器
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
beforeRouteUpdate(to, from, next) {
|
||||
if (to.name === 'Home') {
|
||||
this.sportStatus = true;
|
||||
this.floatWindowKey++;
|
||||
this.resetFloatWindowPosition(); // 重置飘窗位置
|
||||
this.startFloatWindowTimer(); // 启动飘窗移动的定时器
|
||||
} else {
|
||||
this.sportStatus = false;
|
||||
this.clearFloatWindowTimer(); // 清除飘窗的定时器
|
||||
}
|
||||
next();
|
||||
},
|
||||
beforeRouteLeave(to, from, next) {
|
||||
if (from.name === 'Home') {
|
||||
this.sportStatus = false;
|
||||
this.clearFloatWindowTimer(); // 清除飘窗的定时器
|
||||
}
|
||||
next();
|
||||
},
|
||||
// beforeDestroy() {
|
||||
// this.clearFloatWindowTimer();
|
||||
// this.sportStatus = false;
|
||||
// // 如果需要，可以手动清理DOM
|
||||
// if (this.$el && this.$el.parentNode) {
|
||||
// this.$el.parentNode.removeChild(this.$el);
|
||||
// }
|
||||
// },
|
||||
|
||||
// // 路由守卫
|
||||
// beforeRouteEnter(to, from, next) {
|
||||
// next(vm => {
|
||||
// if (to.name === 'Home') {
|
||||
// vm.sportStatus = true;
|
||||
// vm.startFloatWindowTimer();
|
||||
// }
|
||||
// });
|
||||
// },
|
||||
// beforeRouteLeave(to, from, next) {
|
||||
// if (from.name === 'Home') {
|
||||
// this.sportStatus = false;
|
||||
// this.clearFloatWindowTimer();
|
||||
// }
|
||||
// next();
|
||||
// },
|
||||
// beforeRouteUpdate(to, from, next) {
|
||||
// if (to.name === 'Home') {
|
||||
// vm.sportStatus = true;
|
||||
// this.startFloatWindowTimer();
|
||||
// } else {
|
||||
// this.sportStatus = false;
|
||||
// this.clearFloatWindowTimer();
|
||||
// }
|
||||
// next();
|
||||
// },
|
||||
|
||||
|
||||
// -----------------------------------------
|
||||
|
||||
computed: {
|
||||
|
||||
titleContainerStyle() {
|
||||
return {
|
||||
transform: `translateY(-${this.currentTitleIndex * 100}%)`,
|
||||
transition: 'transform 0.5s ease-in-out',
|
||||
};
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
|
||||
mounted() {
|
||||
@ -519,16 +387,20 @@ export default {
|
||||
this.twoData = Response.data
|
||||
}).catch(error => {
|
||||
console.error('Error fetching data:', error)
|
||||
})
|
||||
|
||||
});
|
||||
this.sportStatus = true
|
||||
// this.startFloatWindowTimer()
|
||||
this.floatWindowMove();
|
||||
},
|
||||
|
||||
|
||||
// beforeUnmount() {
|
||||
// clearInterval(this.intervalId);
|
||||
// },
|
||||
beforeDestroy() {
|
||||
this.stopScroll();
|
||||
// this.startData();
|
||||
clearInterval(this.timer); // 清除定时器
|
||||
}
|
||||
|
||||
}
|
||||
@ -652,12 +524,12 @@ export default {
|
||||
height: 100vw;
|
||||
}
|
||||
.home-page #sport_wrap {
|
||||
position: absolute;
|
||||
display: block;
|
||||
/* position: absolute;
|
||||
display: block; */
|
||||
/* display: none; */
|
||||
z-index: 99999999999;
|
||||
/* z-index: 99999999999;
|
||||
width:150px;
|
||||
height:150px;
|
||||
height:150px; */
|
||||
/* line-height: 70px; */
|
||||
cursor: pointer;
|
||||
/* border: 1px solid red; */
|
||||
@ -1074,4 +946,12 @@ export default {
|
||||
margin: 10px 10px 10px auto;
|
||||
/* border: 2px solid red; */
|
||||
}
|
||||
|
||||
.float-window {
|
||||
position: fixed;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
/* background-color: black; */
|
||||
z-index: 99999999;
|
||||
}
|
||||
</style>
|
||||
@ -56,6 +56,13 @@ router.afterEach(() => {
|
||||
router.beforeEach((to, from, next) => {
|
||||
next()
|
||||
})
|
||||
// router.beforeEach((to, from, next) => {
|
||||
// if (to.path === '/') {
|
||||
// window.location.reload(); // 刷新页面
|
||||
// } else {
|
||||
// next();
|
||||
// }
|
||||
// })
|
||||
|
||||
// 创建的路由对象共享出去
|
||||
export default router
|
||||
|
||||
@ -20,6 +20,9 @@ import * as ElementPlusIconsVue from '@element-plus/icons-vue'
|
||||
import VueScrollTo from 'vue-scrollto'
|
||||
import 'vue3-layer/dist/s3Layer.css'
|
||||
|
||||
// import VueRouter from 'vue-router'
|
||||
// const { createRouter, createWebHistory } = VueRouter
|
||||
|
||||
// import VueAmazingUI from 'vue-amazing-ui'
|
||||
// import 'vue-amazing-ui/css'
|
||||
|
||||
@ -40,6 +43,8 @@ app.use(router)
|
||||
app.use(VueScrollTo)
|
||||
// app.use(VueAmazingUI)
|
||||
|
||||
// app.use(VueRouter)
|
||||
|
||||
app.mount('#app')
|
||||
|
||||
// createApp(App).mount('#app')
|
||||
|
||||
Loading…
Reference in New Issue
Block a user