yujialong 1 year ago
parent 14e2083f8d
commit e657bccaf0
  1. 9
      src/layouts/header/index.vue
  2. 7
      src/libs/util.js
  3. 320
      src/pages/home/index.vue
  4. 64
      src/pages/iasf/index.vue
  5. 4
      src/styles/common.scss
  6. BIN
      src/styles/font/AlimamaShuHeiTi-Bold.otf

@ -36,12 +36,12 @@
alt=""
@click.stop="toMail">
</template>
<template v-if="$i18n.locale == 'en'">
<template v-if="Util.isEn(site)">
<img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')"
alt=""
@click.stop="toggleLang">
</template>
<template v-else-if="$i18n.locale == 'zh'">
<template v-else>
<img :src="require('@/assets/images/en' + (isHome ? '-white' : '') + '.png')"
alt=""
@click.stop="toggleLang">
@ -80,12 +80,12 @@
@click.stop="toggleSearch"></div>
<div class="languageBox">
<!-- <img :src="require('@/assets/images/cn' + (isHome && $store.getters.getModelType ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang"> -->
<template v-if="$i18n.locale == 'en'">
<template v-if="Util.isEn(site)">
<img :src="require('@/assets/images/cn' + (isHome && $store.getters.getModelType ? '-white' : '') + '.png')"
alt=""
@click.stop="toggleLang">
</template>
<template v-else-if="$i18n.locale == 'zh'">
<template v-else>
<img :src="require('@/assets/images/en' + (isHome && $store.getters.getModelType ? '-white' : '') + '.png')"
alt=""
@click.stop="toggleLang">
@ -118,6 +118,7 @@ import navbar from '../navbar'
export default {
data () {
return {
Util,
isHome: true,
isEstate: false,
showSearch: false,

@ -1,6 +1,7 @@
import { _local } from "./util.db";
import { Message } from "element-ui";
import Router from '@/router'
import Setting from '@/setting'
// 文件后缀集合
const exts = {
@ -140,7 +141,11 @@ const util = {
// 是否是各个站点的首页,首页的导航样式不一样,所以要单独判断
isIndex() {
return indexPath.includes(Router.app.$route.path)
}
},
// 传入站点id,判断是否英文
isEn(id) {
return Setting.enIds.includes(+id)
},
};
export default util;

@ -1,9 +1,18 @@
<template>
<div class="wrap" v-if="modules.length>=1">
<el-carousel class="carousel" :interval="6000" :arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'" :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<div class="wrap"
v-if="modules.length>=1">
<el-carousel class="carousel"
:interval="6000"
:arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'"
:indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i">
<img :class="[{'cursor-pointer': isLink(item.link.linkName)}]" width="100%" :src="item.pic" alt="" @click="openLink(item)">
<el-carousel-item v-if="item.pic && item.isEnable"
:key="i">
<img :class="[{'cursor-pointer': isLink(item.link.linkName)}]"
width="100%"
:src="item.pic"
alt=""
@click="openLink(item)">
</el-carousel-item>
</template>
</el-carousel>
@ -11,22 +20,35 @@
<div class="block">
<div class="inner">
<h2 class="b-title wow fadeInUp">{{ modules[1].form.title }}</h2>
<p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[1].form.des }}</p>
<p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[1].form.des }}</p>
<ul class="card">
<li class="wow fadeInDown" data-wow-delay="0.2s">
<img class="pic" :src="modules[2].form.pic" alt="">
<li class="wow fadeInDown"
data-wow-delay="0.2s">
<img class="pic"
:src="modules[2].form.pic"
alt="">
<div class="texts">
<h6>{{ modules[2].form.title }}</h6>
<p class="des">{{ modules[2].form.des }}</p>
<img src="@/assets/images/arrow.png" alt="" :class="{'arrow': isLink(modules[2].form.link.linkName)}" @click="openLink(modules[2].form)">
<img src="@/assets/images/arrow.png"
alt=""
:class="{'arrow': isLink(modules[2].form.link.linkName)}"
@click="openLink(modules[2].form)">
</div>
</li>
<li class="wow fadeInDown" data-wow-delay="0.6s">
<img class="pic" :src="modules[3].form.pic" alt="">
<li class="wow fadeInDown"
data-wow-delay="0.6s">
<img class="pic"
:src="modules[3].form.pic"
alt="">
<div class="texts">
<h6>{{ modules[3].form.title }}</h6>
<p class="des">{{ modules[3].form.des }}</p>
<img src="@/assets/images/arrow.png" alt="" :class="{'arrow': isLink(modules[3].form.link.linkName)}" @click="openLink(modules[3].form)">
<img src="@/assets/images/arrow.png"
alt=""
:class="{'arrow': isLink(modules[3].form.link.linkName)}"
@click="openLink(modules[3].form)">
</div>
</li>
</ul>
@ -36,19 +58,29 @@
<div class="block news-block">
<div class="inner">
<h2 class="b-title wow fadeInUp">{{ modules[4].form.title }}</h2>
<p class="intro wow fadeInUp" data-wow-delay="0.5s">{{ modules[4].form.des }}</p>
<p class="intro wow fadeInUp"
data-wow-delay="0.5s">{{ modules[4].form.des }}</p>
<ul class="news">
<li class="wow fadeInDown" :data-wow-delay="(0.2 * i).toFixed(1) + 's'" v-for="(item, i) in articles" :key="i" @click="toArtice(item, modules[5].form)">
<img :src="item.titleImg" alt="">
<li class="wow fadeInDown"
:data-wow-delay="(0.2 * i).toFixed(1) + 's'"
v-for="(item, i) in articles"
:key="i"
@click="toArtice(item, modules[5].form)">
<img :src="item.titleImg"
alt="">
<div class="texts">
<h6>{{ item.title }}</h6>
<div class="des" v-html="item.mainBody"></div>
<div class="des"
v-html="item.mainBody"></div>
<span class="meta">{{ item.releaseTime }}</span>
</div>
</li>
</ul>
<div class="all-link" @click="toAll(modules[5].form)">
<span>{{$t('column.all')}} <img class="icon" src="@/assets/images/arrow.png" alt=""></span>
<div class="all-link"
@click="toAll(modules[5].form)">
<span>{{$t('column.all')}} <img class="icon"
src="@/assets/images/arrow.png"
alt=""></span>
</div>
</div>
</div>
@ -56,15 +88,24 @@
<div class="block">
<div class="inner">
<h2 class="b-title wow fadeInUp">{{ 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="people">
<template v-for="(item, i) in modules[7].list">
<li v-if="item.isEnable" :key="i" class="wow fadeInDown" :data-wow-delay="(0.4 * i).toFixed(1) + 's'">
<img class="pic" :src="item.pic" alt="">
<li v-if="item.isEnable"
:key="i"
class="wow fadeInDown"
:data-wow-delay="(0.4 * i).toFixed(1) + 's'">
<img class="pic"
:src="item.pic"
alt="">
<div class="texts">
<h6>{{ item.title }}</h6>
<p class="des">{{ item.des }}</p>
<img src="@/assets/images/arrow.png" alt="" :class="{'arrow': isLink(item.link.linkName)}" @click="openLink(item)" >
<img src="@/assets/images/arrow.png"
alt=""
:class="{'arrow': isLink(item.link.linkName)}"
@click="openLink(item)">
</div>
</li>
</template>
@ -72,41 +113,72 @@
</div>
</div>
<div class="about" :class="{'cursor-pointer': isLink(modules[8].form.link.linkName)}" @click="openLink(modules[8].form)">
<div class="about"
:class="{'cursor-pointer': isLink(modules[8].form.link.linkName)}"
@click="openLink(modules[8].form)">
<div class="inner">
<img class="wow fadeInUp" src="@/assets/images/about.png" alt="">
<div class="line wow fadeInUp" data-wow-delay="0.4s"></div>
<div class="text wow fadeInUp" data-wow-delay="0.7s">{{ modules[8].form.title }}</div>
<div class="des wow fadeInDown" data-wow-delay="1s" v-html="modules[8].form.des"></div>
<img class="wow fadeInUp"
src="@/assets/images/about.png"
alt="">
<div class="line wow fadeInUp"
data-wow-delay="0.4s"></div>
<div class="text wow fadeInUp"
data-wow-delay="0.7s">{{ modules[8].form.title }}</div>
<div class="des wow fadeInDown"
data-wow-delay="1s"
v-html="modules[8].form.des"></div>
</div>
</div>
<div class="block" style="padding-bottom: 0">
<div class="block"
style="padding-bottom: 0">
<div class="inner">
<h2 class="glance wow fadeInUp">{{ modules[9].form.title }}</h2>
<ul class="stat">
<li class="wow fadeInRight" data-wow-delay="0.2s">
<li class="wow fadeInRight"
data-wow-delay="0.2s">
<!-- <p class="num">{{ modules[10].form.title }}</p> -->
<animate-number class="num" ref="num1" from="0" :to="modules[10].form.title" duration="3000" />
<animate-number class="num"
ref="num1"
from="0"
:to="modules[10].form.title"
duration="3000" />
<p class="text">{{ modules[10].form.des }}</p>
</li>
<li class="wow fadeInRight" data-wow-delay="0.4s">
<animate-number class="num" ref="num2" from="0" :to="modules[11].form.title" duration="3000" />
<li class="wow fadeInRight"
data-wow-delay="0.4s">
<animate-number class="num"
ref="num2"
from="0"
:to="modules[11].form.title"
duration="3000" />
<p class="text">{{ modules[11].form.des }}</p>
</li>
<li class="wow fadeInRight" data-wow-delay="0.6s">
<animate-number class="num" ref="num3" from="0" :to="modules[12].form.title" duration="3000" />
<li class="wow fadeInRight"
data-wow-delay="0.6s">
<animate-number class="num"
ref="num3"
from="0"
:to="modules[12].form.title"
duration="3000" />
<p class="text">{{ modules[12].form.des }}</p>
</li>
<li class="wow fadeInRight" data-wow-delay="0.9s">
<animate-number class="num" ref="num4" from="0" :to="modules[13].form.title" duration="3500" />
<li class="wow fadeInRight"
data-wow-delay="0.9s">
<animate-number class="num"
ref="num4"
from="0"
:to="modules[13].form.title"
duration="3500" />
<p class="text">{{ modules[13].form.des }}</p>
</li>
<li class="wow fadeInRight" data-wow-delay="1.2s">
<li class="wow fadeInRight"
data-wow-delay="1.2s">
<p class="num">{{ modules[14].form.title }}</p>
<p class="text">{{ modules[14].form.des }}</p>
</li>
<li class="wow fadeInRight" data-wow-delay="1.5s">
<li class="wow fadeInRight"
data-wow-delay="1.5s">
<p class="num">{{ modules[15].form.title }}</p>
<p class="text">{{ modules[15].form.des }}</p>
</li>
@ -123,7 +195,7 @@ import Util from '@/libs/util'
import WOW from 'wow.js'
export default {
mixins: [mixins],
data() {
data () {
return {
articles: [],
}
@ -132,13 +204,13 @@ export default {
//
window.removeEventListener('scroll', this.handleScroll)
},
mounted() {
mounted () {
new WOW().init()
window.addEventListener('scroll', this.handleScroll)
},
methods: {
//
getInfo() {
getInfo () {
// /
this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
if (data.length) {
@ -147,7 +219,7 @@ export default {
data :
data[data.length - 1][data[data.length - 1].state ? 'theEditedJson' : 'jsonBeforeEditing'])
console.log('JSON=>',json)
console.log('JSON=>', json)
this.modules = json
console.log("🚀 ~ file: index.vue ~ line 138 ~ this.$post ~ this.modules", this.modules)
@ -156,10 +228,10 @@ export default {
if (column.length) {
this.$post(`${this.api.queryArticlesByColumnType}?columnId=${column[column.length - 1]}`).then(({ data }) => {
this.articles = Util.removeTag(data.slice(0, articleNum || 6))
}).catch(err => {})
}).catch(err => { })
}
}
}).catch(err => {})
}).catch(err => { })
},
//
handleScroll () {
@ -177,13 +249,13 @@ export default {
<style lang="scss" scoped>
@import url(../../plugins/wow/animate.css);
@import "../../styles/page/page.scss";
.carousel{
@import '../../styles/page/page.scss';
.carousel {
height: 100vh;
img{
img {
height: 100%;
}
/deep/.el-carousel__container{
/deep/.el-carousel__container {
height: 100vh;
}
}
@ -202,8 +274,8 @@ export default {
justify-content: space-between;
li {
width: 47%;
transition: .3s;
&:hover{
transition: 0.3s;
&:hover {
margin-top: -0.9375rem;
}
}
@ -214,7 +286,7 @@ export default {
.texts {
padding-left: 1.375rem;
margin-top: 3rem;
border-left: 2px solid #DFE4E9;
border-left: 2px solid #dfe4e9;
}
h6 {
min-height: 4.5rem;
@ -249,11 +321,11 @@ export default {
background-color: #fff;
cursor: pointer;
overflow: hidden;
transition: .3s;
transition: 0.3s;
&:nth-child(odd) {
margin-right: 1.75rem;
}
&:hover{
&:hover {
transform: scale(1.05);
}
}
@ -267,7 +339,7 @@ export default {
}
h6 {
font-size: 1.28rem;
color: #0648A8;
color: #0648a8;
@include ellipsis;
}
.des {
@ -307,12 +379,12 @@ export default {
.pic {
width: 47%;
height: auto;
transition: .3s;
transition: 0.3s;
}
.texts {
width: 48%;
padding-top: 8.5rem;
transition: .3s;
transition: 0.3s;
}
h6 {
font-size: 1.8rem;
@ -331,7 +403,7 @@ export default {
font-weight: bold;
font-family: SFProDisplay-Bold, SFProDisplay;
text-align: center;
border-bottom: 1px solid #DEDEDE;
border-bottom: 1px solid #dedede;
}
.stat {
display: flex;
@ -341,9 +413,9 @@ export default {
li {
width: 27%;
margin-bottom: 50px;
transition: .3s;
transition: 0.3s;
&:hover {
transform: translateX(20px)
transform: translateX(20px);
}
}
.num {
@ -351,7 +423,7 @@ export default {
font-family: toppan;
font-size: 2.7rem;
font-weight: 800;
color: #035CE1;
color: #035ce1;
line-height: 49px;
}
.text {
@ -389,24 +461,24 @@ export default {
color: #fff;
line-height: 42px;
text-align: center;
background: rgba(111, 69, 36, .56);
background: rgba(111, 69, 36, 0.56);
border-radius: 17px;
overflow: visible;
transition: .3s;
transition: 0.3s;
&:hover {
background: rgba(239, 126, 10, .56);
background: rgba(239, 126, 10, 0.56);
transform: translateY(10px);
}
}
}
@media (min-width: 280px) and (max-width: 1200px) {
.carousel{
.carousel {
height: 21.87rem;
img{
img {
height: 100%;
}
/deep/.el-carousel__container{
/deep/.el-carousel__container {
height: 21.87rem;
}
}
@ -415,18 +487,18 @@ export default {
font-size: 1rem;
}
}
.el-carousel__item{
.el-carousel__item {
height: 21.87rem;
img {
height: 21.87rem;
}
}
.block{
.block {
padding: 3.125rem 0;
.inner{
.inner {
width: 95%;
margin: 0 auto;
.b-title{
.b-title {
font-size: 2rem;
margin-bottom: 1.25rem;
}
@ -438,7 +510,7 @@ export default {
}
.card {
flex-direction: column;
li{
li {
margin-top: 1.25rem;
width: 100%;
}
@ -448,7 +520,7 @@ export default {
li {
width: 100%;
margin-bottom: 15px;
img{
img {
width: 10rem;
}
.texts {
@ -456,22 +528,20 @@ export default {
}
}
}
.people{
li{
.people {
li {
flex-direction: column;
margin-bottom: 1.25rem;
.pic {
width: 100%;
height: 21.875rem;
}
.texts{
.texts {
padding-top: 1.25rem;
width: 100%;
}
}
}
}
}
.card .pic {
@ -483,7 +553,7 @@ export default {
.inner {
width: 95%;
margin: 0 auto;
.line{
.line {
margin: 1.25rem 0 1.25rem;
}
.des {
@ -495,24 +565,22 @@ export default {
.glance {
padding-bottom: 1.25rem;
}
.stat{
.stat {
flex-direction: column;
li {
width: 100%;
text-align: center;
}
}
}
@media (min-width: 751px) and (max-width: 920px) {
.news {
flex-direction: column;
li {
width: 100%;
margin-bottom: .9375rem;
img{
margin-bottom: 0.9375rem;
img {
width: 10rem;
}
.texts {
@ -524,18 +592,17 @@ export default {
@media (max-width: 320px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 15rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 15rem;
}
/deep/ .el-carousel__item {
height: 15rem;
img{
img {
height: 15rem;
}
}
}
.block {
@ -546,7 +613,7 @@ export default {
}
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
@ -556,7 +623,7 @@ export default {
}
.texts {
margin-top: 1.2rem;
h6{
h6 {
font-size: 1.2rem;
margin-bottom: 1rem;
}
@ -570,7 +637,7 @@ export default {
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}
@ -587,7 +654,6 @@ export default {
}
}
}
}
}
.about {
@ -600,18 +666,17 @@ export default {
}
@media (min-width: 320px) and (max-width: 375px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 15rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 15rem;
}
/deep/ .el-carousel__item {
height: 15rem;
img{
img {
height: 15rem;
}
}
}
.block {
@ -619,7 +684,7 @@ export default {
.inner {
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
@ -629,14 +694,13 @@ export default {
}
.texts {
margin-top: 1.2rem;
}
}
}
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}
@ -660,18 +724,17 @@ export default {
}
@media (min-width: 375px) and (max-width: 480px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 15rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 15rem;
}
/deep/ .el-carousel__item {
height: 15rem;
img{
img {
height: 15rem;
}
}
}
.block {
@ -679,7 +742,7 @@ export default {
.inner {
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
@ -689,14 +752,13 @@ export default {
}
.texts {
margin-top: 1.2rem;
}
}
}
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}
@ -720,18 +782,17 @@ export default {
}
@media (min-width: 480px) and (max-width: 640px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 18rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 18rem;
}
/deep/ .el-carousel__item {
height: 18rem;
img{
img {
height: 18rem;
}
}
}
.block {
@ -739,7 +800,7 @@ export default {
.inner {
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
@ -749,14 +810,13 @@ export default {
}
.texts {
margin-top: 1.2rem;
}
}
}
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}
@ -778,18 +838,17 @@ export default {
}
@media (min-width: 640px) and (max-width: 768px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 20rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 20rem;
}
/deep/ .el-carousel__item {
height: 20rem;
img{
img {
height: 20rem;
}
}
}
.block {
@ -797,7 +856,7 @@ export default {
.inner {
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
@ -807,14 +866,13 @@ export default {
}
.texts {
margin-top: 1.2rem;
}
}
}
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}
@ -842,18 +900,17 @@ export default {
}
@media (min-width: 768px) and (max-width: 980px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 22rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 22rem;
}
/deep/ .el-carousel__item {
height: 22rem;
img{
img {
height: 22rem;
}
}
}
.block {
@ -861,27 +918,25 @@ export default {
.inner {
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
flex-direction: row;
li {
width: 47%;
.pic {
height: auto;
}
.texts {
margin-top: 1.2rem;
}
}
}
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}
@ -917,18 +972,17 @@ export default {
}
@media (min-width: 980px) and (max-width: 1200px) {
.wrap {
/deep/ .el-carousel{
/deep/ .el-carousel {
height: 25rem;
}
/deep/ .el-carousel__container{
/deep/ .el-carousel__container {
height: 25rem;
}
/deep/ .el-carousel__item {
height: 25rem;
img{
img {
height: 25rem;
}
}
}
.block {
@ -936,27 +990,25 @@ export default {
.inner {
.intro {
margin-bottom: 1rem;
font-size: .95rem;
font-size: 0.95rem;
line-height: 1rem;
}
.card {
flex-direction: row;
li {
width: 47%;
.pic {
height: auto;
}
.texts {
margin-top: 1.2rem;
}
}
}
.news {
li {
padding: 1.2rem;
img{
img {
width: 8rem;
}
}

@ -1,13 +1,24 @@
<template>
<div class="wrap">
<div class="iasf-banner">
<img :src="modules[0].form.pic"
alt="">
<el-carousel class="carousel"
:interval="6000"
:arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'"
:indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
<template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable"
:key="i">
<img :class="[{'cursor-pointer': isLink(item.link.linkName)}]"
width="100%"
:src="item.pic"
alt=""
@click="openLink(item)">
<div class="texts">
<h6>{{ modules[0].form.title }}</h6>
<p class="text">{{ modules[0].form.des }}</p>
</div>
<h6>{{ item.title }}</h6>
<p class="text">{{ item.des }}</p>
</div>
</el-carousel-item>
</template>
</el-carousel>
<div class="block"
style="padding-top: 110px">
@ -78,8 +89,10 @@
:src="item.titleImg"
alt="">
<div class="texts">
<h6>{{ item.title }}</h6>
<div class="des"
v-html="item.mainBody"></div>
<p class="meta">{{ item.releaseTime }} {{ item.classificationName && ' | ' + item.classificationName }}</p>
<div class="des">{{ item.title }}</div>
</div>
</li>
</template>
@ -414,15 +427,17 @@ export default {
<style lang="scss" scoped>
@import url(../../plugins/wow/animate.css);
@import '../../styles/page/page.scss';
.iasf-banner {
height: 727px;
.carousel {
height: 100vh;
img {
width: 100%;
height: 100%;
}
/deep/.el-carousel__container {
height: 100vh;
}
.texts {
position: absolute;
bottom: 40%;
bottom: 20%;
left: 120px;
h6,
.text {
@ -451,6 +466,10 @@ export default {
margin-bottom: 3.6rem;
}
}
.inner {
width: 1370px;
min-width: 70%;
}
.card {
display: flex;
justify-content: space-between;
@ -569,12 +588,14 @@ export default {
color: #666;
}
h6 {
margin-top: 5px;
font-size: 1.1rem;
font-family: PingFangSC-Semibold, PingFang SC;
color: #333;
@include mul-ellipsis(2);
}
.des {
margin: 15px 0;
}
}
.news-carousel {
display: flex;
@ -607,12 +628,12 @@ export default {
cursor: pointer;
}
.meta {
margin: 8px 0;
margin: 14px 0;
font-size: 0.9rem;
color: rgba(255, 255, 255, 0.86);
}
.des {
margin-bottom: 8px;
margin-bottom: 14px;
font-size: 1rem;
font-family: PingFangSC-Medium, PingFang SC;
cursor: pointer;
@ -698,7 +719,7 @@ export default {
.talent {
display: flex;
color: #fff;
background: #1a2844;
background: #1583ff;
border-radius: 0px 100px 0px 100px;
.left {
width: 50%;
@ -791,8 +812,9 @@ export default {
}
}
.tools {
z-index: 10;
position: fixed;
top: 430px;
top: 60vh;
right: 0;
li {
display: flex;
@ -815,6 +837,11 @@ export default {
margin-right: 10px;
}
}
@media (max-width: 1450px) {
.inner {
width: 95%;
}
}
@media (max-width: 1200px) {
.card {
flex-direction: column;
@ -877,10 +904,5 @@ export default {
}
}
@media (max-width: 1200px) {
.iasf-banner {
.texts {
left: 3%;
}
}
}
</style>

@ -29,6 +29,10 @@
font-family: ProximaNova;
src: url('font/ProximaNova-Regular.otf');
}
@font-face {
font-family: AlimamaShuHeiTi-Bold;
src: url('font/AlimamaShuHeiTi-Bold.otf');
}
[v-cloak] {
display: none;

Loading…
Cancel
Save