主页

src/App.vue

@@ -8,7 +8,7 @@
     </div>
     <el-row>
       <el-col></el-col>
-      <el-col style="height: 500rem;width: 100%; background-color:red;">
+      <el-col>
         <router-view/>
       </el-col>
       <el-col></el-col>

src/i18n/langs/cn.js

@@ -11,6 +11,7 @@ const cn = {
     'alumni':'校友',
     'examine':'考生',
     'Services portal':'服务门户',
+    'news_center':'新闻中心',
   },
   ...zhLocale
 }

src/i18n/langs/en.js

@@ -11,6 +11,7 @@ const en = {
     'alumni':'alumni',
     'examine':'examine',
     'Services portal':'Services portal',
+    'news_center':'News Center',
   },
   ...enLocale
 }

src/views/footer/index.vue

@@ -1,6 +1,37 @@
 <template>
   <div class="footer">
-
+    <el-row>
+      <el-col :offset="3" :span="20">
+        <el-row>
+          <el-col :span="12">
+            <div class="fLeft" style="margin-top: 1rem">
+              <p style="font-family:Verdana, Geneva, sans-serif;font-weight:500;font-size:20px; padding-bottom:6px; ">
+                CONTACT US</p>
+              <p style="margin-top: 6px;">犀浦校区地址：中国四川省成都市高新区西部园区西南交通大学 信息科学与技术学院 &nbsp;&nbsp;&nbsp;&nbsp; </p>
+              <p>邮政编码：611756</p>
+              <p>电话：+86 28 66366709(行政)<!--；&nbsp;+86 28 66366741(学生工作组)--></p>
+              <p style="margin-top: 8px;">版权所有 © 2015 西南交通大学信息科学与技术学院. All rights reserved. <a href="#">&nbsp;意见反馈</a>
+              </p>
+            </div>
+          </el-col>
+          <el-col :span="12">
+            <table class="fRight" cellpadding="0" cellspacing="0" border="0">
+              <tbody><tr>
+                <td><img src="http://sist.swjtu.edu.cn:80/zh/images/logo3.jpg"></td>
+                <td><p><a href="http://www.swjtu.edu.cn/" target="_blank">西南交通大学（中文）</a></p>
+                  <p><a href="http://english.swjtu.edu.cn/public/default.aspx" target="_blank">西南交通大学（ENGLISH）</a></p>
+                  <p><a href="http://fad.swjtu.edu.cn/public/Default.aspx" target="_blank">西南交通大学国际合作与交流处</a></p>
+                  <p><a href="http://www.csc.edu.cn/" target="_blank">国家留学基金管理委员会</a></p>
+                  <p><a href="http://www.fmprc.gov.cn/" target="_blank">中华人民共和国外交部</a></p>
+                  <p><a href="http://www.moe.edu.cn/" target="_blank">中华人民共和国教育部门户网站</a></p>
+                  <p><a href="http://www.ieee.org/" target="_blank">电气和电子工程师协会(IEEE)</a></p>
+                </td>
+              </tr>
+              </tbody></table>
+          </el-col>
+        </el-row>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
@@ -10,9 +41,33 @@ export default {
 }
 </script>
 
-<style scoped>
- .footer{
-   height: 26.7rem;
-   background-color: rgb(107 109 108);
- }
+<style scoped lang="scss">
+.footer {
+  height: 20rem;
+  background-color: rgb(107, 109, 108);
+  color: #b2b2b2 !important;
+  font-size: 1.2rem;
+  a{
+    color: #b2b2b2 !important;
+    text-decoration:none;
+  }
+
+  .fLeft{
+    text-decoration: none;
+    margin-top: 1rem;
+    p {
+      margin-top: .5rem;
+    }
+  }
+  .fRight{
+    margin-top: 1rem;
+    text-decoration: red;
+    p {
+      margin-left: 1rem;
+      margin-top: .5rem;
+    }
+  }
+
+}
+
 </style>

src/views/header/index.vue

@@ -1,6 +1,6 @@
 <template>
   <el-row>
-    <el-col :offset="3" :span="18">
+    <el-col :offset="4" :span="16">
       <div class="header">
         <!--头部部分-->
         <div class="top">
@@ -46,24 +46,24 @@
             </el-col>
             <el-col :offset="1" :span="19">
               <div  class="banner">
-                <div>学院首页</div>
-                <div>学院概况</div>
-                <div>党群工作</div>
-                <div>师资队伍</div>
-                <div>教育教学</div>
-                <div>科学研究</div>
-                <div>学科建设</div>
-                <div>学生工作</div>
-                <div>校友工作</div>
-                <div>国际化</div>
-                <div>资料下载</div>
+                <router-link to="/" ><div>学院首页</div></router-link>
+                <router-link to="/sp" ><div>学院概况</div></router-link>
+                <router-link to="/ts" ><div>党群工作</div></router-link>
+                <router-link to="/et" ><div>师资队伍</div></router-link>
+                <router-link to="/" ><div>教育教学</div></router-link>
+                <router-link to="/" ><div>科学研究</div></router-link>
+                <router-link to="/" ><div>学科建设</div></router-link>
+                <router-link to="/" ><div>学生工作</div></router-link>
+                <router-link to="/" ><div>校友工作</div></router-link>
+                <router-link to="/" ><div>国际化</div></router-link>
+                <router-link to="/" ><div>资料下载</div></router-link>
               </div>
             </el-col>
           </el-row>
         </div>
       </div>
     </el-col>
-    <el-col :span="3">
+    <el-col :span="4">
     </el-col>
   </el-row>
 </template>
@@ -129,6 +129,10 @@ export default {
       }
     }
     .banner{
+      a{
+        text-decoration: none;
+        color: #ffffff;
+      }
       width: 100%;
       height: 8rem;
       clear: left;

src/views/index/index.vue

@@ -1,13 +1,141 @@
 <template>
+  <div id="index">
+    <el-row>
+      <el-col>
+        <div class="top">
+          <img src="@/assets/index/sy_bj1@2x.png" alt="">
+        </div>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :offset="3" :span="18">
+        <div class="context">
+          <div class="news_center">
 
+
+            <div class="title">{{ $t('message.news_center') }}</div>
+            <div class="divider">
+              <div class="divider_left">
+                <img src="@/assets/index/sy_icon_gd.png" alt="">
+              </div>
+              <div class="name">News Center</div>
+              <div class="divider_right">
+                <img src="@/assets/index/sy_icon_gd1.png" alt="">
+              </div>
+            </div>
+
+            <div class="slideshow">
+              <el-carousel trigger="click" height="51rem">
+                <el-carousel-item v-for="item in 4" :key="item">
+                  <div>
+                    <img src="@/assets/index/t1@2x.png" alt="">
+                    <div class="bottom_title">
+                      <el-row>
+                        <el-col :offset="2" :span="18">
+                          {{ item }}sdamdnalkdasdnlkadlajsdlksadjajdknakdnakldnlasnlsa
+                        </el-col>
+                      </el-row>
+                    </div>
+                  </div>
+                </el-carousel-item>
+              </el-carousel>
+            </div>
+
+
+
+          </div>
+
+
+
+          <div class="">
+
+          </div>
+
+
+
+        </div>
+      </el-col>
+    </el-row>
+  </div>
 </template>
 
 <script>
 export default {
-  name: "index"
+  name: "index",
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+#index {
+  .title {
+    margin: 1rem auto 1rem;
+    width: 23.2rem;
+    height: 5.9rem;
+    background: #1956BC;
+    border-radius: 2.95rem;
+    font-size: 2.6rem;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFFFFF;
+    line-height: 5.9rem;
+    text-align: center;
+  }
 
+  .divider {
+    width: 70rem;
+    margin: 0 auto 1rem;
+    clear: left;
+    height: 3rem;
+    line-height: 3rem;
+
+    div {
+      float: left;
+    }
+
+    .name {
+      font-size: 2rem;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #1956BC;
+      margin-left: 3rem;
+      margin-right: 3rem;
+    }
+  }
+
+  .top {
+
+    img {
+      width: 100%;
+    }
+  }
+
+  .context {
+    .news_center {
+    }
+  }
+
+  .slideshow{
+
+    .el-carousel__arrow{
+      top: 93%;
+      display: block !important;
+    }
+    .bottom_title{
+      width: 100%;
+      height: 7rem;
+      background: #1956BC;
+      opacity: 0.89;
+      position: absolute;
+      bottom: 0;
+      line-height: 7rem;
+      font-size: 2rem;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #FFFFFF;
+    }
+    img{
+      width: 100%;
+    }
+  }
+}
 </style>