diff --git a/src/renderer/components/TimelineSpace/Home.vue b/src/renderer/components/TimelineSpace/Home.vue index f40bfa15..d311a74c 100644 --- a/src/renderer/components/TimelineSpace/Home.vue +++ b/src/renderer/components/TimelineSpace/Home.vue @@ -13,6 +13,9 @@ import Toot from './Cards/Toot' export default { name: 'home', components: { Toot }, + mounted () { + this.$store.commit('TimelineSpace/SideMenu/changeUnreadHomeTimeline', false) + }, computed: { ...mapState({ timeline: state => state.TimelineSpace.homeTimeline diff --git a/src/renderer/components/TimelineSpace/Notifications.vue b/src/renderer/components/TimelineSpace/Notifications.vue index 4ca7facd..bce72445 100644 --- a/src/renderer/components/TimelineSpace/Notifications.vue +++ b/src/renderer/components/TimelineSpace/Notifications.vue @@ -13,6 +13,9 @@ import Notification from './Cards/Notification' export default { name: 'notifications', components: { Notification }, + mounted () { + this.$store.commit('TimelineSpace/SideMenu/changeUnreadNotifications', false) + }, computed: { ...mapState({ notifications: state => state.TimelineSpace.notifications diff --git a/src/renderer/components/TimelineSpace/SideMenu.vue b/src/renderer/components/TimelineSpace/SideMenu.vue index 63791003..7cf1cb74 100644 --- a/src/renderer/components/TimelineSpace/SideMenu.vue +++ b/src/renderer/components/TimelineSpace/SideMenu.vue @@ -16,10 +16,14 @@ Home + + Notification + + @@ -45,7 +49,9 @@ export default { computed: { ...mapState({ account: state => state.TimelineSpace.account, - username: state => state.TimelineSpace.username + username: state => state.TimelineSpace.username, + unreadHomeTimeline: state => state.TimelineSpace.SideMenu.unreadHomeTimeline, + unreadNotifications: state => state.TimelineSpace.SideMenu.unreadNotifications }) }, methods: { @@ -76,12 +82,18 @@ export default { } } - .timeline-menu { + .timeline-menu /deep/ { position: fixed; top: 70px; left: 65px; height: 100%; width: 180px; + + .el-badge__content { + background-color: #409eff; + border: none; + margin-left: 4px; + } } } diff --git a/src/renderer/store/TimelineSpace.js b/src/renderer/store/TimelineSpace.js index 04f092ae..ce6103d2 100644 --- a/src/renderer/store/TimelineSpace.js +++ b/src/renderer/store/TimelineSpace.js @@ -117,6 +117,7 @@ const TimelineSpace = { startUserStreaming ({ commit }, account) { ipcRenderer.on('update-start-user-streaming', (event, update) => { commit('appendHomeTimeline', update) + commit('TimelineSpace/SideMenu/changeUnreadHomeTimeline', true, { root: true }) }) ipcRenderer.on('notification-start-user-streaming', (event, notification) => { let notify = buildNotification(notification) @@ -124,6 +125,7 @@ const TimelineSpace = { router.push(`/${account._id}/notifications`) } commit('appendNotifications', notification) + commit('TimelineSpace/SideMenu/changeUnreadNotifications', true, { root: true }) }) return new Promise((resolve, reject) => { diff --git a/src/renderer/store/TimelineSpace/SideMenu.js b/src/renderer/store/TimelineSpace/SideMenu.js index a6263246..4a278f5b 100644 --- a/src/renderer/store/TimelineSpace/SideMenu.js +++ b/src/renderer/store/TimelineSpace/SideMenu.js @@ -1,7 +1,17 @@ const SideMenu = { namespaced: true, - state: {}, - mutations: {}, + state: { + unreadHomeTimeline: false, + unreadNotifications: false + }, + mutations: { + changeUnreadHomeTimeline (state, value) { + state.unreadHomeTimeline = value + }, + changeUnreadNotifications (state, value) { + state.unreadNotifications = value + } + }, actions: {} }