图片清理

master
yujialong 1 month ago
parent affb4d4770
commit ed95b53eaa
  1. BIN
      src/assets/images/industrial/app1-1.png
  2. BIN
      src/assets/images/industrial/app1.png
  3. BIN
      src/assets/images/industrial/app10-1.png
  4. BIN
      src/assets/images/industrial/app10.png
  5. BIN
      src/assets/images/industrial/app11-1.png
  6. BIN
      src/assets/images/industrial/app11.png
  7. BIN
      src/assets/images/industrial/app12-1.png
  8. BIN
      src/assets/images/industrial/app12.png
  9. BIN
      src/assets/images/industrial/app13-1.png
  10. BIN
      src/assets/images/industrial/app13.png
  11. BIN
      src/assets/images/industrial/app14-1.png
  12. BIN
      src/assets/images/industrial/app14.png
  13. BIN
      src/assets/images/industrial/app15-1.png
  14. BIN
      src/assets/images/industrial/app15.png
  15. BIN
      src/assets/images/industrial/app16-1.png
  16. BIN
      src/assets/images/industrial/app16.png
  17. BIN
      src/assets/images/industrial/app2-1.png
  18. BIN
      src/assets/images/industrial/app2.png
  19. BIN
      src/assets/images/industrial/app3-1.png
  20. BIN
      src/assets/images/industrial/app3.png
  21. BIN
      src/assets/images/industrial/app4-1.png
  22. BIN
      src/assets/images/industrial/app4.png
  23. BIN
      src/assets/images/industrial/app5-1.png
  24. BIN
      src/assets/images/industrial/app5.png
  25. BIN
      src/assets/images/industrial/app6-1.png
  26. BIN
      src/assets/images/industrial/app6.png
  27. BIN
      src/assets/images/industrial/app7-1.png
  28. BIN
      src/assets/images/industrial/app7.png
  29. BIN
      src/assets/images/industrial/app8-1.png
  30. BIN
      src/assets/images/industrial/app8.png
  31. BIN
      src/assets/images/industrial/app9-1.png
  32. BIN
      src/assets/images/industrial/app9.png
  33. 1
      src/pages/application/index.vue
  34. 154
      src/pages/industrial/index.vue
  35. 114
      src/pages/supplier/index.vue

Binary file not shown.

Before

Width:  |  Height:  |  Size: 648 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 326 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 699 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 741 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 439 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 945 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 954 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

@ -218,6 +218,7 @@ export default {
.app { .app {
display: flex; display: flex;
justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
li { li {

@ -1,80 +1,58 @@
<template> <template>
<div class="wrap"> <div class="wrap">
<div class="single-banner"> <div class="single-banner">
<img class="banner-img" <img class="banner-img" :src="modules[0].form.pic" alt="" />
:src="modules[0].form.pic"
alt="" />
<div class="texts"> <div class="texts">
<h6 class="banner-title">{{ modules[0].form.title }}</h6> <h6 class="banner-title">{{ modules[0].form.title }}</h6>
</div> </div>
</div> </div>
<div class="block history gray"> <div class="block history gray">
<div class="inner" <div class="inner" :class="{ 'cursor-pointer': isLink(modules[1].form.link.linkName) }"
:class="{'cursor-pointer': isLink(modules[1].form.link.linkName)}"
@click="openLink(modules[1].form)"> @click="openLink(modules[1].form)">
<h2 class="wow fadeInLeft" <h2 class="wow fadeInLeft" style="margin-left: 57px" v-html="modules[1].form.title"></h2>
style="margin-left: 57px" <div class="texts wow fadeInDown" data-wow-delay="0.5s">
v-html="modules[1].form.title"></h2>
<div class="texts wow fadeInDown"
data-wow-delay="0.5s">
<div class="left"> <div class="left">
<h2>{{ modules[1].form.subTitle }}</h2> <h2>{{ modules[1].form.subTitle }}</h2>
<div class="text" <div class="text" v-html="modules[1].form.des"></div>
v-html="modules[1].form.des"></div>
</div> </div>
<img class="bg" <img class="bg" :src="modules[1].form.pic" alt="">
:src="modules[1].form.pic"
alt="">
</div> </div>
</div> </div>
</div> </div>
<div class="block land"> <div class="block land">
<div class="inner"> <div class="inner">
<img class="pic wow fadeInLeft" <img class="pic wow fadeInLeft" :src="modules[2].form.pic" alt="">
:src="modules[2].form.pic"
alt="">
<div class="right wow fadeInDown"> <div class="right wow fadeInDown">
<h6 v-html="modules[2].form.title"></h6> <h6 v-html="modules[2].form.title"></h6>
<div class="text" <div class="text" v-html="modules[2].form.des"></div>
v-html="modules[2].form.des"></div>
</div> </div>
</div> </div>
</div> </div>
<div class="block gray"> <div class="block gray">
<div class="inner"> <div class="inner">
<h2 class="b-title wow fadeInUp plan-title" <h2 class="b-title wow fadeInUp plan-title" v-html="modules[3].form.title"></h2>
v-html="modules[3].form.title"></h2> <p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[3].form.des }}</p>
<p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[3].form.des }}</p>
<ul class="plan"> <ul class="plan">
<li> <li>
<div class="left"> <div class="left">
<h6 v-html="modules[4].form.title"></h6> <h6 v-html="modules[4].form.title"></h6>
<div class="text" <div class="text" v-html="modules[4].form.des"></div>
v-html="modules[4].form.des"></div> <a v-if="isLink(modules[4].form.link.linkName)" class="survey" @click="openLink(modules[4].form)">需求调研
<a v-if="isLink(modules[4].form.link.linkName)" ></a>
class="survey"
@click="openLink(modules[4].form)">需求调研 ></a>
</div> </div>
<img class="pic" <img class="pic" :src="modules[4].form.pic" alt="">
:src="modules[4].form.pic"
alt="">
</li> </li>
<li> <li>
<div class="left"> <div class="left">
<h6 v-html="modules[5].form.title"></h6> <h6 v-html="modules[5].form.title"></h6>
<div class="text" <div class="text" v-html="modules[5].form.des"></div>
v-html="modules[5].form.des"></div> <a v-if="isLink(modules[5].form.link.linkName)" class="survey" @click="openLink(modules[5].form)">需求调研
<a v-if="isLink(modules[5].form.link.linkName)" ></a>
class="survey"
@click="openLink(modules[5].form)">需求调研 ></a>
</div> </div>
<img class="pic" <img class="pic" :src="modules[5].form.pic" alt="">
:src="modules[5].form.pic"
alt="">
</li> </li>
</ul> </ul>
</div> </div>
@ -82,23 +60,15 @@
<div class="block"> <div class="block">
<div class="inner"> <div class="inner">
<h2 class="b-title" <h2 class="b-title" :class="{ 'wow fadeInUp': $store.getters.getModelType }" v-html="modules[6].form.title">
:class="{'wow fadeInUp': $store.getters.getModelType}" </h2>
v-html="modules[6].form.title"></h2> <p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[6].form.des }}</p>
<p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[6].form.des }}</p>
<ul class="app"> <ul class="app">
<li v-for="(item, i) in modules[7].list" <li v-for="(item, i) in modules[7].list" :key="i" :data-wow-delay="(0.2 * i).toFixed(1) + 's'"
:key="i" :class="{ 'cursor-pointer': isLink(item.link.linkName), 'wow fadeInDown': $store.getters.getModelType }"
:data-wow-delay="(0.2 * i).toFixed(1) + 's'"
:class="{'cursor-pointer': isLink(item.link.linkName),'wow fadeInDown': $store.getters.getModelType}"
@click="openLink(item)"> @click="openLink(item)">
<img class="bg" <img class="bg" :src="'https://huorantech.com/images/industrial/app' + (i + 1) + '.png'" alt="">
:src="require('@/assets/images/industrial/app' + (i + 1) + '.png')" <img class="icon" :src="'https://huorantech.com/images/industrial/app' + (i + 1) + '-1.png'" alt="">
alt="">
<img class="icon"
:src="require('@/assets/images/industrial/app' + (i + 1) + '-1.png')"
alt="">
<p class="text">{{ item.title }}</p> <p class="text">{{ item.title }}</p>
</li> </li>
</ul> </ul>
@ -107,30 +77,21 @@
<div class="block news-block"> <div class="block news-block">
<div class="inner"> <div class="inner">
<h2 class="b-title" <h2 class="b-title" :class="{ 'wow fadeInUp': $store.getters.getModelType }" v-html="modules[8].form.title">
:class="{'wow fadeInUp': $store.getters.getModelType}" </h2>
v-html="modules[8].form.title"></h2> <p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[8].form.des }}</p>
<p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[8].form.des }}</p>
<ul class="news"> <ul class="news">
<li :class="{'wow fadeInDown': $store.getters.getModelType}" <li :class="{ 'wow fadeInDown': $store.getters.getModelType }" :data-wow-delay="(0.2 * i).toFixed(1) + 's'"
:data-wow-delay="(0.2 * i).toFixed(1) + 's'" v-for="(item, i) in articles" :key="i" @click="toArtice(item, modules[9].form)">
v-for="(item, i) in articles" <img :src="item.titleImg" alt="">
:key="i"
@click="toArtice(item, modules[9].form)">
<img :src="item.titleImg"
alt="">
<div class="texts"> <div class="texts">
<span class="meta">{{ item.releaseTime }}</span> <span class="meta">{{ item.releaseTime }}</span>
<h6>{{ item.title }}</h6> <h6>{{ item.title }}</h6>
</div> </div>
</li> </li>
</ul> </ul>
<div class="all-link" <div class="all-link" @click="toAll(modules[9].form)">
@click="toAll(modules[9].form)"> <span>{{ $t('column.all') }} <img class="icon" src="@/assets/images/arrow.png" alt=""></span>
<span>{{$t('column.all')}} <img class="icon"
src="@/assets/images/arrow.png"
alt=""></span>
</div> </div>
</div> </div>
</div> </div>
@ -187,12 +148,14 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
@import url(../../plugins/wow/animate.css); @import url(../../plugins/wow/animate.css);
@import '../../styles/page/page.scss'; @import '../../styles/page/page.scss';
.history { .history {
h2 { h2 {
margin-bottom: 20px; margin-bottom: 20px;
font-size: 1.8rem; font-size: 1.8rem;
color: #333; color: #333;
} }
.texts { .texts {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -200,14 +163,17 @@ export default {
background-color: #fff; background-color: #fff;
border-radius: 100px 0px 0px 0px; border-radius: 100px 0px 0px 0px;
transition: 0.3s; transition: 0.3s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
} }
} }
.left { .left {
width: 500px; width: 500px;
padding-right: 30px; padding-right: 30px;
} }
.text { .text {
margin: 20px 0; margin: 20px 0;
font-size: 1.2rem; font-size: 1.2rem;
@ -215,6 +181,7 @@ export default {
line-height: 31px; line-height: 31px;
@include mul-ellipsis(10); @include mul-ellipsis(10);
} }
.bg { .bg {
width: 560px; width: 560px;
height: 500px; height: 500px;
@ -222,18 +189,22 @@ export default {
// object-fit: cover; // object-fit: cover;
} }
} }
.land { .land {
.inner { .inner {
display: flex; display: flex;
} }
.pic { .pic {
width: 50%; width: 50%;
height: 450px; height: 450px;
object-fit: cover; object-fit: cover;
} }
.right { .right {
width: 50%; width: 50%;
} }
h6 { h6 {
margin-left: 50px; margin-left: 50px;
font-size: 1.3rem; font-size: 1.3rem;
@ -241,6 +212,7 @@ export default {
color: #333; color: #333;
@include ellipsis(); @include ellipsis();
} }
.text { .text {
height: 405px; height: 405px;
padding: 50px; padding: 50px;
@ -249,6 +221,7 @@ export default {
border-radius: 0px 100px 0px 0px; border-radius: 0px 100px 0px 0px;
} }
} }
.plan { .plan {
li { li {
display: flex; display: flex;
@ -258,26 +231,32 @@ export default {
color: #333; color: #333;
background-color: #fff; background-color: #fff;
border-radius: 100px 0px 0px 0px; border-radius: 100px 0px 0px 0px;
&:nth-child(even) { &:nth-child(even) {
flex-direction: row-reverse; flex-direction: row-reverse;
.pic { .pic {
margin: -20px 0 0 -20px; margin: -20px 0 0 -20px;
border-radius: 0 100px 0 0; border-radius: 0 100px 0 0;
} }
} }
.left { .left {
width: 50%; width: 50%;
padding: 50px; padding: 50px;
} }
h6 { h6 {
font-size: 1.4rem; font-size: 1.4rem;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
} }
.text { .text {
margin: 14px 0 40px; margin: 14px 0 40px;
font-size: 1rem; font-size: 1rem;
line-height: 1.6; line-height: 1.6;
} }
.survey { .survey {
padding: 8px 15px; padding: 8px 15px;
font-size: 0.9rem; font-size: 0.9rem;
@ -286,6 +265,7 @@ export default {
cursor: pointer; cursor: pointer;
border-radius: 4px; border-radius: 4px;
} }
.pic { .pic {
width: 48%; width: 48%;
height: 423px; height: 423px;
@ -299,6 +279,7 @@ export default {
.app { .app {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
li { li {
position: relative; position: relative;
display: flex; display: flex;
@ -309,16 +290,20 @@ export default {
height: 200px; height: 200px;
margin: 0 10px 10px 0; margin: 0 10px 10px 0;
transition: 0.3s; transition: 0.3s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
.icon { .icon {
transform: rotateY(180deg); transform: rotateY(180deg);
} }
} }
&:nth-child(4n) { &:nth-child(4n) {
margin-right: 0; margin-right: 0;
} }
} }
.bg { .bg {
position: absolute; position: absolute;
top: 0; top: 0;
@ -327,11 +312,13 @@ export default {
height: 100%; height: 100%;
object-fit: cover; object-fit: cover;
} }
.icon { .icon {
position: relative; position: relative;
width: 62px; width: 62px;
transition: 0.5s; transition: 0.5s;
} }
.text { .text {
position: relative; position: relative;
margin-top: 20px; margin-top: 20px;
@ -339,34 +326,41 @@ export default {
color: #fff; color: #fff;
} }
} }
.news { .news {
position: relative; position: relative;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
li { li {
width: calc((100% - 34px) / 3); width: calc((100% - 34px) / 3);
margin: 0 17px 20px 0; margin: 0 17px 20px 0;
background-color: #fff; background-color: #fff;
cursor: pointer; cursor: pointer;
&:nth-child(3n) { &:nth-child(3n) {
margin-right: 0; margin-right: 0;
} }
} }
img { img {
width: 100%; width: 100%;
height: 220px; height: 220px;
object-fit: cover; object-fit: cover;
} }
.texts { .texts {
padding: 20px 24px; padding: 20px 24px;
background-color: #fff; background-color: #fff;
} }
h6 { h6 {
margin-top: 8px; margin-top: 8px;
font-size: 1rem; font-size: 1rem;
color: #333; color: #333;
text-shadow: 0px 0px 20px rgba(176, 176, 176, 0.21); text-shadow: 0px 0px 20px rgba(176, 176, 176, 0.21);
} }
.meta { .meta {
font-size: 0.9rem; font-size: 0.9rem;
color: #666; color: #666;
@ -379,63 +373,78 @@ export default {
.texts { .texts {
flex-direction: column; flex-direction: column;
} }
.left { .left {
width: 100%; width: 100%;
} }
.bg { .bg {
width: 100%; width: 100%;
height: auto; height: auto;
margin-top: 1rem; margin-top: 1rem;
} }
} }
.land { .land {
.inner { .inner {
flex-direction: column; flex-direction: column;
} }
.pic, .pic,
.right { .right {
width: 100%; width: 100%;
} }
h6 { h6 {
margin-left: 0; margin-left: 0;
} }
.right { .right {
margin-top: 1rem; margin-top: 1rem;
} }
.text { .text {
height: auto; height: auto;
} }
} }
.plan { .plan {
li { li {
flex-direction: column !important; flex-direction: column !important;
height: auto; height: auto;
.left, .left,
.pic { .pic {
width: 100%; width: 100%;
} }
.pic { .pic {
margin: 1rem 0 0 !important; margin: 1rem 0 0 !important;
} }
} }
} }
.app { .app {
li { li {
width: calc((100% - 10px) / 2); width: calc((100% - 10px) / 2);
height: 267px; height: 267px;
&:nth-child(2n) { &:nth-child(2n) {
margin-right: 0; margin-right: 0;
} }
} }
} }
.news { .news {
flex-direction: column; flex-direction: column;
li { li {
width: 100%; width: 100%;
margin: 0 0 20px 0; margin: 0 0 20px 0;
} }
} }
} }
@media (max-width: 780px) { @media (max-width: 780px) {
.app { .app {
li { li {
@ -443,6 +452,7 @@ export default {
margin-right: 0; margin-right: 0;
} }
} }
.plan-title:after { .plan-title:after {
display: none; display: none;
} }

@ -3,42 +3,37 @@
<div class="banner fadeInDown"> <div class="banner fadeInDown">
<h6>教育数字化产品供应商</h6> <h6>教育数字化产品供应商</h6>
<p class="text">与3000所高校共建数字化教育产业未来</p> <p class="text">与3000所高校共建数字化教育产业未来</p>
<el-button class="dev" <el-button class="dev" type="primary" @click="openDev">登录供应商平台</el-button>
type="primary"
@click="openDev">登录供应商平台</el-button>
</div> </div>
<!-- 关于教育产业数字化产品供应商 --> <!-- 关于教育产业数字化产品供应商 -->
<div class="about fadeInUp"> <div class="about fadeInUp">
<div class="inner"> <div class="inner">
<div class="text">如果您是从事高职本科市场相应数字化场景的软件硬件研发生产或代理的供应商如果您正面临拓展渠道难精准触达客户难售前支持难按时回款难等发展瓶颈请加入职站商城让您的产品轻松走进全国院校</div> <div class="text">
如果您是从事高职本科市场相应数字化场景的软件硬件研发生产或代理的供应商如果您正面临拓展渠道难精准触达客户难售前支持难按时回款难等发展瓶颈请加入职站商城让您的产品轻松走进全国院校</div>
<div class="entry"> <div class="entry">
<ul class="progress"> <ul class="progress">
<li> <li>
<span class="icon"> <span class="icon">
<img src="@/assets/images/dev/entry1.png" <img src="@/assets/images/dev/entry1.png" alt="">
alt="">
</span> </span>
<p class="pro-text">申请供应商平台账号</p> <p class="pro-text">申请供应商平台账号</p>
</li> </li>
<li> <li>
<span class="icon"> <span class="icon">
<img src="@/assets/images/dev/entry2.png" <img src="@/assets/images/dev/entry2.png" alt="">
alt="">
</span> </span>
<p class="pro-text">提交职站商城入驻申请</p> <p class="pro-text">提交职站商城入驻申请</p>
</li> </li>
<li> <li>
<span class="icon"> <span class="icon">
<img src="@/assets/images/dev/entry3.png" <img src="@/assets/images/dev/entry3.png" alt="">
alt="">
</span> </span>
<p class="pro-text">完成业务沟通</p> <p class="pro-text">完成业务沟通</p>
</li> </li>
<li> <li>
<span class="icon"> <span class="icon">
<img src="@/assets/images/dev/entry4.png" <img src="@/assets/images/dev/entry4.png" alt="">
alt="">
</span> </span>
<p class="pro-text">审核完成加入职站商城</p> <p class="pro-text">审核完成加入职站商城</p>
</li> </li>
@ -51,9 +46,7 @@
<el-step title="审核完成,加入云商店"></el-step> <el-step title="审核完成,加入云商店"></el-step>
</el-steps> --> </el-steps> -->
<el-button class="apply" <el-button class="apply" type="primary" @click="qrcodeVisible = true">申请</el-button>
type="primary"
@click="qrcodeVisible = true">申请</el-button>
</div> </div>
</div> </div>
</div> </div>
@ -84,20 +77,17 @@
<h6 class="i-title fadeInRight">产品供应商需要具备的条件</h6> <h6 class="i-title fadeInRight">产品供应商需要具备的条件</h6>
<ul class="list"> <ul class="list">
<li class="fadeInDown0"> <li class="fadeInDown0">
<img src="@/assets/images/dev/con1.png" <img src="@/assets/images/dev/con1.png" alt="">
alt="">
<h6>产品研发</h6> <h6>产品研发</h6>
<p class="text">具备独立设计开发教育产业数字化产品的能力</p> <p class="text">具备独立设计开发教育产业数字化产品的能力</p>
</li> </li>
<li class="fadeInDown1"> <li class="fadeInDown1">
<img src="@/assets/images/dev/con2.png" <img src="@/assets/images/dev/con2.png" alt="">
alt="">
<h6>产品运维 </h6> <h6>产品运维 </h6>
<p class="text">具备独立的产品运维支持的能力</p> <p class="text">具备独立的产品运维支持的能力</p>
</li> </li>
<li class="fadeInDown2"> <li class="fadeInDown2">
<img src="@/assets/images/dev/con3.png" <img src="@/assets/images/dev/con3.png" alt="">
alt="">
<h6>专业服务</h6> <h6>专业服务</h6>
<p class="text">具备对产品内容专业支持的能力</p> <p class="text">具备对产品内容专业支持的能力</p>
</li> </li>
@ -110,24 +100,13 @@
</div> </div>
<!-- 联系 --> <!-- 联系 -->
<div class="contact"> <div class="contact">
<img class="love fadeInRight" <img class="love fadeInRight" src="@/assets/images/love.png" alt="">
src="@/assets/images/love.png" <img class="contact-info fadeInLeft" src="@/assets/images/contact-info.png" alt="">
alt="">
<img class="contact-info fadeInLeft"
src="@/assets/images/contact-info.png"
alt="">
</div> </div>
<el-dialog title="" <el-dialog title="" :visible.sync="qrcodeVisible" width="400px" center :top="qrcodeTop" custom-class="qrcode-dia">
:visible.sync="qrcodeVisible"
width="400px"
center
:top="qrcodeTop"
custom-class="qrcode-dia">
<div> <div>
<img width="100%" <img width="100%" src="@/assets/images/qywechat.png" alt="">
src="@/assets/images/qywechat.png"
alt="">
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
@ -237,12 +216,14 @@ export default {
.wrap { .wrap {
position: relative; position: relative;
background-color: #fff; background-color: #fff;
.banner { .banner {
position: relative; position: relative;
height: 350px; height: 350px;
padding: 70px 0 0 180px; padding: 70px 0 0 180px;
background: url(../../assets/images/dev/banner2.png) (90% 32px) / auto no-repeat, background: url(../../assets/images/dev/banner2.png) (90% 32px) / auto no-repeat,
url(../../assets/images/dev/banner1.png) 0 0/100% 100% no-repeat; url(../../assets/images/dev/banner1.png) 0 0/100% 100% no-repeat;
.dev { .dev {
position: absolute; position: absolute;
bottom: 120px; bottom: 120px;
@ -251,15 +232,18 @@ export default {
transform: translateX(-50%); transform: translateX(-50%);
text-align: center; text-align: center;
} }
h6 { h6 {
margin-bottom: 30px; margin-bottom: 30px;
font-size: 2.2rem; font-size: 2.2rem;
} }
.text { .text {
font-size: 1rem; font-size: 1rem;
line-height: 30px; line-height: 30px;
} }
} }
.i-title { .i-title {
position: relative; position: relative;
margin-bottom: 37px; margin-bottom: 37px;
@ -267,26 +251,32 @@ export default {
text-align: center; text-align: center;
color: #0b1d30; color: #0b1d30;
} }
.inner { .inner {
width: 1200px; width: 1200px;
padding: 67px 0; padding: 67px 0;
margin: 0 auto; margin: 0 auto;
overflow: hidden; overflow: hidden;
} }
.entry { .entry {
margin-top: 30px; margin-top: 30px;
text-align: center; text-align: center;
.apply { .apply {
margin-top: 20px; margin-top: 20px;
} }
} }
.progress { .progress {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
li { li {
position: relative; position: relative;
margin-right: 100px; margin-right: 100px;
&:before { &:before {
content: ''; content: '';
z-index: 2; z-index: 2;
@ -299,6 +289,7 @@ export default {
border: 1px solid #ff5d5d; border: 1px solid #ff5d5d;
border-radius: 50%; border-radius: 50%;
} }
&:after { &:after {
content: ''; content: '';
position: absolute; position: absolute;
@ -308,15 +299,18 @@ export default {
height: 2px; height: 2px;
background-color: #e9e9e9; background-color: #e9e9e9;
} }
&:last-child { &:last-child {
&:before { &:before {
left: 48%; left: 48%;
} }
&:after { &:after {
width: 181px; width: 181px;
} }
} }
} }
.icon { .icon {
display: inline-flex; display: inline-flex;
justify-content: center; justify-content: center;
@ -325,83 +319,102 @@ export default {
background-color: #ff5d5d; background-color: #ff5d5d;
border-radius: 50%; border-radius: 50%;
} }
.pro-text { .pro-text {
margin-top: 30px; margin-top: 30px;
font-size: 14px; font-size: 14px;
} }
} }
.about { .about {
position: relative; position: relative;
margin: -60px 0 20px; margin: -60px 0 20px;
.inner { .inner {
padding: 40px; padding: 40px;
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;
box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08); box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08);
} }
h6 { h6 {
margin-bottom: 20px; margin-bottom: 20px;
font-size: 24px; font-size: 24px;
color: #0b1d30; color: #0b1d30;
} }
.text { .text {
font-size: 16px; font-size: 16px;
line-height: 1.8; line-height: 1.8;
color: #0b1d30; color: #0b1d30;
} }
} }
.sup { .sup {
background: linear-gradient(180deg, #ffffff 0%, #f1f6fe 100%); background: linear-gradient(180deg, #ffffff 0%, #f1f6fe 100%);
.list { .list {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
li { li {
width: 33%; width: 33%;
padding: 140px 50px 50px; padding: 140px 50px 50px;
background: url(../../assets/images/dev/sup1.png) 0 0/100% 100% no-repeat; background: url(../../assets/images/dev/sup1.png) 0 0/100% 100% no-repeat;
&:nth-child(2) { &:nth-child(2) {
background-image: url(../../assets/images/dev/sup2.png); background-image: url(../../assets/images/dev/sup2.png);
} }
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
background-image: url(../../assets/images/dev/sup3.png); background-image: url(../../assets/images/dev/sup3.png);
} }
} }
h6 { h6 {
margin: 15px 0 10px; margin: 15px 0 10px;
font-size: 18px; font-size: 18px;
color: #0b1d30; color: #0b1d30;
} }
.text { .text {
font-size: 14px; font-size: 14px;
color: #757f92; color: #757f92;
} }
} }
} }
.con { .con {
background: url(../../assets/images/dev/con-bg.png) 0 0/100% 100% no-repeat; background: url(../../assets/images/dev/con-bg.png) 0 0/100% 100% no-repeat;
.list { .list {
display: flex; display: flex;
flex: 1; flex: 1;
li { li {
padding-bottom: 40px; padding-bottom: 40px;
margin-right: 24px; margin-right: 24px;
background-color: #fff; background-color: #fff;
border-radius: 10px; border-radius: 10px;
box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08); box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08);
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
} }
img { img {
width: 100%; width: 100%;
object-fit: cover; object-fit: cover;
} }
h6 { h6 {
margin: 15px 24px 10px; margin: 15px 24px 10px;
font-size: 18px; font-size: 18px;
color: #0b1d30; color: #0b1d30;
} }
.text { .text {
margin: 0 24px; margin: 0 24px;
font-size: 14px; font-size: 14px;
@ -409,15 +422,18 @@ export default {
} }
} }
} }
.profit { .profit {
margin-bottom: 70px; margin-bottom: 70px;
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
.item1 { .item1 {
line-height: 250px; line-height: 250px;
color: #fff; color: #fff;
background: url(../../assets/images/dev/profit-bg1.png) 0 0/100% 100% no-repeat; background: url(../../assets/images/dev/profit-bg1.png) 0 0/100% 100% no-repeat;
} }
.item2 { .item2 {
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -430,6 +446,7 @@ export default {
background: url(../../assets/images/dev/profit-bg2.png) 0 0/100% 100% no-repeat; background: url(../../assets/images/dev/profit-bg2.png) 0 0/100% 100% no-repeat;
} }
} }
.contact { .contact {
position: relative; position: relative;
display: flex; display: flex;
@ -437,10 +454,12 @@ export default {
align-items: center; align-items: center;
height: 250px; height: 250px;
background: url(../../assets/images/contact-bg.png) 0 0/100% 100% no-repeat; background: url(../../assets/images/contact-bg.png) 0 0/100% 100% no-repeat;
.contact-info { .contact-info {
max-width: 100%; max-width: 100%;
object-fit: cover; object-fit: cover;
} }
.love { .love {
position: absolute; position: absolute;
top: -45px; top: -45px;
@ -448,31 +467,39 @@ export default {
} }
} }
} }
/deep/.qrcode-dia { /deep/.qrcode-dia {
background-color: transparent; background-color: transparent;
box-shadow: none; box-shadow: none;
.el-dialog__header, .el-dialog__header,
.el-dialog__body { .el-dialog__body {
padding: 0; padding: 0;
background-color: transparent; background-color: transparent;
} }
.el-dialog__headerbtn .el-dialog__close { .el-dialog__headerbtn .el-dialog__close {
color: #fff; color: #fff;
} }
} }
@media (max-width: 1200px) { @media (max-width: 1200px) {
.wrap { .wrap {
.banner { .banner {
padding-left: 50px; padding-left: 50px;
} }
.inner { .inner {
width: 90%; width: 90%;
} }
.profit { .profit {
font-size: 24px; font-size: 24px;
.item1 { .item1 {
background-size: cover; background-size: cover;
} }
.item2 { .item2 {
width: 90%; width: 90%;
background-size: cover; background-size: cover;
@ -480,33 +507,40 @@ export default {
} }
} }
} }
@media (max-width: 1000px) { @media (max-width: 1000px) {
.wrap { .wrap {
.progress { .progress {
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
padding-left: 34%; padding-left: 34%;
li { li {
margin: 0 0 100px 0; margin: 0 0 100px 0;
&:before { &:before {
top: 15px; top: 15px;
left: 58px; left: 58px;
} }
&:after { &:after {
top: 14px; top: 14px;
left: 61px; left: 61px;
width: 2px !important; width: 2px !important;
height: 158px; height: 158px;
} }
&:last-child { &:last-child {
&:before { &:before {
left: 58px; left: 58px;
} }
&:after { &:after {
height: 0; height: 0;
} }
} }
} }
.pro-text { .pro-text {
position: absolute; position: absolute;
top: 12px; top: 12px;
@ -515,18 +549,22 @@ export default {
white-space: nowrap; white-space: nowrap;
} }
} }
.sup { .sup {
.list { .list {
flex-direction: column; flex-direction: column;
li { li {
width: 100%; width: 100%;
padding: 140px 80px 50px; padding: 140px 80px 50px;
} }
} }
} }
.con { .con {
.list { .list {
flex-direction: column; flex-direction: column;
li { li {
margin-bottom: 20px; margin-bottom: 20px;
} }
@ -534,6 +572,7 @@ export default {
} }
} }
} }
@media (max-width: 600px) { @media (max-width: 600px) {
.wrap { .wrap {
.banner { .banner {
@ -542,15 +581,18 @@ export default {
align-items: center; align-items: center;
padding: 5rem 0 0 0; padding: 5rem 0 0 0;
color: #064791; color: #064791;
h6, h6,
.text { .text {
margin-bottom: 10px; margin-bottom: 10px;
} }
.dev { .dev {
position: static; position: static;
transform: translateX(0); transform: translateX(0);
} }
} }
.progress { .progress {
padding-left: 0; padding-left: 0;
} }

Loading…
Cancel
Save