diff --git a/src/components/Notice/Index.vue b/src/components/Notice/Index.vue index 352e31f..c0fdbd9 100644 --- a/src/components/Notice/Index.vue +++ b/src/components/Notice/Index.vue @@ -2,7 +2,7 @@
@@ -11,7 +11,7 @@
@@ -76,12 +76,14 @@ import { formatTime } from '@/utils/index' const { proxy } = getCurrentInstance() const noticeType = ref('0') // 小红点 -const newsDot = ref(false) +const newsDot = computed(() => { + return useSocketStore().newNotice +}) const show = ref(false) const noticeList = computed(() => { return useSocketStore().noticeList }) -const noticeDot = computed(() => { +const allDotNum = computed(() => { return useSocketStore().getAllDotNum() }) const chatList = computed(() => { @@ -101,12 +103,7 @@ function handleDetails(item, type) { } // 全部已读点击 function onAllReadClick() { - newsDot.value = false - if (noticeType.value == 1) { - useSocketStore().readAll() - } else { - proxy.$modal.msg('请自行实现!!!') - } + useSocketStore().readAll(noticeType.value) } // 前往通知中心点击 function onGoToGiteeClick() { @@ -152,7 +149,7 @@ function onGoToGiteeClick() { } .foot-box { height: 35px; - color: #1890ff; + color: var(--el-color-primary); font-size: 13px; cursor: pointer; opacity: 0.8; @@ -164,21 +161,17 @@ function onGoToGiteeClick() { opacity: 1; } } -:deep(.el-empty__description p) { - font-size: 13px; -} -.head-box-title { - color: var(--base-color-white); -} + .layout-navbars-breadcrumb-user-news { position: relative; .read { position: absolute; - top: 5px; + top: 7px; right: 0; - color: #1890ff; + color: var(--el-color-primary); cursor: pointer; z-index: 2; + font-size: 12px; } } .n_right { diff --git a/src/directive/module/waves.js b/src/directive/module/waves.js index 08a2f4f..3901c3d 100644 --- a/src/directive/module/waves.js +++ b/src/directive/module/waves.js @@ -5,30 +5,31 @@ */ export default { mounted(el, binding) { - el.classList.add('waves-effect'); - binding.value && el.classList.add(`waves-${binding.value}`); + el.classList.add('waves-effect') + binding.value && el.classList.add(`waves-${binding.value}`) function setConvertStyle(obj) { - let style = ''; + let style = '' for (let i in obj) { - if (obj.hasOwnProperty(i)) style += `${i}:${obj[i]};`; + if (obj.hasOwnProperty(i)) style += `${i}:${obj[i]};` } - return style; + return style } function onCurrentClick(e) { - let elDiv = document.createElement('div'); - elDiv.classList.add('waves-ripple'); - el.appendChild(elDiv); + let elDiv = document.createElement('div') + elDiv.classList.add('waves-ripple') + el.appendChild(elDiv) let styles = { left: `${e.layerX}px`, top: `${e.layerY}px`, opacity: 1, transform: `scale(${(el.clientWidth / 100) * 10})`, 'transition-duration': `750ms`, - 'transition-timing-function': `cubic-bezier(0.250, 0.460, 0.450, 0.940)`, - }; - elDiv.setAttribute('style', setConvertStyle(styles)); + 'transition-timing-function': `cubic-bezier(0.250, 0.460, 0.450, 0.940)` + } + + elDiv.setAttribute('style', setConvertStyle(styles)) setTimeout(() => { elDiv.setAttribute( 'style', @@ -36,17 +37,17 @@ export default { opacity: 0, transform: styles.transform, left: styles.left, - top: styles.top, + top: styles.top }) - ); + ) setTimeout(() => { - elDiv && el.removeChild(elDiv); - }, 750); - }, 450); + elDiv && el.removeChild(elDiv) + }, 750) + }, 450) } - el.addEventListener('mousedown', onCurrentClick, false); + el.addEventListener('mousedown', onCurrentClick, false) }, unmounted(el) { - el.addEventListener('mousedown', () => {}); - }, -} \ No newline at end of file + el.addEventListener('mousedown', () => {}) + } +} diff --git a/src/store/modules/socket.js b/src/store/modules/socket.js index 2e3b4e8..94ca547 100644 --- a/src/store/modules/socket.js +++ b/src/store/modules/socket.js @@ -2,20 +2,21 @@ import useUserStore from './user' import signalR from '@/signalr/signalr' const useSocketStore = defineStore('socket', { persist: { - paths: ['chatMessage', 'chatList', 'sessionList', 'newChat'] //存储指定key + paths: ['chatMessage', 'chatList', 'sessionList', 'newChat', 'noticeIdArr', 'newNotice'] //存储指定key }, state: () => ({ onlineNum: 0, onlineUsers: [], noticeList: [], - noticeDot: false, //在线用户信息 onlineInfo: {}, // 聊天数据 chatList: {}, leaveUser: {}, sessionList: {}, - newChat: 0 + newChat: 0, + newNotice: 0, + noticeIdArr: [] }), getters: { /** @@ -30,7 +31,7 @@ const useSocketStore = defineStore('socket', { return (userid) => state.sessionList[userid] || [] }, getAllDotNum(state) { - return () => state.newChat + return () => state.newChat + state.newNotice } }, actions: { @@ -41,7 +42,18 @@ const useSocketStore = defineStore('socket', { // 更新系统通知 setNoticeList(data) { this.noticeList = data - this.noticeDot = data.length > 0 + + const idArr = [] + data.forEach((ele) => { + idArr.push(ele.noticeId) + }) + + var diffArr = idArr.filter((v) => !this.noticeIdArr.some((item) => item == v)) + + if (diffArr.length > 0) { + this.newNotice = diffArr.length + this.noticeIdArr = idArr + } }, setOnlineUsers(data) { const { onlineClients, num, leaveUser } = data @@ -95,8 +107,12 @@ const useSocketStore = defineStore('socket', { }) }) }, - readAll() { - this.newChat = 0 + readAll(type) { + if (type == 0) { + this.newNotice = 0 + } else if (type == 1) { + this.newChat = 0 + } } } }) diff --git a/src/views/monitor/onlineuser/index.vue b/src/views/monitor/onlineuser/index.vue index c253bd4..508059b 100644 --- a/src/views/monitor/onlineuser/index.vue +++ b/src/views/monitor/onlineuser/index.vue @@ -14,9 +14,6 @@ 刷新 -