From f4fbb304d3ea1cb01f6294b7aa859758bce7c3f2 Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Thu, 10 Nov 2022 14:13:55 +0800
Subject: [PATCH] =?UTF-8?q?bug=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/menuTree/index.vue | 35 ++++++++++++++++
 src/layouts/footer/index.vue      | 58 +++++++++++++-------------
 src/layouts/header/index.vue      |  9 ++--
 src/layouts/home/index.vue        |  4 +-
 src/layouts/navbar/index.vue      | 69 ++++++++++++++++++-------------
 src/pages/about/index.vue         |  2 +-
 src/pages/article/editor.css      | 61 +++++++++++++++++++++++++++
 src/pages/article/index.vue       |  3 +-
 src/pages/careers/index.vue       |  2 +-
 src/pages/edu/index.vue           |  8 ++--
 src/pages/home/index.vue          |  2 +-
 src/pages/news/index.vue          | 29 +++++++------
 src/pages/newsPress/index.vue     |  2 +-
 13 files changed, 197 insertions(+), 87 deletions(-)
 create mode 100644 src/components/menuTree/index.vue
 create mode 100644 src/pages/article/editor.css

diff --git a/src/components/menuTree/index.vue b/src/components/menuTree/index.vue
new file mode 100644
index 0000000..b897c8d
--- /dev/null
+++ b/src/components/menuTree/index.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="menu-child">
+    <template v-for="item in this.menuList">
+      <el-submenu :key="item.id" :index="item.id" v-if="item.children && item.children.length">
+        <template slot="title">
+          <span slot="title">{{item.columnName}}</span>
+        </template>
+        <menuTree :menuList="item.children"></menuTree>
+      </el-submenu>
+      <el-menu-item :key="item.id" :index="item.id" v-else>
+        <span slot="title">{{item.columnName}}</span>
+      </el-menu-item>
+    </template>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'menuTree',
+  props: {
+    menuList: {
+      type: Array,
+      default: []
+    }
+  },
+  data () {
+    return {}
+  },
+  mounted () {},
+  methods: {}
+}
+</script>
+<style lang="scss" scoped>
+  
+</style>
diff --git a/src/layouts/footer/index.vue b/src/layouts/footer/index.vue
index c29a016..1a07d51 100644
--- a/src/layouts/footer/index.vue
+++ b/src/layouts/footer/index.vue
@@ -8,31 +8,10 @@
           <p class="meta">Institute of Advanced Science Facilities, ShenzhenIASF</p>
           <p class="meta">Tel：400-0010-998</p>
         </div>
-        <div class="column">
-          <h6>关于IASF</h6>
-          <ul class="children">
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-          </ul>
-        </div>
-        <div class="column">
-          <h6>关于IASF</h6>
-          <ul class="children">
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-          </ul>
-        </div>
-        <div class="column">
-          <h6>关于IASF</h6>
-          <ul class="children">
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-            <li>研究院概况</li>
-            <li>研究院概况</li>
+        <div v-for="(item, i) in columns" :key="i" class="column">
+          <h6>{{ item.columnName }}</h6>
+          <ul v-if="item.children.length" class="children">
+            <li v-for="(column, j) in item.children" :key="j">{{ column.columnName }}</li>
           </ul>
         </div>
       </div>
@@ -41,18 +20,36 @@
   </div>
 </template>
 <script>
-import Setting from "@/setting";
+import Setting from '@/setting'
 export default {
   data() {
     return {
+      columns: [],
       isIndex: this.$route.path !== '/login' && Setting.whiteList.some(e => e === this.$route.path) // 官网3个页面才能显示邮箱和版权号
     };
   },
   mounted(){
-      
+    this.getColumn()
   },
   methods: {
-      
+    // 资讯
+    getColumn() {
+      this.$post(this.api.listWithTree, {
+        siteId: 1,
+        columnName: '',
+        templateId: '',
+        typeId	: '',
+        isSort: 0
+      }).then(({ data }) => {
+        this.columns = data.filter(e => !e.menuVisible).slice(0, 8)
+      }).catch(err => {})
+    },
+    // 跳转
+    jump(item) {
+      const { id } = item
+      this.active = id
+      this.$router.push('channel?id=' + id).catch(err => {})
+    }
   },
 };
 </script>
@@ -67,7 +64,6 @@ export default {
   }
   .info {
     display: flex;
-    // justify-content: center;
     margin-bottom: 100px;
   }
   .meta {
@@ -75,10 +71,11 @@ export default {
     font-size: 14px;
   }
   .column {
-    margin: 0 50px;
+    margin: 0 20px;
     h6 {
       margin-bottom: 20px;
       font-size: 16px;
+      white-space: nowrap;
     }
   }
   .children {
@@ -86,6 +83,7 @@ export default {
       margin: 12px 0;
       font-size: 14px;
       color: #6D7384;
+      white-space: nowrap;
       cursor: pointer;
     }
   }
diff --git a/src/layouts/header/index.vue b/src/layouts/header/index.vue
index e037f3a..40d2bcc 100644
--- a/src/layouts/header/index.vue
+++ b/src/layouts/header/index.vue
@@ -3,8 +3,9 @@
     <a class="logo" @click="toIndex">
       <img v-if="isChannel" src="@/assets/images/logo.png" alt="">
       <template v-else>
-        <img src="@/assets/images/logo1.png" alt="">
-        深圳中能高重复自由电子激光
+        <img src="@/assets/images/logo-black.png" alt="">
+        <!-- <img src="@/assets/images/logo1.png" alt="">
+        深圳中能高重复自由电子激光 -->
       </template>
     </a>
     <navbar ref="nav"></navbar>
@@ -22,7 +23,7 @@ import navbar from '../navbar'
 export default {
   data() {
     return {
-      isChannel: this.$route.path === '/channel'
+      isChannel: this.$route.path === '/home'
     };
   },
   components: {
@@ -30,7 +31,7 @@ export default {
   },
   watch: {
     '$route'() {
-      this.isChannel = this.$route.path === '/channel'
+      this.isChannel = this.$route.path === '/home'
     }
   },
   mounted() {
diff --git a/src/layouts/home/index.vue b/src/layouts/home/index.vue
index d2ba603..0b24cbb 100644
--- a/src/layouts/home/index.vue
+++ b/src/layouts/home/index.vue
@@ -19,7 +19,7 @@ import vFooter from "../footer";
 export default {
   data() {
     return {
-      isChannel: this.$route.path === '/channel'
+      isChannel: this.$route.path === '/home'
     };
   },
   components: {
@@ -28,7 +28,7 @@ export default {
   },
   watch: {
     '$route'() {
-      this.isChannel = this.$route.path === '/channel'
+      this.isChannel = this.$route.path === '/home'
     }
   },
   mounted() {
diff --git a/src/layouts/navbar/index.vue b/src/layouts/navbar/index.vue
index 22c1962..1e6b3ab 100644
--- a/src/layouts/navbar/index.vue
+++ b/src/layouts/navbar/index.vue
@@ -1,29 +1,37 @@
 <template>
   <div>
-    <ul :class="['nav', { channel: isChannel }]">
-      <li v-for="(item, i) in menus" :key="i" :class="{active: active == item.id}" @click="jump(item)">
-        {{ item.columnName }}
-      </li>
-    </ul>
+    <el-menu class="nav" ref="type" :key="menuRefresh" mode="horizontal" :background-color="bgColor" :text-color="textColor" :active-text-color="activeTextColor" @select="jump" :default-active="active">
+      <menuTree :menuList="menus"/>
+    </el-menu>
   </div>
 </template>
 
 <script>
 import Setting from '@/setting'
+import menuTree from '@/components/menuTree'
 export default {
   data() {
     return {
-      isChannel: this.$route.path === '/channel',
+      isChannel: this.$route.path === '/home',
       active: this.$route.query.id,
-      menus: []
+      menus: [],
+      bgColor: '#fff',
+      textColor: '#333',
+      activeTextColor: '#1583FF',
+      menuRefresh: 1
     };
   },
+  components: {
+    menuTree
+  },
   watch: {
     '$route'() {
-      this.isChannel = this.$route.path === '/channel'
+      this.isChannel = this.$route.path === '/home'
+      this.handleColor()
     }
   },
   mounted() {
+    this.handleColor()
     this.getColumn()
   },
   methods: {
@@ -36,10 +44,18 @@ export default {
         typeId	: '',
         isSort: 0
       }).then(({ data }) => {
-        this.menus = data
+        this.menus = data.filter(e => !e.menuVisible)
         if (!this.active && data.length) this.active = data[0].id
       }).catch(err => {})
     },
+    // 改变菜单颜色
+    handleColor() {
+      if (this.isChannel) {
+        this.bgColor = 'transparent'
+        this.textColor = '#fff'
+        this.menuRefresh++
+      }
+    },
     // 跳转
     jump(item) {
       const { id } = item
@@ -51,34 +67,29 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.nav{
+$height: 90px;
+/deep/.nav{
   position: absolute;
   top: 0;
   left: 50%;
-  display: flex;
   transform: translateX(-50%);
-  & > li{
-    position: relative;
-    padding: 0 15px;
-    margin: 0 10px;
-    font-size: 20px;
-    line-height: 90px;
-    color: #333;
-    white-space: nowrap;
-    cursor: pointer;
-    &.active{
-        color: $main-color;
-    }
+}
+/deep/.nav.el-menu--horizontal {
+  border: 0;
+  &>.menu-child>li {
+    float: left;
   }
-  &.channel {
-    & > li {
-      color: #fff;
+  .el-menu-item, .el-submenu__title {
+    height: $height;
+    line-height: $height;
+    span {
+      font-size: 14px;
     }
   }
 }
 @media (max-width: 1430px) {
-    .nav {
-        left: 52%;
-    }
+  .nav {
+    left: 52%;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/about/index.vue b/src/pages/about/index.vue
index 3821847..a4155b7 100644
--- a/src/pages/about/index.vue
+++ b/src/pages/about/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <el-carousel height="480px" :interval="6000">
+    <el-carousel height="480px" :interval="6000" :arrow="(modules[0] && modules[0].list.length > 1) ? 'hover' : 'never'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <div class="banner-item" @click="openLink(item)">
diff --git a/src/pages/article/editor.css b/src/pages/article/editor.css
new file mode 100644
index 0000000..9c8759c
--- /dev/null
+++ b/src/pages/article/editor.css
@@ -0,0 +1,61 @@
+.mce-content-body:not([dir=rtl]) blockquote {
+  padding: 8px 15px;
+  border-left: 0;
+  background-color: #ededed;
+}
+.tiny-wrap {
+  width: 900px;
+  margin: 0 auto;
+}
+.tiny-wrap blockquote p {
+  margin: 0;
+  font-style: italic;
+}
+.tiny-wrap .block {
+  margin-bottom: 20px;
+  overflow: hidden;
+}
+.tiny-wrap .block .fl {
+  float: left;
+  margin: 0 20px 0 0;
+}
+.tiny-wrap .block .fr {
+  float: right;
+  margin: 0 0 0 20px;
+}
+.tiny-wrap .block p {
+  margin: 0 0 10px;
+  font-size: 19px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #101010;
+  line-height: 32px;
+}
+.tiny-wrap .block .tiny-title {
+  margin: 10px 0;
+  font-size: 24px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #101010;
+  line-height: 32px;
+}
+.tiny-wrap .quote {
+  padding: 15px;
+  font-size: 14px;
+  font-style: italic;
+  border: 1px solid #e3e3e3;
+  background-color: #f1f1f1;
+}
+.tiny-wrap .img-wrap {
+  text-align: center;
+}
+.tiny-wrap .img-wrap img {
+  max-width: 600px;
+  max-height: 600px;
+}
+.tiny-wrap .block .img-des {
+  margin: 10px 0 0;
+  font-size: 14px;
+  color: #8d8d8d;
+  text-align: center;
+}
\ No newline at end of file
diff --git a/src/pages/article/index.vue b/src/pages/article/index.vue
index 6bdd82c..c9ca78a 100644
--- a/src/pages/article/index.vue
+++ b/src/pages/article/index.vue
@@ -20,7 +20,7 @@
           </div>
         </div>
         <div class="right">
-          <el-tree class="column" ref="column" :data="columns" highlight-current :expand-on-click-node="false" default-expand-all :props="defaultProps" node-key="id" ></el-tree>
+          <el-tree class="column" ref="column" :data="columns" highlight-current :expand-on-click-node="false" :props="defaultProps" node-key="id" ></el-tree>
 
           <p class="l-title">热点内容</p>
           <ul class="list">
@@ -137,6 +137,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import "./editor.css";
 .banner {
   height: 280px;
   padding: 123px 0 0 243px;
diff --git a/src/pages/careers/index.vue b/src/pages/careers/index.vue
index 6fd030d..5991508 100644
--- a/src/pages/careers/index.vue
+++ b/src/pages/careers/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <el-carousel height="480px" :interval="6000">
+    <el-carousel height="480px" :interval="6000" :arrow="(modules[0] && modules[0].list.length > 1) ? 'hover' : 'never'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <div class="banner-item" @click="openLink(item)">
diff --git a/src/pages/edu/index.vue b/src/pages/edu/index.vue
index 2ea1cc5..90da152 100644
--- a/src/pages/edu/index.vue
+++ b/src/pages/edu/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <el-carousel height="480px" :interval="6000">
+    <el-carousel height="480px" :interval="6000" :arrow="(modules[0] && modules[0].list.length > 1) ? 'hover' : 'never'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <div class="banner-item" @click="openLink(item)">
@@ -29,10 +29,10 @@
     
     <div class="block gray">
       <div class="inner">
-        <h2 class="b-title">Engagement</h2>
-        <p class="intro">Serving Community</p>
+        <h2 class="b-title">{{ modules[3].form.title }}</h2>
+        <p class="intro">{{ modules[3].form.des }}</p>
         <ul class="list">
-          <li v-for="(item, i) in modules[3].list" :key="i">
+          <li v-for="(item, i) in modules[4].list" :key="i">
             <img class="pic" :src="item.pic" alt="" @click="openLink(item)">
             <div class="texts">
               <h6>{{ item.title }}</h6>
diff --git a/src/pages/home/index.vue b/src/pages/home/index.vue
index 474f783..175ea5a 100644
--- a/src/pages/home/index.vue
+++ b/src/pages/home/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <el-carousel height="959px" :interval="6000">
+    <el-carousel height="959px" :interval="6000" :arrow="(modules[0] && modules[0].list.length > 1) ? 'hover' : 'never'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <img class="cursor-pointer" width="100%" height="959" :src="item.pic" alt="" @click="openLink(item)">
diff --git a/src/pages/news/index.vue b/src/pages/news/index.vue
index e34ecbc..02217ca 100644
--- a/src/pages/news/index.vue
+++ b/src/pages/news/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <el-carousel height="480px" :interval="6000">
+    <el-carousel height="480px" :interval="6000" :arrow="(modules[0] && modules[0].list.length > 1) ? 'hover' : 'never'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <div class="banner-item" @click="openLink(item)">
@@ -18,7 +18,7 @@
     </ul>
 
     <div class="block">
-      <div class="inner">
+      <div class="inner" v-if="modules[1].list[this.curColumn].articles.length">
         <div class="banner">
           <img width="50%" height="480" :src="modules[1].list[this.curColumn].articles[0].titleImg" alt="">
           <div class="right">
@@ -47,7 +47,7 @@
       <div class="inner lg">
         <h2 class="b-title">{{ modules[2].form.title }}</h2>
         <p class="intro">{{ modules[2].form.des }}</p>
-        <div class="shop-shows" v-if="articles">
+        <div class="shop-shows" v-if="articles.length">
           <div class="left">
             <img width="100%" height="400" :src="articles[0].titleImg" alt="">
             <div class="texts">
@@ -107,18 +107,18 @@
                 <img class="pic" :src="item.titleImg" alt="">
                 <div class="texts">
                   <h6>{{ item.title }}</h6>
-                  <p class="text">
-                    <img class="icon" src="@/assets/images/address.png" alt="">
-                    Jiahang Shao
+                  <p v-if="item.author" class="text">
+                    <i class="el-icon-user icon"></i>
+                    {{ item.author }}
                   </p>
                   <p class="text">
-                    <img class="icon" src="@/assets/images/address.png" alt="">
-                    Time: 2022.8.13  14:30
+                    <i class="el-icon-alarm-clock icon"></i>
+                    Time: {{ item.createTime }}
                   </p>
-                  <p class="text">
-                    <img class="icon" src="@/assets/images/address.png" alt="">
+                  <!-- <p class="text">
+                    <i class="el-icon-user icon"></i>
                     Address: Big conference room on the fourth floor of headquarters
-                  </p>
+                  </p> -->
                 </div>
               </li>
             </template>
@@ -161,7 +161,7 @@ export default {
           const { list } = json[1]
           if (list.length) {
             list.map(e => {
-              if (e.site) {
+              if (e.site && e.column.length) {
                 const id = e.column[e.column.length - 1]
                 e.id = id
                 if (e.columnTitle === 2) e.columnName = e.columnTitleCustom
@@ -173,6 +173,8 @@ export default {
                 }).then(({ data }) => {
                   this.$set(e, 'articles', data.records)
                 }).catch(err => {})
+              } else {
+                this.$set(e, 'articles', [])
               }
             })
           }
@@ -456,7 +458,8 @@ export default {
     }
     .icon {
       width: 15px;
-      margin-right: 12px;
+      margin-right: 5px;
+      color: #1583FF;
     }
   }
 }
diff --git a/src/pages/newsPress/index.vue b/src/pages/newsPress/index.vue
index 4eb9fec..639f94e 100644
--- a/src/pages/newsPress/index.vue
+++ b/src/pages/newsPress/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrap">
-    <el-carousel height="480px" :interval="6000">
+    <el-carousel height="480px" :interval="6000" :arrow="(modules[0] && modules[0].list.length > 1) ? 'hover' : 'never'">
       <template v-for="(item, i) in modules[0].list">
         <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
           <div class="banner-item" @click="openLink(item)">