odjbin/sist_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

移动

Browse Source
This commit is contained in:
clay
2022-01-03 16:06:29 +08:00
parent eaca9946be
commit 61fe34bb8a
11 changed files with 50 additions and 1563 deletions
Download Patch File Download Diff File Expand all files Collapse all files

416
src/views/index/components/scientific_research_trends.vue Normal file
View File

@@ -0,0 +1,416 @@
<template>
<div class="scientific_research_trends">
<!--title-->
<el-row>
<el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
<div class="grid-content"></div>
</el-col>
<el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
<div class="title">
<!-- {{ $t('message.news_center') }}-->
科学研究
</div>
<el-row>
<el-col :span="8">
<hr class="hr">
</el-col>
<el-col :span="8">
<div class="divider_text">Scientific research trends</div>
</el-col>
<el-col :span="8">
<hr class="hr">
</el-col>
</el-row>
</el-col>
</el-row>
<!--科学研究新闻内容-->
<el-row>
<el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">
<div class="grid-content"></div>
</el-col>
<el-col class="scientific_context" :xs="22" :sm="20" :md="20" :lg="16" :xl="16">
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh1.png" alt="">
</el-col>
<el-col :span="16" class="text">科研院关于组织申报国家重点研发计划</el-col>
<el-col :span="4">
<div class="time">2021.10.10</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh2.png" alt="">
</el-col>
<el-col :span="16" class="text">科技部关于发布国家重点研发计划“科</el-col>
<el-col :span="4">
<div class="time">2021.10.22</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
</el-row>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh3.png" alt="">
</el-col>
<el-col :span="16" class="text">关于征集适宜向“一带一路”国家转移的…</el-col>
<el-col :span="4">
<div class="time">2021.10.21</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh4.png" alt="">
</el-col>
<el-col :span="16" class="text">西南交通大学关于2021年度国家自然</el-col>
<el-col :span="4">
<div class="time">2021.10.07</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
</el-row>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh5.png" alt="">
</el-col>
<el-col :span="16" class="text">关于召开2021年度国家自然科学基金项…</el-col>
<el-col :span="4">
<div class="time">2021.10.11</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh6.png" alt="">
</el-col>
<el-col :span="16" class="text">关于2021年度四川省科技奖励提名工作…</el-col>
<el-col :span="4">
<div class="time">2021.10.30</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
</el-row>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh7.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh8.png" alt="">
</el-col>
<el-col :span="16" class="text">国家自然科学基金委员会中德科学中心…</el-col>
<el-col :span="4">
<div class="time">2021.10.26</div>
</el-col>
</el-row>
<div class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
</el-row>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh9.png" alt="">
</el-col>
<el-col :span="16" class="text">关于征集适宜向“一带一路”国家转移的…</el-col>
<el-col :span="4">
<div class="time">2021.10.23</div>
</el-col>
</el-row>
<div v-show="width<992" class="scientific_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="scientific_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_bh10.png"
alt=""></el-col>
<el-col :span="16" class="text">科研院关于组织申报国家重点研发计划</el-col>
<el-col :span="4">
<div class="time">2021.08.06</div>
</el-col>
</el-row>
</el-col>
</el-row>
</el-col>
</el-row>
<!--更多-->
<el-row>
<el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
<div class="grid-content"></div>
</el-col>
<el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
<div style="background: #FFFFFF;color: #1956BC;" class="more">
{{ $t('message.more') }}
</div>
<el-row>
<el-col :span="9">
<hr class="hr">
</el-col>
<el-col :span="6">
<div class="divider_text">学术交流</div>
</el-col>
<el-col :span="9">
<hr class="hr">
</el-col>
</el-row>
</el-col>
</el-row>
<!--学术交流-->
<el-row>
<el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">
<div class="grid-content"></div>
</el-col>
<el-col class="academia_context" :xs="22" :sm="20" :md="20" :lg="16" :xl="16">
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="academia_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
<div class="academia_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="academia_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
<div class="academia_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
</el-row>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="academia_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
<div class="academia_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="academia_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
<div class="academia_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
</el-row>
<el-row>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="academia_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
<div v-show="width<992" class="academia_context_divider">
<hr style="border: 0.1rem solid #E6E6E6;">
</div>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-row class="academia_context_text">
<el-col :span="2" class="img"><img src="@/assets/index/scientific_research_trends/sy_icon_b1.png" alt="">
</el-col>
<el-col :span="16" class="text">《成都市经济和信息化局关于更新完善…</el-col>
<el-col :span="4">
<div class="time">2021.10.01</div>
</el-col>
</el-row>
</el-col>
</el-row>
</el-col>
</el-row>
<!--更多-->
<el-row>
<el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
<div class="grid-content"></div>
</el-col>
<el-col class="headline" :xs="22" :sm="20" :md="16" :lg="12" :xl="12">
<div style="background: #FFFFFF;color: #1956BC;" class="more">
{{ $t('message.more') }}
</div>
<div class="more_img">
<img src="@/assets/index/scientific_research_trends/sy_icon_zhdb.png" alt="">
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: "scientific_research_trends",
data() {
return {
width: document.documentElement.clientWidth
}
},
}
</script>
<style scoped lang="scss">
@import '../css/comment.css';
.scientific_research_trends {
background-image: url("../../../assets/index/scientific_research_trends/sy_bj2.png");
padding-top: 4rem;
padding-bottom: 2rem;
}
.headline {
.title {
background: #FFFFFF;
color: #1956BC;
}
.divider_text {
font-size: 2rem;
font-weight: 500;
color: #FFFFFF;
}
}
.scientific_context {
background: rgba(255, 255, 255, 0.9);
border-radius: 2.4rem;
padding: 2rem 0;
.scientific_context_text {
margin-top: 2rem;
color: #1956BC;
padding-left: 4rem;
.img {
img{
width: 2.6rem;
}
}
.text {
margin-left: 1rem;
font-size: 1.8rem;
font-weight: 500;
}
.time {
text-align: center;
font-size: 1.2rem;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
width: 7.2rem;
height: 2.2rem;
line-height: 2.2rem;
border-radius: 1.1rem;
border: 0.1rem solid #1956BC;
margin-left: 3rem;
}
}
.scientific_context_divider {
padding-left: 4rem;
margin-top: 2rem;
margin-bottom: 2rem;
}
}
.academia_context {
background: rgba(255, 255, 255, 0.9);
padding: 2rem 0;
.academia_context_divider {
padding-left: 4rem;
margin-top: 2rem;
margin-bottom: 2rem;
}
.academia_context_text {
margin-top: 2rem;
color: #1956BC;
padding-left: 4rem;
.img {
img{
width: 2.6rem;
}
}
.text {
margin-left: 1rem;
font-size: 1.8rem;
font-weight: 500;
}
.time {
font-size: 1.2rem;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #1956BC;
line-height: 2.4rem;
}
}
}
</style>