From b23c8a3ff1c774032f2ea5c3d429b628f316db66 Mon Sep 17 00:00:00 2001
From: xy <2115269706@qq.com>
Date: Tue, 12 Nov 2024 10:38:31 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=A1=B6=E9=83=A8=E6=96=B0?=
 =?UTF-8?q?=E9=97=BB=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/Layout/index.vue                   |  1 +
 src/Layout/main/index.vue              | 17 +++++-
 src/styles/index.scss                  | 35 +++++++++++-
 src/views/pedagogicalReform/index.vue  | 76 +++++++++++++++-----------
 src/views/scientificResearch/index.vue | 24 ++++----
 5 files changed, 108 insertions(+), 45 deletions(-)

diff --git a/src/Layout/index.vue b/src/Layout/index.vue
index b490b71..4202db8 100644
--- a/src/Layout/index.vue
+++ b/src/Layout/index.vue
@@ -95,6 +95,7 @@ onMounted(() => {
 
 <style lang="scss" scoped>
 .main-container {
+  padding-top: 120px;
   width: 100%;
   min-height: 100vh;
   background-color: #eef1fb;
diff --git a/src/Layout/main/index.vue b/src/Layout/main/index.vue
index 5ae869e..6f0e055 100644
--- a/src/Layout/main/index.vue
+++ b/src/Layout/main/index.vue
@@ -6,7 +6,22 @@
   </section> -->
   <div class="view-container">
     <div class="banner">
-      <img :src="adminInfoStore.info.promotionalImages" alt="" style="max-height: 409px;">
+      <div class="left">
+        <img :src="adminInfoStore.info.promotionalImages" alt="" style="max-height: 409px;">
+      </div>
+      <div class="news">
+        <div class="newTop">新闻</div>
+        <div class="newButton">
+          <ul>
+            <li>未来产业由前沿技术驱动，当前处于孕育萌发阶段或产业化初期</li>
+            <li>前瞻部署、梯次培育。顺应新一轮科技革命和产业变革趋势</li>
+            <li>创新驱动、应用牵引。以前沿技术突破引领未来产业发展</li>
+            <li>某高校正式启动新版教学一体化师生管理后台</li>
+            <li>教学一体化师生管理后台助力某高校实现智慧教学</li>
+          </ul>
+        </div>
+      </div>
+
       <div class="source-box">
         <div class="source">
           {{ adminInfoStore.info.name }}
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 3737f24..f7a6973 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -3,16 +3,47 @@
 
 .banner {
   width: 100%;
-  height: 410px;
+  height: 300px;
   // background: url('../assets/images/banner4.jpg') no-repeat;
   // background-size: cover
   position: relative;
+  display: flex;
+  .left{
+    width: 70%;
+  }
+  .news{
+    width: 30%;
+    background-color: #e6f3fc;
+    .newTop{
+      height: 40px;
+      line-height: 40px;
+      background-color: #eaf4fd;
+      padding-left: 10px;
+      font-size: 18px;
+      color: #3374ff;
+    }
+    .newButton{
+      height: 350px;
+      // background-color: pink;
+    }
+    .newButton ul li{
+      font-size: 15px;
+     padding: 16px;
+     list-style-type: disc  ;
+     color:#6da0ff;
+    list-style-position:inside;
+    }
+        .newButton ul li:hover{
+          color: #081018;
+        }
+  }
   img{
     width: 100%;
+    height: 100%;
   }
   .source-box {
     position: absolute;
-    top: 50%;
+    top: 40%;
     left: 180px;
 
     .source {
diff --git a/src/views/pedagogicalReform/index.vue b/src/views/pedagogicalReform/index.vue
index 6cc5eed..6eb7863 100644
--- a/src/views/pedagogicalReform/index.vue
+++ b/src/views/pedagogicalReform/index.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="header_title">
+  <div class="header_title" >
     <span>资讯新闻</span>
-    <el-divider style="width: 800px"/>
+    <el-divider style="margin: 30px auto;"/>
   </div>
   <div class="container">
     <div class="left">
@@ -9,27 +9,27 @@
         <li v-for="category in column" :key="category.id">
           <div class="box">
             <div class="categorySty">
-              <span>· {{category.categoryName}}</span>
+              <span>· {{ category.categoryName }}</span>
             </div>
             <div style="margin-left: 10px">
               <ul v-if="category.essays">
                 <li class="essaySty" v-for="essay in category.essays" :key="essay.id" @click="selectEssay(essay)">
-                  <span>{{essay.title}}</span>
-                  <span>{{essay.publishTime}}</span>
+                  <span>{{ essay.title }}</span>
+                  <span>{{ essay.publishTime }}</span>
                 </li>
               </ul>
             </div>
           </div>
         </li>
       </ul>
-      <el-divider/>
+      <el-divider />
     </div>
   </div>
 </template>
 
 <script lang='ts' setup>
 import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import {queryCategory,queryEssay} from '@/api/news'
+import { queryCategory, queryEssay } from '@/api/news'
 const column = ref([])
 const essayContent = ref({})
 //获取栏目信息
@@ -38,7 +38,7 @@ const CategoryList = async () => {
   column.value = res.data
   // console.log(column.value,'栏目信息')
 }
-const selectEssay =async (essay)=>{
+const selectEssay = async (essay) => {
   essayContent.value = essay
   // console.log(essayContent,'所选文章')
 };
@@ -51,7 +51,7 @@ const fetchCategoriesAndEssays = async () => {
     for (const category of column.value) {
       const essaysResponse = await queryEssay(category.id);
       category.essays = essaysResponse.data || [];
-      console.log(category.essays,'s')
+      console.log(category.essays, 's')
     }
   } catch (error) {
     console.error('查找信息失败', error);
@@ -64,52 +64,64 @@ onMounted(() => {
 </script>
 
 <style scoped>
-.header_title{
-  font-size: 20px;
-  color: dodgerblue;
+.header_title {
+  font-size: 25px;
+  color: #293352;
+  text-align: center;
   font-weight: bold;
-  margin-left:490px;
   margin-top: 30px;
 }
-.left{
-  margin-left: 600px;
-  margin-top: 10px;
-  height: 85vh;
-  overflow-y: auto;
-}
+
+/* .left {
+  /* margin-left: 600px;
+  margin-top: 10px; */
+  /* height: 85vh; */
+  /* overflow-y: auto; */
+
+
 .left::-webkit-scrollbar {
   width: 0px;
 }
-.box{
-  width: 502px;
-  margin-bottom: 5px;
+
+.box {
+  margin: 0 auto;
+  width: 900px;
+  margin-bottom: 10px;
+  /* border: 1px solid pink; */
 }
-.categorySty{
+
+.categorySty {
   margin-bottom: 10px;
   font-size: 25px;
   font-weight: 550;
   width: 560px;
-  height: 50px;
+  height: 60px;
   line-height: 50px;
   /*background: #FFB21E;*/
 }
-.categorySty:hover{
+
+.categorySty:hover {
   background: gainsboro;
   cursor: pointer;
 }
-.essaySty{
-  display: flex; /* 启用Flexbox布局 */
-  justify-content: space-between; /* 水平方向两端对齐 */
-  align-items: center; /* 垂直居中对齐 */
+
+.essaySty {
+  display: flex;
+  /* 启用Flexbox布局 */
+  justify-content: space-between;
+  /* 水平方向两端对齐 */
+  align-items: center;
+  /* 垂直居中对齐 */
   height: 40px;
   line-height: 40px;
-  margin-bottom: 5px;
-  width:520px;
+  margin-bottom: 10px;
+  width: 800px;
   font-size: 20px;
   margin-left: 30px;
   /*background: #FFB21E;*/
 }
-.essaySty:hover{
+
+.essaySty:hover {
   background: gainsboro;
   cursor: pointer;
 }
diff --git a/src/views/scientificResearch/index.vue b/src/views/scientificResearch/index.vue
index b6ecef6..fe51355 100644
--- a/src/views/scientificResearch/index.vue
+++ b/src/views/scientificResearch/index.vue
@@ -1,18 +1,18 @@
 <template>
   <div class="content">
-    <el-card style="max-width:800px;height: 80vh">
+    <el-card style="max-width:1200px;height: 80vh">
       <template #header>
         <div class="card-header">
           <span>关于我们</span>
         </div>
       </template>
       <div class="news_main">
-<!--        {{ aboutEssay.content }}-->
+        <!--        {{ aboutEssay.content }}-->
         <textarea v-model="aboutEssay.content" class="textSty"></textarea>
       </div>
-<!--      <template #footer>-->
-<!--        <span>...</span>-->
-<!--      </template>-->
+      <!--      <template #footer>-->
+      <!--        <span>...</span>-->
+      <!--      </template>-->
     </el-card>
   </div>
 </template>
@@ -38,28 +38,32 @@ onMounted(()=>{
   justify-content: center;
 }
 .el-card{
-  width: 800px;
+  width: 1200px;
   height: 80vh;
-  margin-top: 30px;
-  margin-bottom: 30px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+  background-color: #eef1fb;
 }
 .card-header{
   font-size: 25px;
-  color: #6da0ff;
+  color:#293352;
   text-align: center;
   font-weight: bold;
 }
 .news_main{
   padding: 20px;
   height: 80vh;
-  font-size: 20px;
+  font-size: 18px;
   line-height: 1.5;
   overflow-y: auto;
+  color: #666666;
+
 }
 .textSty{
   width: 100%;
   height:65vh;
   border: none;
+    background-color: #eef1fb;
 }
 .textSty::-webkit-scrollbar{
   width: 0px;