导航栏样式修改+专业概况

ant-design-vue-jeecg/src/views/cms/components/HeaderView.vue

@@ -85,10 +85,10 @@ export default {
   .navBox {
     height: 118px;
     .d-flex {
-      width: 67%;
+      width: 70%;
       min-width: 1030px;
       align-items: center;
-      font-size: 20px;
+      font-size: 18px;
       a {
         color: #fff;
       }

ant-design-vue-jeecg/src/views/cms/pages/Detail/DetailView.vue

@@ -2,9 +2,13 @@
   <div class="detail">
     <Header></Header>
     <div class="main">
-      <p class="title">成果展示</p>
+      <p class="title">{{this.$route.query.columnName}}</p>
       <div class="card">
-        首页<span>·</span>成果展示<span>·</span>教师获奖成果
+        {{this.$route.query.columnName}}
+        <span>·</span>
+        {{this.$route.query.title}}
+<!--        <span>·</span>-->
+<!--        教师获奖成果-->
       </div>
       <div class="mainDiv  clearfix">
         <div class="itemList">
@@ -51,6 +55,9 @@ export default {
   data() {
     return {
       current: 1,
+      title01:"",
+      title02:"",
+      title03:"",
       artical: {
         title:
           "标题标题标题标题标题标题标题标题标题标题标题标题标题，标题标题标题标题标题标题标题标题标题标题标题",
@@ -160,7 +167,7 @@ export default {
     .itemList {
       float: left;
       width: 1050px;
-      height: 300px;
+      /*height: 300px;*/
       /*overflow: auto;*/
       .articalTitle {
         font-size: 26px;
@@ -195,11 +202,33 @@ export default {
         color: #333333;
         line-height: 40px;
         text-indent: 2em;
+        img{
+          width: 100%!important;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+        }
       }
     }
     .trends {
       float: right;
-      height: 300px;
+      /*height: 300px;*/
       width: 400px;
 
       .title {

ant-design-vue-jeecg/src/views/cms/pages/professionalSummary/professionalSummary.vue

@@ -3,7 +3,7 @@
     <Header />
     <div class="box1">
       <div
-        v-for="(item, index) in headerList"
+        v-for="(item, index) in originalList"
         :key="item.id"
         :class="{ 'bigbox-reverse': index % 2 === 0 }"
         class="bigbox"
@@ -17,19 +17,32 @@
           style="width: 66%;"
         >
           <div class="card-header">
-            <span class="headername">{{ item.headername }}</span>
+            <span class="headername">{{ item.title }}</span>
-            <router-link :to="{ path: getRouterLink(item.id) }" class="alltext">查看全部<i class="el-icon-arrow-right"></i></router-link>
+<!--            <router-link :to="{ path: getRouterLink(item.id) }" class="alltext">查看全部<i class="el-icon-arrow-right"></i></router-link>-->
+            <a @click="goToDetail(item)" class="alltext">查看全部<i class="el-icon-arrow-right"></i></a>
           </div>
-          <div class="headercontent">{{ item.content }}</div>
+
+
+
+
+
+
+          <div class="headercontent" style="color: #9E9E9E!important;font-size: 14px!important;" v-html="item.content"></div>
+<!--          <div class="headercontent" style="color: #9E9E9E!important;font-size: 14px!important;">{{item.content}}</div>-->
         </el-card>
         <div
           :class="{
             'image-right': index % 2 === 0,
             'image-left': index % 2 === 1,
+
+
+
+
+
           }"
           class="image"
         >
-          <el-image :src="item.url" />
+          <el-image :src="item.originUrl?item.originUrl:defaultUrl" />
         </div>
       </div>
     </div>
@@ -39,6 +52,9 @@
 <script>
 import Header from "../../components/HeaderView"
 import FooterView from "../../components/FooterView.vue"
+// import {getAction} from "../../api/manage";
+import {getAction} from "/src/api/manage";
+
 export default {
   data () {
     return {
@@ -47,22 +63,58 @@ export default {
         { id: 2, headername: '历史沿革', url: require('@/assets/w.jpg'), content: '简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内' },
         { id: 3, headername: '环境与设施', url: require('@/assets/w.jpg'), content: '简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内' },
         { id: 4, headername: '教师风采', url: require('@/assets/w.jpg'), content: '简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内' }
-      ]
+      ],
+      defaultUrl:require('../../assets/01.png'),
+      url:{
+        detail:"/cms/front/getArticleListByColumn"
+      },
+      originalList:[]
     }
 
+  },
+  created() {
+
+    this.getList()
+
   },
   methods: {
     getRouterLink (id) {
       // 根据id返回不同的路由路径
       if (id === 1) {
-        return '/professionalIntroduction'
+        return '/cms/professionalIntroduction'
       } else if (id === 2) {
-        return '/historicalEvolution'
+        return '/cms/historicalEvolution'
       } else if (id === 3) {
-        return '/environmentFacilities'
+        return '/cms/environmentFacilities'
       } else if (id === 4) {
-        return '/TeacherDemeanor'
+        return '/cms/TeacherDemeanor'
       }
+    },
+    getList(){
+      getAction(this.url.detail,{columnId:"1640260238858096641"}).then((res) => {
+        console.log("res.result.records")
+        console.log(res.result.records)
+          this.originalList = res.result.records
+          // this.originalList.forEach(function(item,index,array){
+          //   item.date = item.publishTime.slice(8,10)
+          //   item.month = item.publishTime.slice(0,7)
+          // })
+        }
+      )
+    },
+    goToDetail(item){
+      console.log("item")
+      console.log(item)
+      this.$router.push({
+          path:"/cms/detail",
+          query:{
+            item:item,
+            columnName:item.columnName,//栏目标题
+            title:item.title,//主标题
+            subtitle:"",//副标题
+          }
+      }
+      )
     }
   },
   components: {
@@ -77,7 +129,9 @@ export default {
 <style lang="less" scoped>
 @import '../../assets/reset.css';
 .header {
-  background-image: url('../../assets/bg02.png');
+  background-image: url('../../assets/bg01.png');
+  background-position: center;
+  background-size: 100% 100%;
 }
 .box1 {
   padding: 50px 100px;
@@ -94,12 +148,20 @@ export default {
   margin-bottom: 45px;
 }
 .headercontent {
-  color: #9E9E9E;
+  color: #9E9E9E!important;
-  font-size: 14px;
+  font-size: 14px!important;
   height: 125px;
   line-height: 25px;
   overflow: hidden;
 }
+.headercontent p{
+  color: #9E9E9E!important;
+  font-size: 14px!important;
+}
+.headercontent p span{
+  color: #9E9E9E!important;
+  font-size: 14px!important;
+}
 .content {
   flex: 7;
   order: 2;