优化通知

src/directives/v-el-btn.ts

@@ -18,13 +18,15 @@ const VElBtn = {
                 }
             } catch (e) {
                 console.error(e)
+            } finally {
+                let endTime = new Date()
+                if (endTime.getTime() - startTime.getTime() < 1000) {
+                    await sleep(500)
+                }
+                el.setAttribute(loadingName, 'false')
+                vnode.ref.i.props.loading = false
             }
-            let endTime = new Date()
-            if (endTime.getTime() - startTime.getTime() < 1000) {
-                await sleep(500)
-            }
-            el.setAttribute(loadingName, 'false')
-            vnode.ref.i.props.loading = false
+
         });
     },
     updated(el: HTMLHtmlElement, binding, vnode, prevVnode) {

src/layout/HeaderV2/Notice.vue

@@ -29,18 +29,28 @@
   </transition>
 </template>
 
-<script setup name='Notice' lang="ts">
+<script setup lang="ts">
 import {onMounted, ref} from 'vue'
 import sleep from "@/utils/sleep";
 import {setCallback} from '@/utils/websocket'
 import store from '@/store'
 import {isDev} from '@/utils/public'
+import Queue from "@/utils/my-queue";
 
 const isShow = ref(false)
 const displaySeconds = 1000 * 2
 const isMouse = ref(false)
 
-const msg = ref({
+interface Msg {
+  avatar: string
+  deptName: string
+  name: string
+  msg: string
+  title: string
+  countDown: number,
+}
+
+const msg = ref<Msg>({
   avatar: '',
   deptName: '',
   name: '',
@@ -49,7 +59,7 @@ const msg = ref({
   countDown: 2,
 })
 
-let queue = new Queue()
+let queue = new Queue<Msg>()
 const fillData = async () => {
   let temp = queue.poll()
   if (temp === null) {
@@ -97,7 +107,6 @@ const test = () => {
 // 是否开启显示通知
 let open = true
 onMounted(() => {
-  // test()
   setCallback('avatarNotification', async (value) => {
     let newCount = store.state.app.unreadMessageCount + value.count
     store.commit('app/setUnreadMessageCount', newCount)
@@ -110,32 +119,6 @@ onMounted(() => {
   })
 })
 
-function Queue() {
-
-  let items = []
-
-  Queue.prototype.enqueue = element => {
-    items.push(element)
-  }
-
-  Queue.prototype.poll = () => {
-    if (items.length === 0) {
-      return null;
-    }
-    let temp = items[0];
-    items.shift();
-    return temp;
-  }
-
-  Queue.prototype.getElement = () => {
-    return items;
-  }
-
-  Queue.prototype.size = () => {
-    return items.length;
-  }
-
-}
 
 </script>
 

src/utils/my-queue.ts

@@ -0,0 +1,29 @@
+class Queue<V> {
+    items: V[] = [];
+
+    enqueue(value: any) {
+        this.items.push(value)
+    }
+
+    poll(): V | null {
+        if (this.isEmpty()) {
+            return null;
+        }
+        return this.items.shift();
+    }
+
+    getElement(): V[] {
+        return this.items
+    }
+
+    size(): number {
+        return this.items.length
+    }
+
+    isEmpty(): boolean {
+        return this.items.length === 0
+    }
+
+}
+
+export default Queue;