From d0b9848102dd4145d9cb90a8e356ec7e3797e5ef Mon Sep 17 00:00:00 2001
From: clay <20932067@zju.edu.cn>
Date: Wed, 19 Jan 2022 19:24:02 +0800
Subject: [PATCH] 01

---
 src/views/content/components/list.vue         |   6 +-
 src/views/header/index.vue                    |  15 +--
 src/views/index/components/news_center.vue    |  79 +++++++-----
 .../components/party_building_activities.vue  | 118 +++++++++++-------
 .../components/scientific_research_trends.vue | 104 +++++++++------
 .../index/components/teaching_student.vue     |  39 +++---
 src/views/index/css/comment.css               |  63 ++++++++--
 7 files changed, 269 insertions(+), 155 deletions(-)

diff --git a/src/views/content/components/list.vue b/src/views/content/components/list.vue
index 6587740..10c7de9 100644
--- a/src/views/content/components/list.vue
+++ b/src/views/content/components/list.vue
@@ -111,13 +111,15 @@ export default {
       console.log(`每页 ${val} 条`);
     },
     handleCurrentChange(val) {
-      if (val != -1){
+      if (val == -1) {
+        this.value.pageNum = 1
+      }else {
         this.value.pageNum = val
       }
       let data = {
         title:this.query,
         id: this.value.navId,
-        pageNum: val,
+        pageNum: this.value.pageNum,
         pageSize: 4
       }
       this.type = this.$route.query && this.$route.query.type
diff --git a/src/views/header/index.vue b/src/views/header/index.vue
index e8c4f68..8c6a260 100644
--- a/src/views/header/index.vue
+++ b/src/views/header/index.vue
@@ -1,15 +1,4 @@
 <template>
-  <!--  <el-row>-->
-  <!--    <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">-->
-  <!--      <div class="grid-content"></div>-->
-  <!--    </el-col>-->
-  <!--    <el-col :xs="22" :sm="20" :md="20" :lg="16" :xl="16">-->
-  <!--    </el-col>-->
-  <!--    <el-col :xs="1" :sm="2" :md="2" :lg="4" :xl="4">-->
-  <!--      <div class="grid-content"></div>-->
-  <!--    </el-col>-->
-  <!--  </el-row>-->
-
   <div class="header">
     <!--头部部分-->
     <div class="top">
@@ -241,7 +230,7 @@ export default {
         display: none;
         width: 16.5rem;
         position: absolute;
-        top: 8rem;
+        top: 6rem;
         background-color: transparent;
         //display: block;
         //width: 100%;
@@ -308,7 +297,7 @@ export default {
           display: block;
         }
         .link_text_title{
-          font-weight: 900;
+          font-weight: bolder !important;
         }
       }
 
diff --git a/src/views/index/components/news_center.vue b/src/views/index/components/news_center.vue
index a252078..fef931d 100644
--- a/src/views/index/components/news_center.vue
+++ b/src/views/index/components/news_center.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="news_center">
-    <!--title-->
+    <!--title
     <el-row>
       <el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
         <div class="grid-content"></div>
@@ -21,7 +21,29 @@
           </el-col>
         </el-row>
       </el-col>
-    </el-row>
+    </el-row>-->
+    <!--title-->
+
+
+      <div class="headline">
+          <div class="hr_div">
+            <div class="hr_line_left">
+            </div>
+            <div class="hr_dot_left">
+            </div>
+          </div>
+          <div class="title">
+            {{ $t('message.news_center') }}
+          </div>
+        <div class="hr_div">
+          <div class="hr_line_right">
+          </div>
+          <div class="hr_dot_right">
+          </div>
+        </div>
+      </div>
+
+
     <!--录播图-->
     <el-row>
       <el-col :xs="1" :sm="2" :md="2" :lg="3" :xl="5">
@@ -54,13 +76,13 @@
       </el-col>
       <el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14">
         <el-row class="news">
-          <el-col v-for="(news,index) in newsDate" :key="index" :xs="12" :sm="12" :md="12" :lg="6" :xl="6" >
-            <div class="news_context"  @click="getArticle(news)">
+          <el-col v-for="(news,index) in newsDate" :key="index" :xs="12" :sm="12" :md="12" :lg="6" :xl="6">
+            <div class="news_context" @click="getArticle(news)">
               <div class="news_context_img">
                 <img :src="news.imgurl" alt="">
               </div>
               <div class="news_context_text">
-                {{news.title}}
+                {{ news.title }}
               </div>
             </div>
           </el-col>
@@ -91,11 +113,11 @@ import {getParentNode} from "@/utils/sist";
 
 export default {
   name: "news_center",
-  data(){
-    return{
-      newsDate:[],
-      bannerDate:[],
-      width: document.documentElement.clientWidth>992,
+  data() {
+    return {
+      newsDate: [],
+      bannerDate: [],
+      width: document.documentElement.clientWidth > 992,
     }
   },
   created() {
@@ -103,27 +125,27 @@ export default {
     this.getBanner()
   },
   methods: {
-    getList(){
+    getList() {
       getArticleList({
-        type:"XC7D8m5gkr35BX1b4Otiln4",
+        type: "XC7D8m5gkr35BX1b4Otiln4",
         pageNum: 1,
         pageSize: 4
-      }).then(res=>{
+      }).then(res => {
         this.newsDate = res.rows
       })
     },
-    getArticle(news){
-      info(news.id).then(res=>{
+    getArticle(news) {
+      info(news.id).then(res => {
         let info = getParentNode(res.data.encodeId)
-        if (this.width){
-          this.$router.push("/pc/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
-        }else {
-          this.$router.push("/mobile/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
+        if (this.width) {
+          this.$router.push("/pc/" + info.second.encodeId + "/" + info.three.encodeId + "?id=" + news.id);
+        } else {
+          this.$router.push("/mobile/" + info.second.encodeId + "/" + info.three.encodeId + "?id=" + news.id);
         }
       })
     },
-    getBanner(){
-      banner("NEd5n92EMIpyyBslaNqsRgE").then(res=>{
+    getBanner() {
+      banner("NEd5n92EMIpyyBslaNqsRgE").then(res => {
         this.bannerDate = res.data
       })
     }
@@ -133,7 +155,8 @@ export default {
 
 <style scoped lang="scss">
 @import '../css/comment.css';
-.news_center{
+
+.news_center {
   padding-bottom: 2rem;
 }
 
@@ -195,16 +218,16 @@ export default {
       margin: 1rem auto;
       width: 80%;
       //height: 4rem;
-      overflow:hidden; //超出的文本隐藏
-      text-overflow:ellipsis; //溢出用省略号显示
-      display:-webkit-box; //作为弹性伸缩盒子模型显示。
-      -webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
-      -webkit-line-clamp:3; //显示的行
+      overflow: hidden; //超出的文本隐藏
+      text-overflow: ellipsis; //溢出用省略号显示
+      display: -webkit-box; //作为弹性伸缩盒子模型显示。
+      -webkit-box-orient: vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
+      -webkit-line-clamp: 3; //显示的行
     }
   }
 }
 
-@media screen and  (min-width: 1100px) and (max-width: 1400px) {
+@media screen and (min-width: 1100px) and (max-width: 1400px) {
   .news_context {
     width: 20rem !important;
     height: 20rem !important;
diff --git a/src/views/index/components/party_building_activities.vue b/src/views/index/components/party_building_activities.vue
index 7066885..e373d0e 100644
--- a/src/views/index/components/party_building_activities.vue
+++ b/src/views/index/components/party_building_activities.vue
@@ -1,28 +1,48 @@
 <template>
   <div class="party_building_activities">
     <!--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 class="headline">
+      <div class="hr_div">
+        <div class="hr_line_left">
         </div>
-        <el-row>
-          <el-col :span="8">
-            <hr class="hr">
-          </el-col>
-          <el-col :span="8">
-            <div class="divider_text">Party Building Activities</div>
-          </el-col>
-          <el-col :span="8">
-            <hr class="hr">
-          </el-col>
-        </el-row>
-      </el-col>
-    </el-row>
+        <div class="hr_dot_left">
+        </div>
+      </div>
+      <div class="title">
+        <!--{{ $t('message.news_center') }}-->
+        党群工作
+      </div>
+      <div class="hr_div">
+        <div class="hr_line_right">
+        </div>
+        <div class="hr_dot_right">
+        </div>
+      </div>
+    </div>
+    <!--<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">-->
+    <!--      &lt;!&ndash;          {{ $t('message.news_center') }}&ndash;&gt;-->
+    <!--      党群工作-->
+    <!--    </div>-->
+    <!--    <el-row>-->
+    <!--      <el-col :span="8">-->
+    <!--        <hr class="hr">-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="8">-->
+    <!--        <div class="divider_text">Party Building Activities</div>-->
+    <!--      </el-col>-->
+    <!--      <el-col :span="8">-->
+    <!--        <hr class="hr">-->
+    <!--      </el-col>-->
+    <!--    </el-row>-->
+    <!--  </el-col>-->
+    <!--</el-row>-->
     <!--轮播图-->
 
     <el-row>
@@ -34,30 +54,34 @@
       </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: #DA2D2D;color: #FFFFFF;" class="more">
-          {{ $t('message.more') }}
+
+
+    <div class="headline">
+      <!--<div style="background: #DA2D2D;color: #E6E6E6;" class="more">-->
+      <!--  {{ $t('message.more') }}-->
+      <!--</div>-->
+      <!--<div class="more_img">-->
+      <!--  <img src="@/assets/index/party_building_activities/sy_icon_zhdh.png" alt="">-->
+      <!--</div>-->
+      <div class="hr_div">
+        <div class="hr_line_left">
         </div>
-        <div class="more_img">
-          <img src="@/assets/index/party_building_activities/sy_icon_zhdh.png" alt="">
+        <div class="hr_dot_left">
         </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>
+      </div>
+      <div class="hr_text" style="color:#DA2D2D;">
+        <!--{{ $t('message.news_center') }}-->
+        党史教育
+      </div>
+      <div class="hr_div">
+        <div class="hr_line_right">
+        </div>
+        <div class="hr_dot_right">
+        </div>
+      </div>
+    </div>
+
+
     <!--党史教育内容-->
     <el-row>
       <el-col :xs="1" :sm="2" :md="2" :lg="3" :xl="5">
@@ -132,6 +156,14 @@ export default {
 }
 
 .headline {
+
+  .hr_line_left,.hr_line_right{
+    border-color: #DA2D2D !important;
+  }
+  .hr_dot_left,.hr_dot_right{
+    background-color: #DA2D2D !important;
+  }
+
   .title {
     background: #DA2D2D;
   }
diff --git a/src/views/index/components/scientific_research_trends.vue b/src/views/index/components/scientific_research_trends.vue
index 91c0a03..40f97d3 100644
--- a/src/views/index/components/scientific_research_trends.vue
+++ b/src/views/index/components/scientific_research_trends.vue
@@ -1,28 +1,49 @@
 <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 class="headline">
+      <div class="hr_div">
+        <div class="hr_line_left">
         </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>
+        <div class="hr_dot_left">
+        </div>
+      </div>
+      <div class="title">
+        <!--{{ $t('message.news_center') }}-->
+        科学研究
+      </div>
+      <div class="hr_div">
+        <div class="hr_line_right">
+        </div>
+        <div class="hr_dot_right">
+        </div>
+      </div>
+    </div>
+
+
+
+    <!--<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">-->
+    <!--      &lt;!&ndash;          {{ $t('message.news_center') }}&ndash;&gt;-->
+    <!--      科学研究-->
+    <!--    </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="3" :xl="5">
@@ -62,27 +83,28 @@
     </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 class="headline">
+      <div style="background: #FFFFFF;color: #1956BC;" class="more" @click="lookMore(scientificData[0])">
+        {{ $t('message.more') }}
+      </div>
+      <div class="hr_div">
+        <div class="hr_line_left">
         </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>
+        <div class="hr_dot_left">
+        </div>
+      </div>
+      <div class="hr_text" style="color:#E6E6E6;">
+        <!--{{ $t('message.news_center') }}-->
+        学术交流
+      </div>
+      <div class="hr_div">
+        <div class="hr_line_right">
+        </div>
+        <div class="hr_dot_right">
+        </div>
+      </div>
+    </div>
     <!--学术交流-->
     <el-row>
       <el-col :xs="1" :sm="2" :md="2" :lg="3" :xl="5">
diff --git a/src/views/index/components/teaching_student.vue b/src/views/index/components/teaching_student.vue
index 8f9059a..4d36125 100644
--- a/src/views/index/components/teaching_student.vue
+++ b/src/views/index/components/teaching_student.vue
@@ -2,28 +2,25 @@
   <div class="teaching_student">
 
     <!--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 class="headline">
+      <div class="hr_div">
+        <div class="hr_line_left">
         </div>
-        <el-row>
-          <el-col :span="8">
-            <hr class="hr">
-          </el-col>
-          <el-col :span="8">
-            <div class="divider_text">Teaching and student</div>
-          </el-col>
-          <el-col :span="8">
-            <hr class="hr">
-          </el-col>
-        </el-row>
-      </el-col>
-    </el-row>
+        <div class="hr_dot_left">
+        </div>
+      </div>
+      <div class="title">
+        <!--{{ $t('message.news_center') }}-->
+        教学工作
+      </div>
+      <div class="hr_div">
+        <div class="hr_line_right">
+        </div>
+        <div class="hr_dot_right">
+        </div>
+      </div>
+    </div>
     <!--教学工作内容-->
 
     <el-row>
diff --git a/src/views/index/css/comment.css b/src/views/index/css/comment.css
index 77360b0..f947337 100644
--- a/src/views/index/css/comment.css
+++ b/src/views/index/css/comment.css
@@ -4,18 +4,66 @@
 * @description：comment
 * @email: clay@hchyun.com
 */
-.headline > .title {
-  margin: 0 auto;
-  width: 23rem;
-  height: 6rem;
+.headline{
+  text-align:center;
+  margin-bottom: 3rem;
+}
+
+.hr_line_left{
+  float: left;
+  border: .1rem solid #E6E6E6;
+  margin-top: .3rem;
+  width: 24rem;
+}
+.hr_dot_left{
+  float: right;
+  width: .8rem;
+  height: .8rem;
+  background-color: #E6E6E6;
+  border-radius: .8rem;
+}
+.hr_line_right{
+  float: right;
+  border: .1rem solid #E6E6E6;
+  margin-top: .3rem;
+  width: 24rem;
+}
+.hr_dot_right{
+  float: left;
+  width: .8rem;
+  height: .8rem;
+  background-color: #E6E6E6;
+  border-radius: .8rem;
+}
+.hr_text{
+  display: inline-block;
+  font-size: 2rem;
+  color: #1956BC;
+}
+.headline>.hr_div{
+  padding: 0 2rem;
+  clear: left;
+  /*border: .1rem solid #E6E6E6;*/
+  display: inline-block;
+}
+.hr_test{
+  /*border: .1rem solid #E6E6E6;*/
+}
+.hr_div{
+  width: 25rem;
+}
+.hr_left{
+  display: inline-block;
+  width: 25rem;
+}
+.headline  .title {
+  display: inline-block;
+  padding: 1rem 3.3rem;
   background: #1956BC;
   border-radius: 2.95rem;
-  text-align: center;
-  line-height: 6rem;
   font-size: 2.6rem;
   font-weight: 500;
   color: #FFFFFF;
-  text-align: center;
 }
 
 .divider div {
@@ -30,6 +78,7 @@
 }
 
 .more {
+  cursor: pointer !important;
   width: 12.8rem;
   height: 3.6rem;
   background: #1956BC;