style:系统通知

@@ -7,8 +7,8 @@
       <div style="margin-right:5px"></div>
       <div ref="back" class="back">
         <div ref="text" class="text" @mouseover="mouseOver" @mouseleave="mouseLeave">
-          <p v-for="(item, index) in noticeList" :key="index">
-            {{ item.title }}
+          <p v-for="(item, index) in noticeList" :key="index" @click="handleNotice(item)">
+            {{ item.noticeTitle }}
           </p>
         </div>
       </div>
@@ -34,7 +34,22 @@ export default {
       secondAnimationTime: '', // 状态二动画效果
     };
   },
+  watch: {
+    noticeList: {
+      handler (newName, oldName) {
+        let that = this
+        this.Listener();
+        setTimeout(res => {
+          that.getData();
+        }, 100);
+      },
+      deep: true
+    }
+  },
   methods: {
+    handleNotice (item) {
+      this.$alertMes(item.noticeTitle, item.noticeContent)
+    },
     // 获取数据
     getData () {
       let style = document.styleSheets[0];
@@ -53,7 +68,7 @@ export default {
       );
       setTimeout(res => {
         this.changeState();
-      }, 1000);
+      }, 300);
     },
     // 用速度计算时间（想要保持速度一样，2种状态时间不同需算出）
     ComputationTime () {
@@ -89,12 +104,6 @@ export default {
       let text = this.$refs.text;
       text.style.animationPlayState = ''
     }
-  },
-  mounted () {
-    this.Listener();
-    setTimeout(res => {
-      this.getData();
-    }, 100);
   }
 };
 </script>

@@ -21,8 +21,11 @@
   </div>
 </template>
 <script>
-import NoticeBar from '@/components/NoticeBar/index'
 import { mapGetters } from 'vuex'
+import NoticeBar from '@/components/NoticeBar/index'
+import {
+  getHomeNoticeList
+} from "@/api/home.js"
 export default {
   components: {
     NoticeBar
@@ -33,20 +36,20 @@ export default {
   data () {
     return {
       logo: require('../../image/logo.png'),
-      noticeList: [
-        {
-          title: '6666666666666666666'
-        },
-        {
-          title: '3333333333333333333'
-        },
-        {
-          title: '6666666666666666666'
-        }
-      ]
+      noticeList: []
     }
   },
+  created () {
+    this.queryNoticeList()
+  },
   methods: {
+    queryNoticeList () {
+      getHomeNoticeList().then(res => {
+        if (res.result) {
+          this.noticeList = res.result.noticeList
+        }
+      })
+    },
     themeChange (val) {
       this.$store.dispatch('app/updateTheme', val)
     },