|
|
|
|
@ -79,16 +79,27 @@ |
|
|
|
|
<h6 class="i-title">我们的产品</h6> |
|
|
|
|
<p class="en">OUR PRODUCTS</p> |
|
|
|
|
<div class="pics"> |
|
|
|
|
<div class="pro-bg2"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-5.png" alt="" class="bg1 wow fadeInDown" data-wow-delay="0.6s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-1.png" alt="" class="bg2 wow fadeInDown" data-wow-delay="0.7s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-4.png" alt="" class="bg3 wow fadeInDown" data-wow-delay="0.2s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-2.png" alt="" class="bg4 wow fadeInDown" data-wow-delay="0.5s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-3.png" alt="" class="bg5 wow fadeInDown" data-wow-delay="0.5s"> |
|
|
|
|
<div class="pro-bg1"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg1-1.png" alt="" class="bg1 wow fadeInDown" data-wow-delay="0.6s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg1-2.png" alt="" class="bg2 wow fadeInDown" data-wow-delay="0.7s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg1-3.png" alt="" class="bg3 wow fadeInDown" data-wow-delay="0.2s"> |
|
|
|
|
<el-carousel class="carousel" ref="carousel" height="338px" :autoplay="false" arrow="never"> |
|
|
|
|
<el-carousel-item> |
|
|
|
|
<img src="@/assets/img/index/slide1.png" alt=""> |
|
|
|
|
</el-carousel-item> |
|
|
|
|
<el-carousel-item> |
|
|
|
|
<img src="@/assets/img/index/slide2.png" alt=""> |
|
|
|
|
</el-carousel-item> |
|
|
|
|
<el-carousel-item> |
|
|
|
|
<img src="@/assets/img/index/slide3.png" alt=""> |
|
|
|
|
</el-carousel-item> |
|
|
|
|
</el-carousel> |
|
|
|
|
<div class="arrow a-left" @click="carouselSwitch('carousel', 0)"></div> |
|
|
|
|
<div class="arrow a-right" @click="carouselSwitch('carousel', 1)"></div> |
|
|
|
|
</div> |
|
|
|
|
<div class="text"> |
|
|
|
|
<div class="title-wrap"> |
|
|
|
|
<p class="text-title">沉浸式岗位模拟与实操</p> |
|
|
|
|
<p class="text-title">职站平台</p> |
|
|
|
|
<p class="en">Occupation lab</p> |
|
|
|
|
</div> |
|
|
|
|
<p class="desc wow fadeInLeft" data-wow-delay="0.7s">职站是一款辅助院校教师开展虚拟仿真实验教学的智能云实践平台。平台采用了大数据，云计算等技术，为学校搭建信息化平台提供了基础，可助力院校实现教学智能化升级。职站平台设计遵循着极简、高效的理念，可帮助老师轻松开展实验教学，并支持自定义发布考核和练习，智能统计和检验学生的日常实训练习效果；老师还可以通过可视化图表报告直观查看学生实训成绩，评估教学成果。</p> |
|
|
|
|
@ -122,11 +133,22 @@ |
|
|
|
|
<p class="desc wow fadeInLeft" data-wow-delay="0.7s">数据前瞻——财经数据库，涵盖股票数据，期货数据，债券数据，期权数据，利率数据，公募数据和宏观数据，拥有超40年的历史数据，可为用户解读、预测、分析，模拟市场趋势、经济周期和世界事件影响提供必要的数据支持。平台的数据均来源于各大专业财经权威网站和数据官方发布平台，并经过专业的数据分类和整理，可让用户轻松便捷地搜索并批量下载到自己研究所需的数据，极大地减轻自己搜索整理数据的时间，提高研究效率, 从而高效的输出研究成果。</p> |
|
|
|
|
</div> |
|
|
|
|
<div class="pro-bg2"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-5.png" alt="" class="bg1 wow fadeInDown" data-wow-delay="0.6s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-1.png" alt="" class="bg2 wow fadeInDown" data-wow-delay="0.7s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-4.png" alt="" class="bg3 wow fadeInDown" data-wow-delay="0.2s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-2.png" alt="" class="bg4 wow fadeInDown" data-wow-delay="0.5s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg2-3.png" alt="" class="bg5 wow fadeInDown" data-wow-delay="0.5s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg1-1.png" alt="" class="bg1 wow fadeInDown" data-wow-delay="0.6s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg1-2.png" alt="" class="bg2 wow fadeInDown" data-wow-delay="0.7s"> |
|
|
|
|
<img src="@/assets/img/index/pro-bg1-4.png" alt="" class="bg3 wow fadeInDown" data-wow-delay="0.2s"> |
|
|
|
|
<el-carousel class="carousel" ref="carousel1" height="338px" :autoplay="false" arrow="never"> |
|
|
|
|
<el-carousel-item> |
|
|
|
|
<img src="@/assets/img/index/slide4.png" alt=""> |
|
|
|
|
</el-carousel-item> |
|
|
|
|
<el-carousel-item> |
|
|
|
|
<img src="@/assets/img/index/slide5.png" alt=""> |
|
|
|
|
</el-carousel-item> |
|
|
|
|
<el-carousel-item> |
|
|
|
|
<img src="@/assets/img/index/slide6.png" alt=""> |
|
|
|
|
</el-carousel-item> |
|
|
|
|
</el-carousel> |
|
|
|
|
<div class="arrow a-left" @click="carouselSwitch('carousel1', 0)"></div> |
|
|
|
|
<div class="arrow a-right" @click="carouselSwitch('carousel1', 1)"></div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
@ -164,7 +186,7 @@ |
|
|
|
|
<p class="en">PARTNERSHIP</p> |
|
|
|
|
<p class="brief">助力100+所院校客户实现数字化升级</p> |
|
|
|
|
<div class="client-pic"> |
|
|
|
|
<img class="bg" src="@/assets/img/index/pro-bg4-1.png" alt=""> |
|
|
|
|
<img class="bg" src="@/assets/img/index/index0.png" alt=""> |
|
|
|
|
<div class="text"> |
|
|
|
|
<div class="c-title1"> |
|
|
|
|
<img src="@/assets/img/index/comma1.png" alt=""> |
|
|
|
|
@ -252,19 +274,23 @@ export default { |
|
|
|
|
new WOW().init() |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
toPart(i){ |
|
|
|
|
this.active = i |
|
|
|
|
document.querySelector(`#part${i}`).scrollIntoView() |
|
|
|
|
}, |
|
|
|
|
// 置顶 |
|
|
|
|
topping() { |
|
|
|
|
document.documentElement.scrollTop = 0 |
|
|
|
|
document.body.scrollTop = 0 |
|
|
|
|
}, |
|
|
|
|
// 问卷调查 |
|
|
|
|
toQues() { |
|
|
|
|
window.open('https://www.wjx.cn/vm/wB0RcMm.aspx') |
|
|
|
|
}, |
|
|
|
|
// 轮播图翻页 |
|
|
|
|
carouselSwitch(name, dir) { |
|
|
|
|
dir ? this.$refs[name].next() : this.$refs[name].prev() |
|
|
|
|
}, |
|
|
|
|
toPart(i){ |
|
|
|
|
this.active = i |
|
|
|
|
document.querySelector(`#part${i}`).scrollIntoView() |
|
|
|
|
}, |
|
|
|
|
// 置顶 |
|
|
|
|
topping() { |
|
|
|
|
document.documentElement.scrollTop = 0 |
|
|
|
|
document.body.scrollTop = 0 |
|
|
|
|
}, |
|
|
|
|
// 问卷调查 |
|
|
|
|
toQues() { |
|
|
|
|
window.open('https://www.wjx.cn/vm/wB0RcMm.aspx') |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
@ -278,6 +304,7 @@ export default { |
|
|
|
|
position: relative; |
|
|
|
|
height: 688px; |
|
|
|
|
background: url(../../../assets/img/index/banner-1.png) 0 0/cover no-repeat, |
|
|
|
|
url(../../../assets/img/index/banner-3.png) 0 0/auto no-repeat, |
|
|
|
|
url(../../../assets/img/index/banner-2.png) top right/auto no-repeat; |
|
|
|
|
background-color: #0F5BED; |
|
|
|
|
.text { |
|
|
|
|
@ -371,7 +398,7 @@ export default { |
|
|
|
|
transform: rotateY(180deg) |
|
|
|
|
} |
|
|
|
|
h6 { |
|
|
|
|
margin-top: 40px; |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -389,16 +416,19 @@ export default { |
|
|
|
|
.text{ |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #637493; |
|
|
|
|
transition: .3s; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.service { |
|
|
|
|
position: relative; |
|
|
|
|
background-color: #0653FF; |
|
|
|
|
// background: #fff url(../../../assets/img/index/service.png) 0 0/100% 100% no-repeat; |
|
|
|
|
background: #0653FF url(../../../assets/img/index/service4.png) 0 0/100% 100% no-repeat; |
|
|
|
|
.i-title { |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
.en { |
|
|
|
|
color: #467DF9; |
|
|
|
|
} |
|
|
|
|
.service-pic { |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
@ -443,10 +473,10 @@ export default { |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
img { |
|
|
|
|
transform: rotateY(180deg) |
|
|
|
|
transform: rotateY(180deg) |
|
|
|
|
} |
|
|
|
|
h6 { |
|
|
|
|
margin-top: 40px; |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -501,10 +531,10 @@ export default { |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
img { |
|
|
|
|
transform: rotateY(180deg) |
|
|
|
|
transform: rotateY(180deg); |
|
|
|
|
} |
|
|
|
|
h6 { |
|
|
|
|
margin-top: 40px; |
|
|
|
|
.text { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -522,6 +552,93 @@ export default { |
|
|
|
|
.text{ |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: #757F92; |
|
|
|
|
transition: .3s; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.carousel { |
|
|
|
|
width: 500px; |
|
|
|
|
margin-left: 50px; |
|
|
|
|
} |
|
|
|
|
.arrow { |
|
|
|
|
position: absolute; |
|
|
|
|
top: 157px; |
|
|
|
|
width: 21px; |
|
|
|
|
height: 21px; |
|
|
|
|
background: url(../../../assets/img/index/arrow.png) no-repeat; |
|
|
|
|
cursor: pointer; |
|
|
|
|
&:hover { |
|
|
|
|
background-image: url(../../../assets/img/index/arrow-active.png); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.a-left { |
|
|
|
|
left: 32px; |
|
|
|
|
transform: rotate(180deg); |
|
|
|
|
} |
|
|
|
|
.a-right { |
|
|
|
|
right: 6px; |
|
|
|
|
} |
|
|
|
|
.pro-bg1 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 594px; |
|
|
|
|
height: 365px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 23px; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
bottom: 0; |
|
|
|
|
right: 8px; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 256px; |
|
|
|
|
right: 0; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg1 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
transform: scale(1.3); |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.3); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.pro-bg2 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 594px; |
|
|
|
|
height: 365px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 23px; |
|
|
|
|
right: 0; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
bottom: 0; |
|
|
|
|
left: 8px; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 256px; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg1 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
transform: scale(1.3); |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.3); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -608,231 +725,6 @@ export default { |
|
|
|
|
color: #0B1D30; |
|
|
|
|
line-height: 28px; |
|
|
|
|
} |
|
|
|
|
.pro-bg1 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 578px; |
|
|
|
|
height: 410px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 0; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
top: 24px; |
|
|
|
|
right: 0; |
|
|
|
|
animation: rotate 15s linear infinite; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 15px; |
|
|
|
|
left: 27px; |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
top: 102px; |
|
|
|
|
left: 72px; |
|
|
|
|
} |
|
|
|
|
.bg5 { |
|
|
|
|
top: 102px; |
|
|
|
|
left: 180px; |
|
|
|
|
} |
|
|
|
|
.bg6 { |
|
|
|
|
top: 102px; |
|
|
|
|
left: 288px; |
|
|
|
|
} |
|
|
|
|
.bg7 { |
|
|
|
|
top: 55px; |
|
|
|
|
right: 9px; |
|
|
|
|
} |
|
|
|
|
.bg8 { |
|
|
|
|
top: 181px; |
|
|
|
|
left: 14px; |
|
|
|
|
} |
|
|
|
|
.bg9 { |
|
|
|
|
top: 195px; |
|
|
|
|
left: 180px; |
|
|
|
|
} |
|
|
|
|
.bg10 { |
|
|
|
|
top: 181px; |
|
|
|
|
right: 142px; |
|
|
|
|
} |
|
|
|
|
.bg11 { |
|
|
|
|
top: 189px; |
|
|
|
|
right: 34px; |
|
|
|
|
} |
|
|
|
|
.bg12 { |
|
|
|
|
bottom: 45px; |
|
|
|
|
left: 180px; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg4, .bg5, .bg6, .bg7, .bg8, .bg9, .bg10, .bg11, .bg12 { |
|
|
|
|
transform: translateY(-10px); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.pro-bg2 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 674px; |
|
|
|
|
height: 360px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 0; |
|
|
|
|
left: 68px; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
top: 24px; |
|
|
|
|
left: 97px; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 94px; |
|
|
|
|
left: 139px; |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
top: 58px; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg5 { |
|
|
|
|
top: 64px; |
|
|
|
|
right: 0; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg2 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.3); |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
transform: translate(-135px, -10px); |
|
|
|
|
} |
|
|
|
|
.bg5 { |
|
|
|
|
transform: translate(50px, -20px); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.pro-bg3 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 584px; |
|
|
|
|
height: 360px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 0; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
bottom: 0; |
|
|
|
|
right: 0; |
|
|
|
|
animation: rotate 10s linear infinite; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 15px; |
|
|
|
|
left: 13px; |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
bottom: 0; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg5 { |
|
|
|
|
top: 0; |
|
|
|
|
right: 0; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
transform: translate(-20px, 20px); |
|
|
|
|
} |
|
|
|
|
.bg5 { |
|
|
|
|
transform: translateY(-20px); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.pro-bg4 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 580px; |
|
|
|
|
height: 360px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 0; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
bottom: -40px; |
|
|
|
|
right: -20px; |
|
|
|
|
animation: rotate 10s linear infinite; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 40px; |
|
|
|
|
left: 30px; |
|
|
|
|
width: 530px; |
|
|
|
|
box-shadow: 2px 2px 3px #f1f1f1, -2px -2px 4px #f1f1f1; |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
top: 140px; |
|
|
|
|
left: -20px; |
|
|
|
|
width: 120px; |
|
|
|
|
height: 100px; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
transform: translate(135px, 70px); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.pro-bg5 { |
|
|
|
|
position: relative; |
|
|
|
|
width: 580px; |
|
|
|
|
height: 360px; |
|
|
|
|
img { |
|
|
|
|
position: absolute; |
|
|
|
|
transition: .5s; |
|
|
|
|
} |
|
|
|
|
.bg1 { |
|
|
|
|
top: 0; |
|
|
|
|
left: 0; |
|
|
|
|
} |
|
|
|
|
.bg2 { |
|
|
|
|
bottom: -40px; |
|
|
|
|
right: -20px; |
|
|
|
|
animation: rotate 10s linear infinite; |
|
|
|
|
} |
|
|
|
|
.bg3 { |
|
|
|
|
top: 40px; |
|
|
|
|
left: 30px; |
|
|
|
|
width: 530px; |
|
|
|
|
box-shadow: 2px 2px 3px #f1f1f1, -2px -2px 4px #f1f1f1; |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
top: 150px; |
|
|
|
|
right: 40px; |
|
|
|
|
width: 295px; |
|
|
|
|
} |
|
|
|
|
&:hover { |
|
|
|
|
.bg3 { |
|
|
|
|
transform: scale(1.1); |
|
|
|
|
} |
|
|
|
|
.bg4 { |
|
|
|
|
transform: translate(-80px, 25px) scale(1.1); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.none{ |
|
|
|
|
padding: 50px 0; |
|
|
|
|
|
