jialong.yu
/
FE_IASF_client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

英文版适配80%

Browse Source
mobile
wangchenguang 2 years ago
parent 36e6c6a385
commit 24c64a4874
15 changed files with 1137 additions and 345 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      src/App.vue
  2. 36
      src/components/menuTree/tree.vue
  3. 30
      src/layouts/footer/index.vue
  4. 73
      src/layouts/header/index.vue
  5. 126
      src/pages/about/index.vue
  6. 104
      src/pages/application/index.vue
  7. 47
      src/pages/careers/index.vue
  8. 593
      src/pages/column/index.vue
  9. 32
      src/pages/edu/index.vue
  10. 132
      src/pages/home/index.vue
  11. 188
      src/pages/news/index.vue
  12. 27
      src/pages/newsPress/index.vue
  13. 56
      src/pages/newsProcurement/index.vue
  14. 3
      src/pages/overviewLocation/index.vue
  15. 24
      src/pages/research/index.vue

1
src/App.vue
Unescape View File

@ -33,7 +33,6 @@ export default {
return flagPc; return flagPc;
} }
var flagZt = IsPC(); var flagZt = IsPC();
console.log(flagZt)
this.$store.commit('updateModelType', flagZt) this.$store.commit('updateModelType', flagZt)
} }
}; };

36
src/components/menuTree/tree.vue
Unescape View File

@ -1,36 +0,0 @@
<template>
<div class="menu-child">
<template v-for="item in this.menuList">
<el-submenu :popper-class="$route.path === '/home' || $route.path === '/sfel' ? 'home-menu-popup' : ''" :class="{active: $route.query.id == item.id}" :key="item.id" :index="String(item.id)" :id="item.id" v-if="item.children && item.children.length">
<template slot="title">
<span slot="title" :id="item.id">{{item.columnName}}</span>
</template>
<!-- <menuTree :menuList="item.children"></menuTree> -->
</el-submenu>
<el-menu-item :key="item.id" :id="item.id" :index="String(item.id)" :class="{active: $route.query.id == item.id}" v-else>
<span slot="title" :id="item.id">{{item.columnName}}</span>
</el-menu-item>
</template>
</div>
</template>
<script>
export default {
name: 'menuTree',
props: {
menuList: {
type: Array,
default: []
}
},
data () {
return {}
},
mounted () {},
methods: {}
}
</script>
<style lang="scss" scoped>
</style>

30
src/layouts/footer/index.vue
Unescape View File

@ -2,7 +2,7 @@
<div> <div>
<div v-if="showDefaultPath.includes($route.path)" class="footer"> <div v-if="showDefaultPath.includes($route.path)" class="footer">
<div class="info"> <div class="info">
<div style="margin-right: 100px"> <div class="leftBox">
<img class="m-b-20" src="@/assets/images/iasf.png" alt=""> <img class="m-b-20" src="@/assets/images/iasf.png" alt="">
<p class="meta">Copyright ©2002- 2021</p> <p class="meta">Copyright ©2002- 2021</p>
<p class="meta">Institute of Advanced Science Facilities, ShenzhenIASF</p> <p class="meta">Institute of Advanced Science Facilities, ShenzhenIASF</p>
@ -92,6 +92,9 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.leftBox{
margin-right: 100px;
}
.footer{ .footer{
padding: 64px 10% 25px; padding: 64px 10% 25px;
color: #fff; color: #fff;
@ -199,7 +202,7 @@ export default {
} }
} }
} }
@media (max-width: 992px) { @media (max-width: 1200px) {
body{ body{
width: 100% !important; width: 100% !important;
} }
@ -217,6 +220,29 @@ export default {
margin-top: 90px; margin-top: 90px;
} }
} }
}
@media (min-width: 280px) and (max-width: 750px) {
.footer {
.info{
flex-direction: column;
.column{
margin-top: 20px;
margin-left: 0;
}
}
}
}
@media (min-width: 751px) and (max-width: 1200px) {
.footer {
.info{
flex-direction: column;
.column{
margin-top: 20px;
margin-left: 0;
}
}
}
} }
</style> </style>

73
src/layouts/header/index.vue
Unescape View File

@ -3,50 +3,16 @@
<a class="logo" @click="toIndex"> <a class="logo" @click="toIndex">
<img :src="require('@/assets/images/' + (isSfel ? 'logo2' : isHome ? 'logo' : 'logo-black') + '.png')" alt=""> <img :src="require('@/assets/images/' + (isSfel ? 'logo2' : isHome ? 'logo' : 'logo-black') + '.png')" alt="">
</a> </a>
<!-- <template v-if="$store.getters.getModelType"> --> <navbar ref="nav" :isHome.sync="isHome"></navbar>
<navbar ref="nav" :isHome.sync="isHome"></navbar> <div class="tools">
<div class="tools"> <img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch">
<img class="search" :src="require('@/assets/images/search' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleSearch"> <img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang">
<img :src="require('@/assets/images/cn' + (isHome ? '-white' : '') + '.png')" alt="" @click.stop="toggleLang"> <div v-if="showSearch" class="search-wrap" @click.stop="stop">
<div v-if="showSearch" class="search-wrap" @click.stop="stop"> <input ref="search" type="text" :placeholder="$t('column.titlePlaceholder')" v-model="title">
<input ref="search" type="text" :placeholder="$t('column.titlePlaceholder')" v-model="title"> <img class="search-icon" src="@/assets/images/search.png" alt="" @click="handleSearch">
<img class="search-icon" src="@/assets/images/search.png" alt="" @click="handleSearch"> <i class="el-icon-close close-icon" @click="showSearch = false"></i>
<i class="el-icon-close close-icon" @click="showSearch = false"></i>
</div>
</div> </div>
<!-- </template> --> </div>
<!-- <template v-else>
<i class="el-icon-s-fold rightNavBox"></i>
</template>
<div class="btnsBox">
<el-menu
default-active="2"
class="el-menu-vertical-demo"
@open="handleOpen"
@close="handleClose">
<el-submenu index="1">
<template slot="title">
<span>导航一</span>
</template>
<el-menu-item index="1-1">选项1</el-menu-item>
<el-menu-item index="1-2">选项2</el-menu-item>
<el-submenu index="1-4">
<template slot="title">选项4</template>
<el-menu-item index="1-4-1">选项1</el-menu-item>
</el-submenu>
</el-submenu>
<el-menu-item index="2">
<span slot="title">导航二</span>
</el-menu-item>
<el-menu-item index="3">
<span slot="title">导航三</span>
</el-menu-item>
<el-menu-item index="4">
<span slot="title">导航四</span>
</el-menu-item>
</el-menu>
</div> -->
</div> </div>
</template> </template>
<script> <script>
@ -134,6 +100,7 @@ $height: 90px;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
min-width: $min-width;
height: $height; height: $height;
box-sizing: content-box; box-sizing: content-box;
&:not(.channel) { &:not(.channel) {
@ -164,13 +131,6 @@ $height: 90px;
margin-right: 43px; margin-right: 43px;
} }
} }
.rightNavBox{
font-size: 50px;
position: absolute;
right: 20px;
top: 20px;
}
.search-wrap { .search-wrap {
position: absolute; position: absolute;
top: 67px; top: 67px;
@ -215,17 +175,4 @@ $height: 90px;
} }
} }
} }
.btnsBox{
width: 100%;
height: 300px;
overflow: hidden;
overflow-y: scroll;
position: absolute;
top: 90px;
left: 0;
background-color: white;
z-index: 99;;
}
</style> </style>

126
src/pages/about/index.vue
Unescape View File

@ -1,5 +1,5 @@
<template> <template>
<div class="wrap"> <div class="wrap" v-if="modules.length>=1">
<el-carousel height="480px" :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'"> <el-carousel height="480px" :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"> <template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i"> <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
@ -446,4 +446,128 @@ export default {
width: 98%; width: 98%;
} }
} }
@media (max-width: 1200px) {
.texts {
flex-direction: column;
.left{
width: 100%;
h2{
font-size: 20px;
}
}
.bg{
margin: 0;
width: 100%;
height: 450px;
}
}
.block{
padding: 50px 0;
.intro{
margin-bottom: 50px;
}
.inner {
.card{
flex-direction: column;
li {
width: 100%;
}
}
}
}
.gray {
.inner{
.stat{
flex-direction: column;
li{
width: 100%;
text-align: center;
}
}
}
}
.plan{
.inner{
flex-direction: column;
.pic{
width: 95%;margin: 0 auto;
}
.texts {
width: 100%;
text-align: center;
}
}
}
.block {
.inner {
.b-title {
font-size: 1.5rem;
}
.people{
.wow {
flex-direction: column;
.pic {
width: 95%;
margin: 0 auto;
}
.texts{
padding-top: 50px;
width: 100%;
}
}
}
.list{
flex-direction: column;
.wow {
width: 100%;
}
}
.staff {
flex-direction: column;
.left{
width: 100%;
h6 {
font-size: 20px;
}
.des{
font-size: 15px;
}
}
.pic {
width: 95%;margin: 0 auto;
height: 400px;
}
}
}
}
}
@media (min-width: 280px) and (max-width: 750px) {
.inner{
.texts {
.bg {
height: 350px;
}
}
.card {
li {
h6 {
font-size: 2rem;
}
}
}
.people{
li {
margin-bottom: 30px;
.pic {
height: 350px;
}
}
}
}
}
</style> </style>

104
src/pages/application/index.vue
Unescape View File

@ -1,5 +1,5 @@
<template> <template>
<div class="wrap"> <div class="wrap" v-if="modules.length>=1">
<el-carousel height="480px" :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'"> <el-carousel height="480px" :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"> <template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i"> <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
@ -288,4 +288,106 @@ export default {
width: 1558px; width: 1558px;
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.block{
padding: 50px 0;
.inner{
width: 95%;
margin: 0 auto;
.texts{
flex-direction: column;
.left {
width: 100%;
}
.bg{
margin: 0;
width: 100%;
height: 450px;
}
}
}
.app{
li {
width: 100%;
}
}
.intro {
margin-bottom: 30px;
}
.group{
flex-direction: column;
li {
width: 100%;
}
}
.news{
flex-direction: column;
li {
width: 95%;
margin: 0 auto;
flex-direction: column;
img{
width: 100%;
height: 200px;
}
.texts{
margin-left: 0;
margin-top: 20px;
}
}
}
}
}
@media (max-width: 1200px) {
.block{
padding: 50px 0;
.inner{
width: 95%;
margin: 0 auto;
.texts{
flex-direction: column;
.left {
width: 100%;
}
.bg{
margin: 0;
width: 100%;
height: 450px;
}
}
}
.app{
li {
width: 100%;
}
}
.intro {
margin-bottom: 30px;
}
.group{
flex-direction: column;
li {
width: 100%;
}
}
.news{
flex-direction: column;
li {
width: 95%;
margin: 0 auto;
flex-direction: column;
img{
width: 100%;
height: 200px;
}
.texts{
margin-left: 0;
margin-top: 20px;
}
}
}
}
}
</style> </style>

47
src/pages/careers/index.vue
Unescape View File

@ -195,7 +195,7 @@ export default {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
.comma { .comma {
left: 660px; left: 70%;
} }
.pic { .pic {
left: 0; left: 0;
@ -292,4 +292,49 @@ export default {
transition: .3s; transition: .3s;
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.block{
padding: 50px 0;
.inner {
width: 95%;margin: 0 auto;
.card{
flex-direction: column;
li{
margin-top: 20px;
width: 100%;
height: 450px;
}
}
.people{
li {
padding: 200px 20px 30px;
.left {
width: 100%;
}
.pic{
top: -60px;
right: 13px;
width: 55%;
height: 230px;
}
}
}
}
}
.shows{
li {
flex-direction: column;
align-items:flex-start;
height: 450px;
.left {
padding: 10px ;
h6{
font-size: 2rem;
overflow: hidden;
}
}
}
}
}
</style> </style>

593
src/pages/column/index.vue
View File

File diff suppressed because it is too large Load Diff

32
src/pages/edu/index.vue
Unescape View File

@ -150,4 +150,36 @@ export default {
} }
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.block{
padding: 50px 0;
.inner {
width: 95%;margin: 0 auto;
.b-title{
margin-bottom: 30px;
}
.intro {
margin-bottom: 30px;
}
.block-pic{
height: 450px;
}
}
.list{
li {
margin-top: 20px;
.pic{
width: 100%;height: 450px;
}
.texts{
padding: 10px;
width: 70%;
top: 80px;
height: auto;
left: 24%;
}
}
}
}
}
</style> </style>

132
src/pages/home/index.vue
Unescape View File

@ -1,9 +1,9 @@
<template> <template>
<div class="wrap"> <div class="wrap" v-if="modules.length>=1">
<el-carousel height="959px" :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'"> <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"> <template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i"> <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
<img :class="[{'cursor-pointer': isLink(item.link.linkName)}]" width="100%" height="959" :src="item.pic" alt="" @click="openLink(item)"> <img :class="[{'cursor-pointer': isLink(item.link.linkName)}]" width="100%" :src="item.pic" alt="" @click="openLink(item)">
</el-carousel-item> </el-carousel-item>
</template> </template>
</el-carousel> </el-carousel>
@ -146,7 +146,7 @@ export default {
const json = JSON.parse(this.preview ? const json = JSON.parse(this.preview ?
data : data :
data[data.length - 1][data[data.length - 1].state ? 'theEditedJson' : 'jsonBeforeEditing']) data[data.length - 1][data[data.length - 1].state ? 'theEditedJson' : 'jsonBeforeEditing'])
this.modules = json this.modules = json
console.log("🚀 ~ file: index.vue ~ line 138 ~ this.$post ~ this.modules", this.modules) console.log("🚀 ~ file: index.vue ~ line 138 ~ this.$post ~ this.modules", this.modules)
// 获取文章列表 // 获取文章列表
@ -176,6 +176,16 @@ 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";
.carousel{
height: 959px;
img{
height: 100%;
}
/deep/.el-carousel__container{
height: 959px ;
}
}
.card { .card {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -363,4 +373,118 @@ export default {
} }
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.carousel{
height: 350px;
img{
height: 100%;
}
/deep/.el-carousel__container{
height: 350px ;
}
}
.el-carousel__item{
height: 350px;
img {
height: 350px;
}
}
.block{
padding: 50px 0;
.inner{
width: 95%;
margin: 0 auto;
.b-title{
font-size: 2rem;
margin-bottom: 20px;
}
.wow {
font-size: 1.5rem;
}
.intro {
margin-bottom: 20px;
}
.card {
flex-direction: column;
li{
margin-top: 20px;
width: 100%;
}
}
.news {
flex-direction: column;
li {
width: 100%;
margin-bottom: 15px;
img{
width: 10rem;
}
.texts {
width: calc(100% - 10rem);
}
}
}
.people{
li{
flex-direction: column;
margin-bottom: 20px;
.pic {
width: 100%;
height: 350px;
}
.texts{
padding-top: 20px;
width: 100%;
}
}
}
}
}
.about {
width: 100%;
padding: 20px 0 30px;
.inner {
width: 95%;
margin: 0 auto;
.line{
margin: 20px 0 20px;
}
.des {
margin-top: 20px;
padding: 10px 20px;
}
}
}
.glance {
padding-bottom: 20px;
}
.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: 15px;
img{
width: 10rem;
}
.texts {
width: calc(100% - 10rem);
}
}
}
}
</style> </style>

188
src/pages/news/index.vue
Unescape View File

@ -11,9 +11,9 @@
</template> </template>
</el-carousel> </el-carousel>
<ul class="tabs wow fadeInLeft"> <ul class="tabs wow fadeInLeft" ref="tabs">
<template v-for="(item, i) in modules[1].list"> <template v-for="(item, i) in modules[1].list">
<li v-if="item.columnName" :class="{active: i == curColumn}" :key="i" @click="tabChange(i)">{{ item.columnName }}</li> <li v-if="item.columnName" :class="{active: i == curColumn}" :key="i" @click="tabChange($event,i)">{{ item.columnName }}</li>
</template> </template>
</ul> </ul>
@ -208,6 +208,7 @@ export default {
} }
this.modules = json this.modules = json
console.log(this.modules)
this.carouselInterval() this.carouselInterval()
} }
}).catch(err => {}) }).catch(err => {})
@ -229,7 +230,10 @@ export default {
} }
}, },
// tab回调 // tab回调
tabChange(i) { tabChange(e,i) {
const tabs = this.$refs.tabs
tabs.scrollLeft = e.target.offsetLeft
// e.target.offsetLeft
const { column } = this.modules[1].list[i] const { column } = this.modules[1].list[i]
if (column && column.length) { if (column && column.length) {
const id = column[column.length - 1] const id = column[column.length - 1]
@ -626,4 +630,182 @@ export default {
width: 98%; width: 98%;
} }
} }
@media (max-width: 1200px) {
.tabs {
overflow-x: scroll;
display: -webkit-box;
}
.block {
padding: 50px 0 ;
.inner{
.more {
width: 100%;
margin: 20px auto 0;
}
.news-banner{
flex-direction: column;
img{
width: 100%;
}
.right {
margin-top: 10px;
width: 100%;
.inds{
left: 50%;
margin-left: -43px;
}
}
}
.card{
flex-direction: column;
.wow {
width: 95%;
margin: 20px auto;
}
}
.b-title{
font-size: 20px;
}
.intro {
font-size: 15px;
margin-bottom: 50px;
}
.shop-shows{
flex-direction: column;
.left {
width: 95%;margin: 0 auto;
}
.right {
width: 93%;
margin: 20px auto;
.show-card{
flex-direction: column;
li {
width: 100%;
.pic{
width: 100%;
}
}
}
.card-list{
li {
.texts{
margin-right: 30px;
}
}
}
}
}
}
}
}
@media (min-width: 280px) and (max-width: 750px) {
.tabs {
li {
padding: 15px 10px;
font-size: 15px;
margin: 0;
}
}
.block{
padding: 20px 0;
.inner {
width: 90%;
.news-banner{
img{
height: 350px;
}
}
.b-title{
margin-bottom: 20px;
}
.intro {
margin-bottom: 20px;
}
.shop-shows{
.left {
img{
height: 350px;
}
}
}
.show-card{
.text{
font-size: 13px;
line-height: 20px;
white-space: inherit
}
}
.card-list{
padding: 20px 10px ;
li {
width: 100%;
img{
margin-right: 10px;
}
.texts{
margin-right: 10px;
h6{
font-size: 15px;
font-weight: bold;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
text-overflow: ellipsis;
overflow: hidden;
margin-bottom: 5px;
}
}
.des {
line-height: 15px;
}
.arrow{
margin-right: 0;
}
}
}
.shows{
flex-direction: column;
.left {
width: 100%;
.pic {
height: 450px;
}
}
.card-list{
width: 100%;
padding: 20px 0;
li {
.pic {
width: 100px;
height: 120px;
}
.texts{
h6{
font-size: 15px;font-weight: bold;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
text-overflow: ellipsis;
overflow: hidden;
}
.text{
margin: 2px 0;
font-size: 12px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
text-overflow: ellipsis;
overflow: hidden;
}
}
}
}
}
}
}
}
</style> </style>

27
src/pages/newsPress/index.vue
Unescape View File

@ -169,4 +169,31 @@ export default {
} }
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.inner{
width: 95%;
.list{
li {
margin-top: 20px;
.pic {
width: 100%;
height: 500px;
}
.texts {
padding: 20px 10px 10px ;
top: 30px;
h6{
font-size: 2rem;
}
.sub{
margin: 10px 0;
}
.des{
margin-bottom: 10px;
}
}
}
}
}
}
</style> </style>

56
src/pages/newsProcurement/index.vue
Unescape View File

@ -165,4 +165,60 @@ export default {
} }
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.inner{
width: 95%;
.list{
li {
margin-top: 20px;
.pic {
width: 100%;
height: 500px;
}
.texts {
padding: 20px 10px 10px ;
top: 30px;
h6{
font-size: 2rem;
}
.sub{
margin: 10px 0;
}
.des{
margin-bottom: 10px;
}
}
}
}
}
}
@media (max-width: 1200px) {
.inner{
width: 95%;
.list{
li {
margin-top: 20px;
.pic {
width: 100%;
height: 500px;
}
.texts {
padding: 20px 10px 10px ;
top: 30px;
h6{
font-size: 2rem;
}
.sub{
margin: 10px 0;
}
.des{
margin-bottom: 10px;
}
}
}
}
}
}
</style> </style>

3
src/pages/overviewLocation/index.vue
Unescape View File

@ -107,6 +107,9 @@ export default {
white-space: normal; white-space: normal;
} }
} }
.tab-content{
width: 90%;
}
} }
</style> </style>

24
src/pages/research/index.vue
Unescape View File

@ -1,5 +1,5 @@
<template> <template>
<div class="wrap"> <div class="wrap" v-if="modules.length>=1">
<el-carousel height="480px" :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'"> <el-carousel height="480px" :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"> <template v-for="(item, i) in modules[0].list">
<el-carousel-item v-if="item.pic && item.isEnable" :key="i"> <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
@ -238,4 +238,26 @@ export default {
line-height: 26px; line-height: 26px;
} }
} }
@media (min-width: 280px) and (max-width: 750px) {
.block{
padding: 50px 0;
.intro {
margin-bottom: 30px;
}
.area{
flex-direction: column;
li{
width: 95%;margin: 0 auto;
}
}
.group,.news{
flex-direction: column;
li {
width: 95%;
margin: 20px auto;
}
}
}
}
</style> </style>
Write Preview
Loading…
Cancel
Save