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