|
|
@ -71,33 +71,29 @@ |
|
|
|
<li v-if="i" |
|
|
|
<li v-if="i" |
|
|
|
:key="i" |
|
|
|
:key="i" |
|
|
|
class="wow fadeInDown" |
|
|
|
class="wow fadeInDown" |
|
|
|
:data-wow-delay="(0.1 * i).toFixed(1) + 's'"> |
|
|
|
:data-wow-delay="(0.1 * i).toFixed(1) + 's'" |
|
|
|
|
|
|
|
@click="toArtice(item, modules[4].form)"> |
|
|
|
<img class="pic" |
|
|
|
<img class="pic" |
|
|
|
:src="item.titleImg" |
|
|
|
:src="item.titleImg" |
|
|
|
alt=""> |
|
|
|
alt=""> |
|
|
|
<div class="texts"> |
|
|
|
<div class="texts"> |
|
|
|
<p class="meta">{{ item.releaseTime }} {{ item.classificationName && ' | ' + item.classificationName }}</p> |
|
|
|
<p class="meta">{{ item.releaseTime }} {{ item.classificationName && ' | ' + item.classificationName }}</p> |
|
|
|
<div class="des">{{ item.title }}</div> |
|
|
|
<div class="des">{{ item.title }}</div> |
|
|
|
<img class="arrow" |
|
|
|
|
|
|
|
src="@/assets/images/arrow.png" |
|
|
|
|
|
|
|
alt="" |
|
|
|
|
|
|
|
@click="toArtice(item, modules[4].form)"> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
<ul class="news-carousel"> |
|
|
|
<ul class="news-carousel"> |
|
|
|
<li v-if="articles1.length" |
|
|
|
<li v-if="articles1.length"> |
|
|
|
@click="toArtice(curArticle1, modules[5].form)"> |
|
|
|
|
|
|
|
<img class="pic" |
|
|
|
<img class="pic" |
|
|
|
:src="curArticle1.titleImg" |
|
|
|
src="http://10.10.11.7/images/iasf/8.png" |
|
|
|
alt=""> |
|
|
|
alt=""> |
|
|
|
<div class="texts"> |
|
|
|
<div class="texts"> |
|
|
|
<h6>{{ curArticle1.title }}</h6> |
|
|
|
<h6 @click="toAll(modules[5].form)">{{ getColumnTitle(modules[5].form) }}</h6> |
|
|
|
<p class="meta">{{ curArticle1.source }}</p> |
|
|
|
<p class="meta">{{ curArticle1.source }}</p> |
|
|
|
<div class="des" |
|
|
|
<div class="des" |
|
|
|
v-html="curArticle1.mainBody"></div> |
|
|
|
@click="toArtice(curArticle1, modules[5].form)">{{ curArticle1.title }}</div> |
|
|
|
<p class="date">{{ curArticle1.releaseTime }}</p> |
|
|
|
<p class="date">{{ curArticle1.releaseTime }}</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="action"> |
|
|
|
<div class="action"> |
|
|
@ -113,16 +109,15 @@ |
|
|
|
@click.stop="nextCarousel(1)"></i> |
|
|
|
@click.stop="nextCarousel(1)"></i> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li v-if="articles2.length" |
|
|
|
<li v-if="articles2.length"> |
|
|
|
@click="toArtice(curArticle2, modules[6].form)"> |
|
|
|
|
|
|
|
<img class="pic" |
|
|
|
<img class="pic" |
|
|
|
:src="curArticle2.titleImg" |
|
|
|
src="http://10.10.11.7/images/iasf/9.png" |
|
|
|
alt=""> |
|
|
|
alt=""> |
|
|
|
<div class="texts"> |
|
|
|
<div class="texts"> |
|
|
|
<h6>{{ curArticle2.title }}</h6> |
|
|
|
<h6 @click="toAll(modules[6].form)">{{ getColumnTitle(modules[6].form) }}</h6> |
|
|
|
<p class="meta">{{ curArticle2.source }}</p> |
|
|
|
<p class="meta">{{ curArticle2.classificationName }}</p> |
|
|
|
<div class="des" |
|
|
|
<div class="des" |
|
|
|
v-html="curArticle2.mainBody"></div> |
|
|
|
@click="toArtice(curArticle2, modules[6].form)">{{ curArticle2.title }}</div> |
|
|
|
<p class="date">{{ curArticle2.releaseTime }}</p> |
|
|
|
<p class="date">{{ curArticle2.releaseTime }}</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="action"> |
|
|
|
<div class="action"> |
|
|
@ -138,16 +133,14 @@ |
|
|
|
@click.stop="nextCarousel(2)"></i> |
|
|
|
@click.stop="nextCarousel(2)"></i> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li v-if="articles3.length" |
|
|
|
<li v-if="articles3.length"> |
|
|
|
@click="toArtice(curArticle3, modules[7].form)"> |
|
|
|
|
|
|
|
<img class="pic" |
|
|
|
<img class="pic" |
|
|
|
:src="curArticle3.titleImg" |
|
|
|
src="http://10.10.11.7/images/iasf/10.png" |
|
|
|
alt=""> |
|
|
|
alt=""> |
|
|
|
<div class="texts"> |
|
|
|
<div class="texts"> |
|
|
|
<h6>{{ curArticle3.title }}</h6> |
|
|
|
<h6 @click="toAll(modules[7].form)">{{ getColumnTitle(modules[7].form) }}</h6> |
|
|
|
<p class="meta">{{ curArticle3.source }}</p> |
|
|
|
<div class="des m-t-8" |
|
|
|
<div class="des" |
|
|
|
@click="toArtice(curArticle3, modules[7].form)">{{ curArticle3.title }}</div> |
|
|
|
v-html="curArticle3.mainBody"></div> |
|
|
|
|
|
|
|
<p class="date">{{ curArticle3.releaseTime }}</p> |
|
|
|
<p class="date">{{ curArticle3.releaseTime }}</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="action"> |
|
|
|
<div class="action"> |
|
|
@ -208,6 +201,7 @@ |
|
|
|
<div class="left wow fadeInLeft" |
|
|
|
<div class="left wow fadeInLeft" |
|
|
|
data-wow-delay="0.5s"> |
|
|
|
data-wow-delay="0.5s"> |
|
|
|
<h6>{{ modules[11].form.title }}</h6> |
|
|
|
<h6>{{ modules[11].form.title }}</h6> |
|
|
|
|
|
|
|
<p class="sub-title">{{ modules[11].form.subTitle }}</p> |
|
|
|
<div class="text" |
|
|
|
<div class="text" |
|
|
|
v-html="modules[11].form.des"></div> |
|
|
|
v-html="modules[11].form.des"></div> |
|
|
|
<el-button v-if="isLink(modules[11].form.link.linkName)" |
|
|
|
<el-button v-if="isLink(modules[11].form.link.linkName)" |
|
|
@ -230,7 +224,9 @@ |
|
|
|
<div class="text" |
|
|
|
<div class="text" |
|
|
|
v-html="modules[12].form.des"></div> |
|
|
|
v-html="modules[12].form.des"></div> |
|
|
|
<img src="@/assets/images/arrow-white.png" |
|
|
|
<img src="@/assets/images/arrow-white.png" |
|
|
|
alt=""> |
|
|
|
alt="" |
|
|
|
|
|
|
|
:class="{'arrow': isLink(modules[12].form.link.linkName)}" |
|
|
|
|
|
|
|
@click="openLink(modules[12].form)"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<img class="pic" |
|
|
|
<img class="pic" |
|
|
|
:src="modules[12].form.pic" |
|
|
|
:src="modules[12].form.pic" |
|
|
@ -284,7 +280,12 @@ |
|
|
|
<ul class="tools"> |
|
|
|
<ul class="tools"> |
|
|
|
<li v-for="(item, i) in modules[18].list" |
|
|
|
<li v-for="(item, i) in modules[18].list" |
|
|
|
:key="i" |
|
|
|
:key="i" |
|
|
|
@click="openLink(item)">{{ item.title }}</li> |
|
|
|
@click="openLink(item)"> |
|
|
|
|
|
|
|
<img :src="'http://10.10.11.7/images/iasf/icon' + (i < 4 ? i + 1 : 1) + '.png'" |
|
|
|
|
|
|
|
alt="" |
|
|
|
|
|
|
|
class="icon"> |
|
|
|
|
|
|
|
{{ item.title }} |
|
|
|
|
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
@ -413,14 +414,14 @@ export default { |
|
|
|
@import url(../../plugins/wow/animate.css); |
|
|
|
@import url(../../plugins/wow/animate.css); |
|
|
|
@import '../../styles/page/page.scss'; |
|
|
|
@import '../../styles/page/page.scss'; |
|
|
|
.iasf-banner { |
|
|
|
.iasf-banner { |
|
|
|
height: 600px; |
|
|
|
height: 727px; |
|
|
|
img { |
|
|
|
img { |
|
|
|
width: 100%; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
} |
|
|
|
.texts { |
|
|
|
.texts { |
|
|
|
position: absolute; |
|
|
|
position: absolute; |
|
|
|
top: 30%; |
|
|
|
bottom: 40%; |
|
|
|
left: 120px; |
|
|
|
left: 120px; |
|
|
|
h6, |
|
|
|
h6, |
|
|
|
.text { |
|
|
|
.text { |
|
|
@ -469,16 +470,11 @@ export default { |
|
|
|
border-left: 2px solid #dfe4e9; |
|
|
|
border-left: 2px solid #dfe4e9; |
|
|
|
} |
|
|
|
} |
|
|
|
h6 { |
|
|
|
h6 { |
|
|
|
min-height: 4.5rem; |
|
|
|
|
|
|
|
margin-bottom: 1.56rem; |
|
|
|
margin-bottom: 1.56rem; |
|
|
|
line-height: 2rem; |
|
|
|
line-height: 2rem; |
|
|
|
font-size: 1.368rem; |
|
|
|
font-size: 1.368rem; |
|
|
|
color: #333; |
|
|
|
color: #333; |
|
|
|
display: -webkit-box; |
|
|
|
@include mul-ellipsis(2); |
|
|
|
-webkit-box-orient: vertical; |
|
|
|
|
|
|
|
-webkit-line-clamp: 2; |
|
|
|
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
.des { |
|
|
|
.des { |
|
|
|
font-size: 1.024rem; |
|
|
|
font-size: 1.024rem; |
|
|
@ -554,6 +550,7 @@ export default { |
|
|
|
width: calc((100% - 18px) / 3); |
|
|
|
width: calc((100% - 18px) / 3); |
|
|
|
margin-right: 9px; |
|
|
|
margin-right: 9px; |
|
|
|
background-color: #fff; |
|
|
|
background-color: #fff; |
|
|
|
|
|
|
|
cursor: pointer; |
|
|
|
&:nth-child(3n) { |
|
|
|
&:nth-child(3n) { |
|
|
|
margin-right: 0; |
|
|
|
margin-right: 0; |
|
|
|
} |
|
|
|
} |
|
|
@ -563,7 +560,7 @@ export default { |
|
|
|
height: 220px; |
|
|
|
height: 220px; |
|
|
|
} |
|
|
|
} |
|
|
|
.texts { |
|
|
|
.texts { |
|
|
|
padding: 20px 24px; |
|
|
|
padding: 20px 24px 50px; |
|
|
|
background-color: #fff; |
|
|
|
background-color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
.meta { |
|
|
|
.meta { |
|
|
@ -583,9 +580,8 @@ export default { |
|
|
|
li { |
|
|
|
li { |
|
|
|
position: relative; |
|
|
|
position: relative; |
|
|
|
width: calc((100% - 18px) / 3); |
|
|
|
width: calc((100% - 18px) / 3); |
|
|
|
height: 320px; |
|
|
|
height: 284px; |
|
|
|
margin-right: 9px; |
|
|
|
margin-right: 9px; |
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
&:nth-child(3n) { |
|
|
|
&:nth-child(3n) { |
|
|
|
margin-right: 0; |
|
|
|
margin-right: 0; |
|
|
|
} |
|
|
|
} |
|
|
@ -607,6 +603,7 @@ export default { |
|
|
|
h6 { |
|
|
|
h6 { |
|
|
|
font-size: 1.2rem; |
|
|
|
font-size: 1.2rem; |
|
|
|
font-family: PingFangSC-Medium, PingFang SC; |
|
|
|
font-family: PingFangSC-Medium, PingFang SC; |
|
|
|
|
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
} |
|
|
|
.meta { |
|
|
|
.meta { |
|
|
|
margin: 8px 0; |
|
|
|
margin: 8px 0; |
|
|
@ -617,6 +614,7 @@ export default { |
|
|
|
margin-bottom: 8px; |
|
|
|
margin-bottom: 8px; |
|
|
|
font-size: 1rem; |
|
|
|
font-size: 1rem; |
|
|
|
font-family: PingFangSC-Medium, PingFang SC; |
|
|
|
font-family: PingFangSC-Medium, PingFang SC; |
|
|
|
|
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
} |
|
|
|
.date { |
|
|
|
.date { |
|
|
|
font-size: 0.8rem; |
|
|
|
font-size: 0.8rem; |
|
|
@ -708,8 +706,12 @@ export default { |
|
|
|
h6 { |
|
|
|
h6 { |
|
|
|
font-size: 1.6rem; |
|
|
|
font-size: 1.6rem; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.sub-title { |
|
|
|
|
|
|
|
margin: 8px 0 20px; |
|
|
|
|
|
|
|
font-size: 0.9rem; |
|
|
|
|
|
|
|
} |
|
|
|
.text { |
|
|
|
.text { |
|
|
|
margin: 20px 0; |
|
|
|
margin-bottom: 60px; |
|
|
|
font-size: 1rem; |
|
|
|
font-size: 1rem; |
|
|
|
line-height: 2; |
|
|
|
line-height: 2; |
|
|
|
} |
|
|
|
} |
|
|
@ -827,8 +829,12 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.news { |
|
|
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
li { |
|
|
|
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@media (max-width: 920px) { |
|
|
|
|
|
|
|
.news-banner { |
|
|
|
.news-banner { |
|
|
|
flex-direction: column; |
|
|
|
flex-direction: column; |
|
|
|
.pic-wrap, |
|
|
|
.pic-wrap, |
|
|
|