00

.env.development

@@ -3,9 +3,9 @@ ENV = 'development'
 
 # EBTS/开发环境
 #VUE_APP_BASE_API = '/dev-api'
-VUE_APP_BASE_API = 'http://localhost:8096/dev-api'
+#VUE_APP_BASE_API = 'http://localhost:8096/dev-api'
 SITE_TYPE = 'NEd5n92EMIpyyBslaNqsRgE'
-#VUE_APP_BASE_API = 'http://sistapi.hchyun.cn/dev-api'
+VUE_APP_BASE_API = 'http://sistapi.hchyun.cn/dev-api'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

src/api/index.js

@@ -31,3 +31,35 @@ export function getNode(data) {
     data:data
   })
 }
+// 查询测试列表
+export function getArticleList(data) {
+  return request({
+    url: '/web/articlelist',
+    method: 'post',
+    data:data
+  })
+}
+
+
+// 查询测试列表
+export function crumbs(id) {
+  return request({
+    url: '/web/crumbs',
+    method: 'post',
+    data:{
+      id:id
+    }
+  })
+}
+
+
+// 查询测试列表
+export function banner(type) {
+  return request({
+    url: '/web/banner',
+    method: 'post',
+    data:{
+      type:type
+    }
+  })
+}

src/main.js

@@ -1,4 +1,5 @@
 import Vue from 'vue'
+import Vuex from 'vuex'
 import App from './App.vue'
 import router from './router'
 import i18n from './i18n/i18n'
@@ -9,8 +10,31 @@ import 'element-ui/lib/theme-chalk/display.css';
 
 Vue.config.productionTip = false
 Vue.use(ElementUI)
+Vue.use(Vuex)
+const store = new Vuex.Store({
+  state: {
+    isEnglish: false,
+    menuList :{},
+  },
+  mutations: {
+    increment (state) {
+      state.count++
+    }
+  },
+  computed:{
+    setEnglish(isEnglish){
+      this.store.isEnglish = isEnglish
+    },
+  },
+  getters:{
+    getEnglish(){
+      return this.store.isEnglish
+    }
+  }
+})
 new Vue({
   i18n,
   router,
+  store: store,
   render: h => h(App)
 }).$mount('#app')

src/utils/ebts.js

@@ -0,0 +1,190 @@
+/**
+ * 通用js方法封装处理
+ * Copyright (c) 2021 ebts
+ */
+
+const baseURL = process.env.VUE_APP_BASE_API
+
+// 日期格式化
+export function parseTime(time, pattern) {
+  if (arguments.length === 0 || !time) {
+    return null
+  }
+  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+  let date
+  if (typeof time === 'object') {
+    date = time
+  } else {
+    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+      time = parseInt(time)
+    } else if (typeof time === 'string') {
+      time = time.replace(new RegExp(/-/gm), '/');
+    }
+    if ((typeof time === 'number') && (time.toString().length === 10)) {
+      time = time * 1000
+    }
+    date = new Date(time)
+  }
+  const formatObj = {
+    y: date.getFullYear(),
+    m: date.getMonth() + 1,
+    d: date.getDate(),
+    h: date.getHours(),
+    i: date.getMinutes(),
+    s: date.getSeconds(),
+    a: date.getDay()
+  }
+  const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
+    let value = formatObj[key]
+    // Note: getDay() returns 0 on Sunday
+    if (key === 'a') {
+      return ['日', '一', '二', '三', '四', '五', '六'][value]
+    }
+    if (result.length > 0 && value < 10) {
+      value = '0' + value
+    }
+    return value || 0
+  })
+  return time_str
+}
+
+// 表单重置
+export function resetForm(refName) {
+  if (this.$refs[refName]) {
+    this.$refs[refName].resetFields();
+  }
+}
+
+// 添加日期范围
+export function addDateRange(params, dateRange) {
+  var search = params;
+  search.beginTime = "";
+  search.endTime = "";
+  if (null != dateRange && '' != dateRange) {
+    search.beginTime = dateRange[0];
+    search.endTime = dateRange[1];
+  }
+  return search;
+}
+
+// 添加搜索创建时间日期范围
+export function addCreateDateRange(params, dateRange) {
+  var search = params;
+  let data = {
+    beginCreateTime: "",
+    endCreateTime: "",
+  };
+  if (null != dateRange && '' != dateRange) {
+    data.beginCreateTime = dateRange[0];
+    data.endCreateTime = dateRange[1];
+  }
+  search.parameter = JSON.stringify(data)
+  return search;
+}
+
+// 回显数据字典
+export function selectDictLabel(datas, value) {
+  try {
+    var actions = [];
+    Object.keys(datas).some((key) => {
+      if (datas[key].dictValue == ('' + value)) {
+        actions.push(datas[key].dictLabel);
+        return true;
+      }
+    })
+    return actions.join('');
+  }catch (e) {
+    console.log(e)
+    return null
+  }
+}
+
+// 回显数据字典
+export function selectDictCode(datas, value) {
+  var actions = [];
+  Object.keys(datas).some((key) => {
+    if (datas[key].dictCode == ('' + value)) {
+      actions.push(datas[key].dictLabel);
+      return true;
+    }
+  })
+  return actions.join('');
+}
+
+// 回显数据字典（字符串数组）
+export function selectDictLabels(datas, value, separator) {
+  var actions = [];
+  var currentSeparator = undefined === separator ? "," : separator;
+  var temp = value.split(currentSeparator);
+  Object.keys(value.split(currentSeparator)).some((val) => {
+    Object.keys(datas).some((key) => {
+      if (datas[key].dictValue == ('' + temp[val])) {
+        actions.push(datas[key].dictLabel + currentSeparator);
+      }
+    })
+  })
+  return actions.join('').substring(0, actions.join('').length - 1);
+}
+
+// 通用下载方法
+export function download(fileName) {
+  window.location.href = baseURL + "/common/download?fileName=" + encodeURI(fileName) + "&delete=" + true;
+}
+
+// 字符串格式化(%s )
+export function sprintf(str) {
+  var args = arguments, flag = true, i = 1;
+  str = str.replace(/%s/g, function () {
+    var arg = args[i++];
+    if (typeof arg === 'undefined') {
+      flag = false;
+      return '';
+    }
+    return arg;
+  });
+  return flag ? str : '';
+}
+
+// 转换字符串，undefined,null等转化为""
+export function praseStrEmpty(str) {
+  if (!str || str == "undefined" || str == "null") {
+    return "";
+  }
+  return str;
+}
+
+/**
+ * 构造树型结构数据
+ * @param {*} data 数据源
+ * @param {*} id id字段 默认 'id'
+ * @param {*} parentId 父节点字段 默认 'parentId'
+ * @param {*} children 孩子节点字段 默认 'children'
+ * @param {*} rootId 根Id 默认 0
+ */
+export function handleTree(data, id, parentId, children, rootId) {
+  try {
+
+    id = id || 'id'
+    parentId = parentId || 'parentId'
+    children = children || 'children'
+    rootId = rootId || Math.min.apply(Math, data.map(item => {
+      return item[parentId]
+    })) || 0
+    //对源数据深度克隆
+    const cloneData = JSON.parse(JSON.stringify(data))
+    //循环所有项
+    const treeData = cloneData.filter(father => {
+      let branchArr = cloneData.filter(child => {
+        //返回每一项的子级数组
+        return father[id] === child[parentId]
+      });
+      branchArr.length > 0 ? father.children = branchArr : '';
+      //返回第一层
+      return father[parentId] === rootId;
+    });
+    return treeData != '' ? treeData : data;
+  } catch (e) {
+    console.log(e)
+    return null;
+  }
+}

src/views/content/components/Introduction.vue

@@ -2,18 +2,10 @@
   <div class="Introduction">
     <el-row>
       <el-col>
-        <div class="tab">
-          <router-link to="/">首页</router-link>
-          <span> > </span>
-          <router-link to="">学院概况</router-link>
-          <span> > </span>
-          <span style="color: #1956BC;font-size: 1.4rem">学院简介</span>
-        </div>
         <div class="context">
           <div class="title">{{value.title}}</div>
           <div class="text" v-html="value.content"></div>
         </div>
-<!--        {{value}}-->
       </el-col>
     </el-row>
   </div>
@@ -24,9 +16,15 @@ export default {
   name: "Introduction",
   props: {
     value: {
-      type: String,
-      default: "",
+      type: Object,
+      default: {
+        title:"12",
+        content:"12"
+      },
     },
+  },
+  data(){
+    return{}
   }
 }
 </script>

src/views/content/components/dire_data.vue

@@ -0,0 +1,109 @@
+<template>
+<div class="dire_data">
+
+  <el-row v-for="(dire,index) in value" :key="index">
+    <!--正文内容-->
+    <el-col class="context">
+      <el-row class="context_el-row">
+        <el-col :span="2" :offset="1">
+          <img class="context_img" src="@/assets/teaching_staff/eji_icon_ys.png" alt="">
+        </el-col>
+        <el-col :span="3" class="context_name">{{ dire.name }}</el-col>
+        <el-col :span="16">
+          <hr class="context_hr">
+        </el-col>
+        <el-row v-for="(chile,index) in dire.children" :key="index">
+          <el-col class="name" :offset="1" :span="23">
+            {{ chile.name }}<span v-if="chile.children.length>1">({{chile.children.length}}人)</span>
+          </el-col>
+          <el-row>
+            <el-col class="text" :offset="1" :span="23">
+              <div v-for="(item,index) in chile.children" :key="index">{{ item.name }}</div>
+            </el-col>
+          </el-row>
+        </el-row>
+      </el-row>
+    </el-col>
+  </el-row>
+</div>
+</template>
+
+<script>
+export default {
+  name: "dire_data",
+  data() {
+    return {
+      width: document.documentElement.clientWidth
+    }
+  },
+  props:{
+    value: {
+      type: Array,
+      default: [{
+        name: "学院",
+        children: [
+          {
+            name: "办公室",
+            children: [
+              {
+                children: [],
+                name: "人员1"
+              },
+            ],
+          }
+        ],
+      }],
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+
+.context {
+  margin: 3rem 2rem;
+  padding-bottom: 3rem;
+  //width: 84.3rem;
+  background: #FFFFFF;
+
+  .context_el-row {
+    margin-top: 2rem;
+
+    .context_img {
+      width: 2.2rem;
+    }
+
+    .context_name {
+      font-size: 1.6rem;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #1956BC;
+      line-height: 2.2rem;
+    }
+
+    .context_hr {
+      line-height: 2.2rem;
+      margin-top: 1.1rem;
+      border: #1956BC solid 0.1rem;
+    }
+  }
+
+  .name {
+    margin-top: 2rem;
+    font-size: 1.4rem;
+    font-weight: 600;
+    color: #1956BC;
+  }
+  .text {
+    font-size: 1.2rem;
+    color: #3C3C3C;
+    clear: left;
+    div {
+      float: left;
+      margin-top: .4rem;
+      width: 7.4%;
+    }
+  }
+}
+
+</style>

src/views/content/components/list.vue

@@ -0,0 +1,156 @@
+<template>
+  <div class="list">
+<!--{{value}}-->
+    <el-row>
+      <!--正文内容-->
+      <el-col class="context">
+        <div v-for="(item,index) in value.data" class="tw">
+          <el-row>
+            <el-col :xs="6" :sm="6" :md="5" :lg="4" :xl="4">
+              <div class="tw_time">
+                <div class="tw_top">
+                  {{getDay(item.publishTime)}}
+                </div>
+                <div class="tw_bottoms">
+                  {{getTime(item.publishTime)}}
+                </div>
+              </div>
+            </el-col>
+            <el-col :xs="18" :sm="18" :md="18" :lg="16" :xl="17">
+              <div class="tw_context">
+                <div class="tw_context_title">
+                  {{item.title}}
+                </div>
+                <div class="tw_context_text" v-html="item.content"></div>
+              </div>
+            </el-col>
+            <el-col v-show="width>=992" :xs="1" :sm="1" :md="3" :lg="4" :xl="3">
+              <div class="tw_img">
+                <img :src="item.imgurl" alt="">
+              </div>
+            </el-col>
+          </el-row>
+          <hr v-if="index != value.data.length-1" style="border: 0.1rem solid #E6E6E6;" class="hr">
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "list",
+  props:{
+    value: {
+      type: Array,
+      default: {
+        data:[{
+          content: "",
+          title: "",
+          publishTime: "2022-01-15 17:02:13",
+          imgurl: "http://sistfile.hchyun.cn/2022/01/15/b0904e59-25d4-433e-bd0f-e23940d6267d.png",
+        }]
+      },
+    },
+  },
+  data() {
+    return {
+      width: document.documentElement.clientWidth
+    }
+  },
+  methods:{
+    getDay(time){
+      let day = new Date(time).getDate();
+      return day
+    },
+    getTime(time){
+      let date = new Date(time);
+      return date.getFullYear() +"-" + date.getMonth()+1
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+.context {
+  margin: 3rem 2rem;
+  padding-bottom: 3rem;
+  //width: 84.3rem;
+  background: #FFFFFF;
+
+  .tw {
+    margin-top: 4rem;
+  }
+
+  .tw_img{
+    width: 100%;
+    text-align: left;
+    img{
+      width: 90%;
+    }
+  }
+  .tw_time {
+    border-right: .1rem solid #D5D5D5;
+    height: 10rem;
+    width: 10rem;
+    color: #1956BC;
+    text-align: center;
+
+    .tw_top {
+      height: 8rem;
+      width: 100%;
+      line-height: 8rem;
+      font-size: 5.2rem;
+    }
+
+    .tw_bottoms {
+      height: 2rem;
+      width: 100%;
+      font-size: 1.4rem;
+    }
+  }
+
+  .tw_context {
+
+    font-family: PingFangSC-Medium, PingFang SC;
+    color: #161616;
+
+
+    .tw_context_title {
+      overflow:hidden; //超出的文本隐藏
+      text-overflow:ellipsis; //溢出用省略号显示
+      white-space:nowrap; //溢出不换行
+      font-size: 2rem;
+      font-weight: 600;
+      padding-right: 2rem;
+
+    }
+
+    .tw_context_text {
+      margin-top: .8rem;
+      font-size: 1.6rem;
+      font-weight: 400;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display:-webkit-box; //作为弹性伸缩盒子模型显示。
+      -webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
+      -webkit-line-clamp:3; //显示的行
+    }
+  }
+
+  .title {
+    font-size: 2.4rem;
+    font-weight: 500;
+    color: #1956BC;
+    text-align: center;
+  }
+
+  .text {
+    margin-top: 2rem;
+    font-size: 1.2rem;
+    font-weight: 400;
+    color: #3C3C3C;
+  }
+}
+</style>

src/views/content/index.vue

@@ -4,7 +4,12 @@
       <el-col :span="24">
         <!--首页图片-->
         <div class="top">
+          <span v-if="bgImage != ''">
+            <img :src="bgImage" alt="">
+          </span>
+          <span v-else>
           <img src="@/assets/school_profile/bj123.png" alt="">
+          </span>
         </div>
       </el-col>
     </el-row>
@@ -25,7 +30,7 @@
                   {{ nav.title }}
                 </div>
               </div>
-              <div v-if="index !== showIndex" class="lab_list"  @click="navClick(nav,index)">
+              <div v-if="index !== showIndex" class="lab_list" @click="navClick(nav,index)">
                 <div class="lab_img">
                   <img src="@/assets/school_profile/eji_icon_xz.png" alt="">
                 </div>
@@ -34,37 +39,28 @@
                 </div>
               </div>
             </div>
-<!--            <div class="lab_list">-->
-<!--              <div class="lab_img">-->
-<!--                <img src="@/assets/school_profile/eji_icon_xz.png" alt="">-->
-<!--              </div>-->
-<!--              <div class="lab_title">-->
-<!--                学院领导-->
-<!--              </div>-->
-<!--            </div>-->
-<!--            <div class="lab_list">-->
-<!--              <div class="lab_img">-->
-<!--                <img src="@/assets/school_profile/eji_icon_xz.png" alt="">-->
-<!--              </div>-->
-<!--              <div class="lab_title">-->
-<!--                机构设置-->
-<!--              </div>-->
-<!--            </div>-->
-<!--            <div class="lab_list">-->
-<!--              <div class="lab_img">-->
-<!--                <img src="@/assets/school_profile/eji_icon_xz.png" alt="">-->
-<!--              </div>-->
-<!--              <div class="lab_title">-->
-<!--                院长致辞-->
-<!--              </div>-->
-<!--            </div>-->
           </div>
         </div>
       </el-col>
       <el-col :xs="20" :sm="20" :md="15" :lg="14" :xl="12">
-        <Introduction :value="contextData" v-if="type == 1"/>
-
-
+        <el-row>
+          <el-col>
+            <div class="tab">
+              <router-link to="/">首页</router-link>
+              <span> > </span>
+              <router-link to="">{{ crumbs.one.title }}</router-link>
+              <span> > </span>
+              <span style="color: #1956BC;font-size: 1.4rem">{{ crumbs.two.title }}</span>
+            </div>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col>
+            <Introduction :value="contextData" v-if="type == 1"/>
+            <List :value="contextData" v-if="type == 2"/>
+            <DireData :value="contextData" v-if="type == 3"/>
+          </el-col>
+        </el-row>
 
 
       </el-col>
@@ -76,13 +72,18 @@
 </template>
 
 <script>
-import {getNode} from "@/api";
-import  Introduction from './components/Introduction.vue'
+import {getNode,crumbs} from "@/api";
+import Introduction from './components/Introduction.vue'
+import List from './components/list.vue'
+import DireData from './components/dire_data.vue'
+import {handleTree} from "@/utils/ebts";
 
 export default {
   name: "index",
-  components:{
+  components: {
     Introduction,
+    List,
+    DireData,
   },
   data() {
     return {
@@ -90,37 +91,57 @@ export default {
       navId: null,
       navList: [],
       showIndex: 0,
-      contextData:{},
-      type:1,
+      contextData: {},
+      type: 2,
+      bgImage:"",
+      crumbs:{},
     }
   },
   watch: {
     $route(to, from) {
-      console.log(to.path);
+      this.getNav()
     }
   },
   created() {
-    this.navId = this.$route.params && this.$route.params.navId;
-    this.navList = []
-    getNode({id: this.navId}).then(res => {
-      console.log(res)
-      this.navList = res.data
-      this.$refs.lab.style.height = this.navList.length*8 + 8 +'rem'
-      this.getContent(this.navList[0])
+    this.getNav()
+    crumbs(this.navId).then(res=>{
+      this.crumbs = res.data
     })
   },
   methods: {
-    getContent(menu) {
-      getNode({id: menu.encodeId}).then(res => {
-        console.log(res)
-        this.contextData = res.data
+    getNav() {
+      this.navId = this.$route.params && this.$route.params.navId;
+      this.navList = []
+      getNode({id: this.navId}).then(res => {
+        this.navList = res.data
+        try {
+          this.$refs.lab.style.height = this.navList.length * 8 + 10 + 'rem'
+        }catch (e) {
+        }
+        this.getContent(this.navList[0])
       })
     },
-    navClick(nav,index){
-      console.log(index,index != this.showIndex,this.showIndex)
-      if (index != this.showIndex){
+    getContent(menu) {
+      this.type = menu.type
+      this.contextData = null
+      this.bgImage = menu.link
+
+      getNode({id: menu.encodeId}).then(res => {
+        if (this.type == 2){
+          this.contextData = {
+            data:res.rows,
+            total:res.total
+          }
+        }else if (this.type == 1){
+          this.contextData = res.data
+        }else if (this.type == 3){
+          this.contextData = handleTree(res.data, "id", "pid",null,null)
+        }
+      })
+    },
+    navClick(nav, index) {
+      if (index != this.showIndex) {
         this.showIndex = index
-        console.log(nav)
         this.type = nav.type
         this.getContent(nav)
       }
@@ -153,11 +174,13 @@ export default {
     .lab_list:last-child {
       border: none;
     }
-    .lab_div{
+
+    .lab_div {
       border-bottom: 0.1rem solid #94BCFF !important;
       margin-left: 1rem;
     }
-    .lab_div:last-child{
+
+    .lab_div:last-child {
       border-bottom: none !important;
       padding-bottom: 1.5rem;
     }
@@ -205,6 +228,17 @@ export default {
   }
 }
 
+.tab {
+  margin-left: 1.9rem;
+  margin-top: 1.5rem;
+  font-weight: 400;
+
+  a {
+    text-decoration: none;
+    font-size: 1.4rem !important;
+    color: #3C3C3C;
+  }
+}
 
 @media screen and (max-width: 980px) {
   .left_lab {

src/views/header/index.vue

@@ -156,7 +156,6 @@ export default {
     }
   },
   created() {
-    console.log(this.width)
     getNavigation({}).then(res=>{
       this.menuData = res.data
     })
@@ -169,10 +168,13 @@ export default {
       let lang = ''
       if (this.$i18n.locale === 'en') {
         lang = 'cn'
+
         this.english = false;
+        this.$store.state.isEnglish= this.english
       } else {
         lang = 'en'
         this.english = true;
+        this.$store.state.isEnglish= this.english
       }
       this.$i18n.locale = lang;
     }

src/views/index/components/bottom.vue

@@ -85,7 +85,6 @@ export default {
     }
   },
   created() {
-    console.log(this.form)
     getStatistic(this.form).then(res=>{
       this.data = res.data
     })

src/views/index/components/news_center.vue

@@ -30,13 +30,13 @@
       <el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14">
         <div class="slideshow">
           <el-carousel trigger="click" height="23.3vw">
-            <el-carousel-item v-for="item in 4" :key="item">
+            <el-carousel-item v-for="(item,index) in bannerDate" :key="index">
               <div>
-                <img src="@/assets/index/news_center/t1@2x.png" alt="">
+                <img :src="item.imgurl" alt="">
                 <div class="bottom_title">
                   <el-row>
                     <el-col :offset="2" :span="18">
-                      {{ item }}喜报！信息学院师生在中国大学生计算机设计大赛中取得历史性突破！
+                      {{ item.title }}
                     </el-col>
                   </el-row>
                 </div>
@@ -54,43 +54,13 @@
       </el-col>
       <el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14">
         <el-row class="news">
-          <el-col :xs="12" :sm="12" :md="12" :lg="6" :xl="6" >
+          <el-col v-for="(news,index) in newsDate" :key="index" :xs="12" :sm="12" :md="12" :lg="6" :xl="6" >
             <div class="news_context">
               <div class="news_context_img">
-                <img src="@/assets/index/news_center/t2.png" alt="">
+                <img :src="news.imgurl" alt="">
               </div>
               <div class="news_context_text">
-                信息引领，勇于拼搏——信息科学与技术学院在全校教职工篮球赛获佳绩
-              </div>
-            </div>
-          </el-col>
-          <el-col :xs="12" :sm="12" :md="12" :lg="6" :xl="6" >
-            <div class="news_context">
-              <div class="news_context_img">
-                <img src="@/assets/index/news_center/t3.png" alt="">
-              </div>
-              <div class="news_context_text">
-                “学党史 担使命”一班一品牌，班班展风采——信息科学与技术学院2020-2021…
-              </div>
-            </div>
-          </el-col>
-          <el-col :xs="12" :sm="12" :md="12" :lg="6" :xl="6">
-            <div class="news_context">
-              <div class="news_context_img">
-                <img src="@/assets/index/news_center/t4.png" alt="">
-              </div>
-              <div class="news_context_text">
-                西南交大第十届青年教师教学竞赛信息学院初赛顺利举行
-              </div>
-            </div>
-          </el-col>
-          <el-col :xs="12" :sm="12" :md="12" :lg="6" :xl="6">
-            <div class="news_context">
-              <div class="news_context_img">
-                <img src="@/assets/index/news_center/t5.png" alt="">
-              </div>
-              <div class="news_context_text">
-                “奋斗青春 梦想起航” 西南交通大学信息科学与技术学院2021级新生开学典礼
+                {{news.title}}
               </div>
             </div>
           </el-col>
@@ -116,8 +86,36 @@
 </template>
 
 <script>
+import {banner, getArticleList} from "@/api";
+
 export default {
-  name: "news_center"
+  name: "news_center",
+  data(){
+    return{
+      newsDate:[],
+      bannerDate:[]
+    }
+  },
+  created() {
+    this.getList()
+    this.getBanner()
+  },
+  methods: {
+    getList(){
+      getArticleList({
+        type:"XC7D8m5gkr35BX1b4Otiln4",
+        pageNum: 1,
+        pageSize: 4
+      }).then(res=>{
+        this.newsDate = res.rows
+      })
+    },
+    getBanner(){
+      banner("NEd5n92EMIpyyBslaNqsRgE").then(res=>{
+        this.bannerDate = res.data
+      })
+    }
+  },
 }
 </script>
 

src/views/index/components/party_building_activities.vue

@@ -64,88 +64,25 @@
         <div class="grid-content"></div>
       </el-col>
       <el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14" class="phe">
-        <div class="phe_row">
+        <div class="phe_row" v-for="(item,index) in listData" :key="index">
           <el-row>
             <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4">
               <div class="phe_img">
-                <img src="@/assets/index/party_building_activities/1.png" alt="">
+                <img :src="item.imgurl" alt="">
               </div>
             </el-col>
             <el-col :xs="18" :sm="18" :md="18" :lg="17" :xl="17" :span="17">
               <div class="phe_context">
-                <div class="phe_context_title">喜报！信息学院师生在中国大学生计算机设计大赛中取得历史性突破！</div>
-                <div class="phe_context_text">
-                  为促进学生学业发展、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展转专业同学分享交流会。信息科学与技术学院党委副书记马琼、本科生教学主管蒋燕老师…
+                <div class="phe_context_title">{{item.title}}</div>
+                <div class="phe_context_text" v-html="item.content">
                 </div>
               </div>
             </el-col>
             <el-col :xs="22" :sm="22" :md="22" :lg="3" :xl="3">
-              <div class="phe_time">2021.11.10</div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="phe_row">
-          <el-row>
-            <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4">
-              <div class="phe_img">
-                <img src="@/assets/index/party_building_activities/2.png" alt="">
-              </div>
-            </el-col>
-            <el-col :xs="18" :sm="18" :md="18" :lg="17" :xl="17" :span="17">
-              <div class="phe_context">
-                <div class="phe_context_title">信息引领，勇于拼搏——信息科学与技术学院在全校教职工篮球赛获佳绩</div>
-                <div class="phe_context_text">
-                  为加强学院学风建设，提升学生英语能力，2021年10月25日晚，信息科学与技术学院组织开展英语四级备考指导会。本次指导会邀请学校外国语学院李捷老师担任主讲，信息学院2021级辅导…
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="22" :sm="22" :md="22" :lg="3" :xl="3">
-              <div class="phe_time">2021.11.10</div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="phe_row">
-          <el-row>
-            <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4">
-              <div class="phe_img">
-                <img src="@/assets/index/party_building_activities/3.png" alt="">
-              </div>
-            </el-col>
-            <el-col :xs="18" :sm="18" :md="18" :lg="17" :xl="17" :span="17">
-              <div class="phe_context">
-                <div class="phe_context_title">“学党史 担使命”一班一品牌，班班展风采——信息科学与技术学院2020-…</div>
-                <div class="phe_context_text">
-                  为普及国际化教育，提升学生对国际化认知，2021年10月25日晚，信息科学与技术学院开展了新生入学教育—国际化讲座。讲座特别邀请了学校国际合作与交流处马瑶和北京新东方教育科技公…
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="22" :sm="22" :md="22" :lg="3" :xl="3">
-              <div class="phe_time">2021.11.10</div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="phe_row">
-          <el-row>
-            <el-col :xs="6" :sm="6" :md="6" :lg="4" :xl="4">
-              <div class="phe_img">
-                <img src="@/assets/index/party_building_activities/4.png" alt="">
-              </div>
-            </el-col>
-            <el-col :xs="18" :sm="18" :md="18" :lg="17" :xl="17" :span="17">
-              <div class="phe_context">
-                <div class="phe_context_title">“奋斗青春 梦想起航” 西南交通大学信息科学与技术学院2021级新生开学典礼</div>
-                <div class="phe_context_text">
-                  信息科学与技术学院于2021年10月21日在九里校区J4318、J4319开展了面向2021级研究生的职业生涯规划入学专题教育。本次活动特别邀请到了西南交通大学党委学生工作部副部长、GCDF…
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="22" :sm="22" :md="22" :lg="3" :xl="3">
-              <div class="phe_time">2021.11.10</div>
+              <div class="phe_time">{{getTitme(item.publishTime)}}</div>
             </el-col>
           </el-row>
+          <hr v-if="index != listData.length-1" style="border: 0.1rem solid #E6E6E6;" class="hr">
         </div>
       </el-col>
     </el-row>
@@ -154,12 +91,36 @@
 
 <script>
 import SlideshowCard from './slideshow_card'
+import {getArticleList} from "@/api";
 
 export default {
   name: "party_building_activities",
   components: {
     SlideshowCard
   },
+  data(){
+    return{
+      listData:[]
+    }
+  },
+  created() {
+    this.getListData()
+  },
+  methods:{
+    getListData(){
+      getArticleList({
+        type: "LlBbF5OM6ILqxX69TIg7ipg",
+        pageNum: 1,
+        pageSize: 6
+      }).then(res => {
+        this.listData = res.rows
+      })
+    },
+    getTitme(time){
+      let date = new Date(time)
+      return date.getFullYear() +"." + date.getMonth()+1 +"." + date.getDate()
+    }
+  }
 }
 </script>
 

src/views/index/components/scientific_research_trends.vue

@@ -30,141 +30,31 @@
       </el-col>
       <el-col class="scientific_context" :xs="22" :sm="20" :md="20" :lg="18" :xl="14">
         <el-row>
-          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+          <el-col v-for="(item,index) in scientificData" :key="index" :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 :span="2" class="img">
+                <img v-if="index == 0" src="@/assets/index/scientific_research_trends/sy_icon_bh1.png" alt="">
+                <img v-if="index == 1" src="@/assets/index/scientific_research_trends/sy_icon_bh2.png" alt="">
+                <img v-if="index == 2" src="@/assets/index/scientific_research_trends/sy_icon_bh3.png" alt="">
+                <img v-if="index == 3" src="@/assets/index/scientific_research_trends/sy_icon_bh4.png" alt="">
+                <img v-if="index == 4" src="@/assets/index/scientific_research_trends/sy_icon_bh5.png" alt="">
+                <img v-if="index == 5" src="@/assets/index/scientific_research_trends/sy_icon_bh6.png" alt="">
+                <img v-if="index == 6" src="@/assets/index/scientific_research_trends/sy_icon_bh7.png" alt="">
+                <img v-if="index == 7" src="@/assets/index/scientific_research_trends/sy_icon_bh8.png" alt="">
+                <img v-if="index == 8" src="@/assets/index/scientific_research_trends/sy_icon_bh9.png" alt="">
+                <img v-if="index == 9" src="@/assets/index/scientific_research_trends/sy_icon_bh10.png" alt="">
               </el-col>
-              <el-col :span="16" class="text">科研院关于组织申报国家重点研发计划</el-col>
+              <el-col :span="16" class="text">{{ item.title }}</el-col>
               <el-col :span="4">
-                <div class="time">2021.10.10</div>
+                <div class="time">{{ parseTime(item.publishTime) }}</div>
+                <!--                <div class="time">{{ item.publishTime }}</div>-->
               </el-col>
             </el-row>
             <div class="scientific_context_divider">
-              <hr style="border: 0.1rem solid #E6E6E6;">
+              <hr v-if="index < 8" style="border: 0.1rem solid #E6E6E6;">
+              <hr v-if="!width && index == 8" 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>
@@ -198,85 +88,20 @@
       </el-col>
       <el-col class="academia_context" :xs="22" :sm="20" :md="20" :lg="18" :xl="14">
         <el-row>
-          <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
+          <el-col v-for="(item,index) in academiaData" :key="index" :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="16" class="text">{{item.title}}</el-col>
               <el-col :span="4">
-                <div class="time">2021.10.01</div>
+                <div class="time">{{ parseTime(item.publishTime) }}</div>
               </el-col>
             </el-row>
             <div class="academia_context_divider">
-              <hr style="border: 0.1rem solid #E6E6E6;">
+              <hr v-if="index < 4" style="border: 0.1rem solid #E6E6E6;">
+              <hr v-if="!width && index == 4" 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>
@@ -299,13 +124,45 @@
 </template>
 
 <script>
+import {getArticleList} from "@/api";
+import {parseTime} from '@/utils/ebts'
+
 export default {
   name: "scientific_research_trends",
   data() {
     return {
-      width: document.documentElement.clientWidth
+      width: document.documentElement.clientWidth>=992,
+      scientificData: [],
+      academiaData: [],
     }
   },
+  created() {
+    this.getScientificList()
+    this.getAcademiaList()
+  },
+  methods: {
+    getScientificList() {
+      getArticleList({
+        type: "VPteru0OeW6GgYObAewMupY",
+        pageNum: 1,
+        pageSize: 10
+      }).then(res => {
+        this.scientificData = res.rows
+      })
+    },
+    getAcademiaList() {
+      getArticleList({
+        type: "KBwgShsEiDolV91qmaWdWJc",
+        pageNum: 1,
+        pageSize: 6
+      }).then(res => {
+        this.academiaData = res.rows
+      })
+    },
+    parseTime(time) {
+      return parseTime(time, '{y}-{m}-{d}')
+    }
+  }
 }
 </script>
 
@@ -419,7 +276,7 @@ export default {
   }
 }
 
-@media screen and  (min-width: 1100px) and (max-width: 1400px) {
+@media screen and (min-width: 1100px) and (max-width: 1400px) {
   .scientific_context_text {
     padding-left: 2rem !important;
 
@@ -430,7 +287,7 @@ export default {
   .academia_context_text {
     padding-left: 2rem !important;
 
-    .time{
+    .time {
       margin-left: 2rem !important;
     }
   }

src/views/index/components/slideshow_card.vue

@@ -1,71 +1,14 @@
 <template>
   <div class="banner-card">
     <ul class="ul">
-      <li>
+      <li v-for="(item,index) in bannerDate" :key="index">
         <div class="card_img">
           <img
-            src="@/assets/index/party_building_activities/t6.png"
+            :src="item.imgurl"
             alt=""/>
         </div>
         <div class="card_title">
-          信息学院“学党史，悟思想”微党课暨诚信考试承诺仪式顺利开展
-        </div>
-
-      </li>
-      <li>
-        <div class="card_img">
-          <img
-            src="@/assets/index/party_building_activities/t7.png"
-            alt=""
-          />
-        </div>
-        <div class="card_title">
-          读党史，感受中国共产党之伟大——信息学院主题党课活动顺利开展
-        </div>
-      </li>
-      <li>
-        <div class="card_img">
-
-          <img
-            src="@/assets/index/party_building_activities/t8.png"
-            alt=""
-          />
-        </div>
-        <div class="card_title">
-          信息科学与技术学院本科生第三支部开展党史教育活动
-        </div>
-      </li>
-      <li>
-        <div class="card_img">
-          <img
-            src="@/assets/index/party_building_activities/t9.png"
-            alt=""
-          />
-        </div>
-        <div class="card_title">
-          “迎党的生日、讲红色故事、悟初心使命”——本科第四党支部…
-        </div>
-      </li>
-      <li>
-        <div class="card_img">
-          <img
-            src="@/assets/index/party_building_activities/t10.png"
-            alt=""
-          />
-        </div>
-        <div class="card_title">
-          建党百年 信息报国——信息科学与技术学院备份
-        </div>
-      </li>
-      <li>
-        <div class="card_img">
-          <img
-            src="@/assets/index/party_building_activities/t6.png"
-            alt=""
-          />
-        </div>
-        <div class="card_title">
-          建党百年 信息报国——信息科学与技术学院备份
+          {{item.title}}
         </div>
       </li>
     </ul>
@@ -82,12 +25,15 @@
   </div>
 </template>
 <script>
+import {banner} from "@/api";
+
 export default {
   data() {
     return {
-      default: {
+      defaultConfig: {
 //默认值
         classArray: ["one", "two", "three", "four", "five", "six"],
+        // classArray: ["one", "two", "three", "four", "five"],
         leftSlider: true,
       },
       bannerWrap: null,
@@ -96,15 +42,23 @@ export default {
       classlist: null,
       leftBtn: null,
       rightBtn: null,
+      bannerDate:[]
     };
   },
+  beforeCreate() {
+    banner("STCplDRCWAA3zcFE0EBTcQI").then(res=>{
+      this.bannerDate = res.data
+    })
+  },
+  created() {
+  },
   methods: {
     constructor() {
       this.bannerWrap = document.getElementsByClassName("banner-card")[0];
       let lis = this.bannerWrap.getElementsByTagName("li");
 // 将类数组转化为数组
       this.lisArray = Array.from(lis);
-      this.classlist = this.default.classArray;
+      this.classlist = this.defaultConfig.classArray;
 //获取左右按钮
       this.leftBtn = document.getElementsByClassName("left-btn")[0];
       this.rightBtn = document.getElementsByClassName("right-btn")[0];
@@ -160,7 +114,9 @@ export default {
     },
   },
   mounted() {
-    this.constructor();
+    setTimeout(() =>{
+      this.constructor();
+    },1000);
   },
 };
 

src/views/index/components/teaching_student.vue

@@ -31,154 +31,33 @@
         <div class="grid-content"></div>
       </el-col>
       <el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14" class="phe">
-        <div class="tw">
+        <div class="tw" v-for="(item,index) in listData" :key="index">
           <el-row>
             <el-col :xs="5" :sm="5" :md="5" :lg="3" :xl="3">
               <div class="tw_time">
                 <div class="tw_top">
-                  28
+                  {{getDay(item.publishTime)}}
                 </div>
                 <div class="tw_bottoms">
-                  2021-10
+                  {{getTime(item.publishTime)}}
                 </div>
               </div>
             </el-col>
             <el-col :xs="19" :sm="19" :md="15" :lg="18" :xl="18">
               <div class="tw_context">
                 <div class="tw_context_title">
-                  不忘初心，展望未来——信息科学与技术学院开展转专业同学交流会
-                </div>
-                <div class="tw_context_text">
-                  为促进学生学业发展、给予2021年转专业同学有针对性的帮助，信息科学与技术学院于10月26日开展转专业同学分享交流会。信息科学与技术学院党委副书记马琼、本科生教学主管蒋燕老师…
+                  {{item.title}}
                 </div>
+                <div class="tw_context_text" v-html="item.content"></div>
               </div>
             </el-col>
             <el-col v-show="width" :md="3" :lg="3" :xl="3">
               <div class="tw_img">
-                <img src="@/assets/index/teaching_student/tw1.png" alt="">
-              </div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="tw">
-          <el-row>
-            <el-col :xs="5" :sm="5" :md="5" :lg="3" :xl="3">
-              <div class="tw_time">
-                <div class="tw_top">
-                  28
-                </div>
-                <div class="tw_bottoms">
-                  2021-10
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="19" :sm="19" :md="15" :lg="18" :xl="18">
-              <div class="tw_context">
-                <div class="tw_context_title">
-                  信息科学与技术学院开展英语四级备考指导会
-                </div>
-                <div class="tw_context_text">
-                  为加强学院学风建设，提升学生英语能力，2021年10月25日晚，信息科学与技术学院组织开展英语四级备考指导会。本次指导会邀请学校外国语学院李捷老师担任主讲，信息学院2021级辅导…
-                </div>
-              </div>
-            </el-col>
-            <el-col v-show="width" :md="3" :lg="3" :xl="3">
-              <div class="tw_img">
-                <img src="@/assets/index/party_building_activities/1.png" alt="">
-              </div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="tw">
-          <el-row>
-            <el-col :xs="5" :sm="5" :md="5" :lg="3" :xl="3">
-              <div class="tw_time">
-                <div class="tw_top">
-                  28
-                </div>
-                <div class="tw_bottoms">
-                  2021-10
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="19" :sm="19" :md="15" :lg="18" :xl="18">
-              <div class="tw_context">
-                <div class="tw_context_title">
-                  信息科学与技术学院新生入学教育—国际化讲座
-                </div>
-                <div class="tw_context_text">
-                  为普及国际化教育，提升学生对国际化认知，2021年10月25日晚，信息科学与技术学院开展了新生入学教育—国际化讲座。讲座特别邀请了学校国际合作与交流处马瑶和北京新东方教育科技公…
-                </div>
-              </div>
-            </el-col>
-            <el-col v-show="width" :md="3" :lg="3" :xl="3">
-              <div class="tw_img">
-                <img src="@/assets/index/party_building_activities/2.png" alt="">
-              </div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="tw">
-          <el-row>
-            <el-col :xs="5" :sm="5" :md="5" :lg="3" :xl="3">
-              <div class="tw_time">
-                <div class="tw_top">
-                  28
-                </div>
-                <div class="tw_bottoms">
-                  2021-10
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="19" :sm="19" :md="15" :lg="18" :xl="18">
-              <div class="tw_context">
-                <div class="tw_context_title">
-                  信息科学与技术学院2021级研究生职业生涯规划入学专题教育顺利开展
-                </div>
-                <div class="tw_context_text">
-                  信息科学与技术学院于2021年10月21日在九里校区J4318、J4319开展了面向2021级研究生的职业生涯规划入学专题教育。本次活动特别邀请到了西南交通大学党委学生工作部副部长、GCDF…
-                </div>
-              </div>
-            </el-col>
-            <el-col v-show="width" :md="3" :lg="3" :xl="3">
-              <div class="tw_img">
-                <img src="@/assets/index/party_building_activities/3.png" alt="">
-              </div>
-            </el-col>
-          </el-row>
-          <hr style="border: 0.1rem solid #E6E6E6;" class="hr">
-        </div>
-        <div class="tw">
-          <el-row>
-            <el-col :xs="5" :sm="5" :md="5" :lg="3" :xl="3">
-              <div class="tw_time">
-                <div class="tw_top">
-                  28
-                </div>
-                <div class="tw_bottoms">
-                  2021-10
-                </div>
-              </div>
-            </el-col>
-            <el-col :xs="19" :sm="19" :md="15" :lg="18" :xl="18">
-              <div class="tw_context">
-                <div class="tw_context_title">
-                  秋风瑟瑟，信息送暖 ——信息学院家庭经济困难学生资助政策座谈会
-                </div>
-                <div class="tw_context_text">
-                  为帮助家庭经济困难学生更深入了解学校资助体系及资助政策，信息科学与技术学院学工组于10月19日在X2321教室召开了家庭经济困难学生资助政策座谈会，信息学院学工组副组长廖凡老师、…
-                </div>
-              </div>
-            </el-col>
-            <el-col v-show="width" :md="3" :lg="3" :xl="3">
-              <div class="tw_img">
-                <img src="@/assets/index/party_building_activities/4.png" alt="">
+                <img :src="item.imgurl" alt="">
               </div>
             </el-col>
           </el-row>
+          <hr v-if="index != listData.length-1" style="border: 0.1rem solid #E6E6E6;" class="hr">
         </div>
       </el-col>
     </el-row>
@@ -200,13 +79,37 @@
 </template>
 
 <script>
+import {getArticleList} from "@/api";
+
 export default {
   name: "teaching_student",
   data(){
     return{
-      width:document.documentElement.clientWidth>=992
+      width:document.documentElement.clientWidth>=992,
+      listData:[]
     }
   },
+  created() {
+    this.getListData()
+  },
+  methods:{
+    getListData(){
+      getArticleList({
+        type: "--AMgi-Z8eHpj9W0a_fbhpk",
+        pageNum: 1,
+        pageSize:5
+      }).then(res => {
+        this.listData = res.rows
+      })
+    },
+    getDay(time){
+      return new Date(time).getDate()
+    },
+    getTime(time){
+      let date = new Date(time);
+      return date.getFullYear() +"-" + date.getMonth()+1
+    }
+  }
 }
 </script>