style:系统通知
Showing
2 changed files
with
33 additions
and
21 deletions
... | @@ -7,8 +7,8 @@ | ... | @@ -7,8 +7,8 @@ |
7 | <div style="margin-right:5px"></div> | 7 | <div style="margin-right:5px"></div> |
8 | <div ref="back" class="back"> | 8 | <div ref="back" class="back"> |
9 | <div ref="text" class="text" @mouseover="mouseOver" @mouseleave="mouseLeave"> | 9 | <div ref="text" class="text" @mouseover="mouseOver" @mouseleave="mouseLeave"> |
10 | <p v-for="(item, index) in noticeList" :key="index"> | 10 | <p v-for="(item, index) in noticeList" :key="index" @click="handleNotice(item)"> |
11 | {{ item.title }} | 11 | {{ item.noticeTitle }} |
12 | </p> | 12 | </p> |
13 | </div> | 13 | </div> |
14 | </div> | 14 | </div> |
... | @@ -34,7 +34,22 @@ export default { | ... | @@ -34,7 +34,22 @@ export default { |
34 | secondAnimationTime: '', // 状态二动画效果 | 34 | secondAnimationTime: '', // 状态二动画效果 |
35 | }; | 35 | }; |
36 | }, | 36 | }, |
37 | watch: { | ||
38 | noticeList: { | ||
39 | handler (newName, oldName) { | ||
40 | let that = this | ||
41 | this.Listener(); | ||
42 | setTimeout(res => { | ||
43 | that.getData(); | ||
44 | }, 100); | ||
45 | }, | ||
46 | deep: true | ||
47 | } | ||
48 | }, | ||
37 | methods: { | 49 | methods: { |
50 | handleNotice (item) { | ||
51 | this.$alertMes(item.noticeTitle, item.noticeContent) | ||
52 | }, | ||
38 | // 获取数据 | 53 | // 获取数据 |
39 | getData () { | 54 | getData () { |
40 | let style = document.styleSheets[0]; | 55 | let style = document.styleSheets[0]; |
... | @@ -53,7 +68,7 @@ export default { | ... | @@ -53,7 +68,7 @@ export default { |
53 | ); | 68 | ); |
54 | setTimeout(res => { | 69 | setTimeout(res => { |
55 | this.changeState(); | 70 | this.changeState(); |
56 | }, 1000); | 71 | }, 300); |
57 | }, | 72 | }, |
58 | // 用速度计算时间(想要保持速度一样,2种状态时间不同需算出) | 73 | // 用速度计算时间(想要保持速度一样,2种状态时间不同需算出) |
59 | ComputationTime () { | 74 | ComputationTime () { |
... | @@ -89,12 +104,6 @@ export default { | ... | @@ -89,12 +104,6 @@ export default { |
89 | let text = this.$refs.text; | 104 | let text = this.$refs.text; |
90 | text.style.animationPlayState = '' | 105 | text.style.animationPlayState = '' |
91 | } | 106 | } |
92 | }, | ||
93 | mounted () { | ||
94 | this.Listener(); | ||
95 | setTimeout(res => { | ||
96 | this.getData(); | ||
97 | }, 100); | ||
98 | } | 107 | } |
99 | }; | 108 | }; |
100 | </script> | 109 | </script> | ... | ... |
... | @@ -21,8 +21,11 @@ | ... | @@ -21,8 +21,11 @@ |
21 | </div> | 21 | </div> |
22 | </template> | 22 | </template> |
23 | <script> | 23 | <script> |
24 | import NoticeBar from '@/components/NoticeBar/index' | ||
25 | import { mapGetters } from 'vuex' | 24 | import { mapGetters } from 'vuex' |
25 | import NoticeBar from '@/components/NoticeBar/index' | ||
26 | import { | ||
27 | getHomeNoticeList | ||
28 | } from "@/api/home.js" | ||
26 | export default { | 29 | export default { |
27 | components: { | 30 | components: { |
28 | NoticeBar | 31 | NoticeBar |
... | @@ -33,20 +36,20 @@ export default { | ... | @@ -33,20 +36,20 @@ export default { |
33 | data () { | 36 | data () { |
34 | return { | 37 | return { |
35 | logo: require('../../image/logo.png'), | 38 | logo: require('../../image/logo.png'), |
36 | noticeList: [ | 39 | noticeList: [] |
37 | { | ||
38 | title: '6666666666666666666' | ||
39 | }, | ||
40 | { | ||
41 | title: '3333333333333333333' | ||
42 | }, | ||
43 | { | ||
44 | title: '6666666666666666666' | ||
45 | } | ||
46 | ] | ||
47 | } | 40 | } |
48 | }, | 41 | }, |
42 | created () { | ||
43 | this.queryNoticeList() | ||
44 | }, | ||
49 | methods: { | 45 | methods: { |
46 | queryNoticeList () { | ||
47 | getHomeNoticeList().then(res => { | ||
48 | if (res.result) { | ||
49 | this.noticeList = res.result.noticeList | ||
50 | } | ||
51 | }) | ||
52 | }, | ||
50 | themeChange (val) { | 53 | themeChange (val) { |
51 | this.$store.dispatch('app/updateTheme', val) | 54 | this.$store.dispatch('app/updateTheme', val) |
52 | }, | 55 | }, | ... | ... |
-
Please register or sign in to post a comment