index.js
2.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
import pageInit from "../../../minixs/pageInit.js";
import {Information} from "../../../../assets/img/data/serviceSecond.js";
export default {
name: 'information',
template: '',
mixins:[pageInit],
components: {},
props: [],
setup(props, {attrs, slots, emit}) {
let InformationData=Information();
//页签高亮显示
let tabActive=Vue.ref(0);
//优势hover显示的图片
let advantageImg=Vue.ref();
let setAdvantage=()=>{
if(InformationData.data && InformationData.data.length>0){
InformationData.data.map(item=>{
if(item.type=='advantage'){
advantageImg.value=item.dataSecond[0].img
}
})
}
}
setAdvantage();
//优势hover高亮显示
let advantageActive=Vue.ref(0);
//优势是否hover
let isMouseover=Vue.ref(false);
//优势鼠标移入事件
let showHover=(indexA)=>{
advantageActive.value=indexA;
isMouseover.value=true;
if(InformationData.data && InformationData.data.length>0){
InformationData.data.map(item=>{
if(item.type=='advantage'){
advantageImg.value=item.dataSecond[indexA].img
}
})
}
}
//优势鼠标移出事件
let hideHover=()=>{
advantageActive.value=0;
isMouseover.value=false;
setAdvantage();
}
//页签点击跳转到对应的目标
let goItemType=(type)=>{
let top=$("[data-type='"+type+"']").offset().top;
let total=top-100;
let distance = document.documentElement.scrollTop || document.body.scrollTop
//计算每一小段的距离
let step=total/6;
(function smoothDown (){
if(distance < total){
distance += step;
//移动一小段
document.body.scrollTop =distance;
document.documentElement.scrollTop = distance;
//设定每一次跳到的时间间隔为10ms
setTimeout(smoothDown,10)
}else{
//限制股东停止的距离
document.body.scrollTop = total;
document.documentElement.scrollTop = total;
}
})()
}
// 挂载完
Vue.onMounted(() => {
})
return {
InformationData,
tabActive,
advantageImg,
advantageActive,
isMouseover,
showHover,
hideHover,
setAdvantage,
goItemType
}
}
}