TS重构

src/class/utils/Alert.ts

@@ -6,20 +6,17 @@ import NotificationUtils from "./NotificationUtils";
 
 export default class Alert extends Utils {
     static container: HTMLElement = null;
+
     notify: MyHTMLElement = null;
     intervalID = -1;
 
     constructor(msg: string, options: IWHNotify = {}) {
         super();
-        let { isWindowActive, notifies } = Alert.glob;
 
         let {
             timeout = 3,
-            callback = function () {
+            callback = () => null,
-            },
             sysNotify = false,
-            sysNotifyTag = '芜湖助手',
-            sysNotifyClick = () => window.focus()
         } = options;
 
         // 后台窗口、iframe内判断
@@ -31,35 +28,32 @@ export default class Alert extends Utils {
         this.callback = callback;
         Alert.create(this, msg, timeout);
         Log.info('创建新通知：', this);
-        NotificationUtils.push(msg, options);
+        if (sysNotify) NotificationUtils.push(msg, options);
     }
 
     static create(that: Alert, msg, timeout): void {
         // 通知的唯一id
         const uid = '' + Utils.getRandomInt(1000, 9999);
         // 每条通知
-        const new_node: MyHTMLElement = document.createElement('div');
+        const element: MyHTMLElement = document.createElement('div');
-        new_node.id = `wh-notify-${ uid }`;
+        element.id = `wh-notify-${ uid }`;
-        new_node.classList.add('wh-notify-item');
+        element.classList.add('wh-notify-item');
-        new_node.innerHTML = `<div class="wh-notify-bar"></div>
+        element.innerHTML = `<div class="wh-notify-bar"></div>
 <div class="wh-notify-cont">
     <div class="wh-notify-close"></div>
     <div class="wh-notify-msg"><p>${ msg }</p></div>
 </div>`;
-        this.container.append(new_node);
+        this.container.append(element);
-        // TODO 待定
-        this.container['msgInnerText'] = new_node.querySelector('.wh-notify-msg').innerText;
         // 进度条node
-        const progressBar: HTMLElement = new_node.querySelector('.wh-notify-bar');
+        const progressBar: HTMLElement = element.querySelector('.wh-notify-bar');
         // 是否hover
         let mouse_enter = false;
-        new_node.addEventListener('mouseenter', () => mouse_enter = true, true);
+        element.addEventListener('mouseenter', () => mouse_enter = true, true);
-        new_node.addEventListener('mouseleave', () => mouse_enter = false);
+        element.addEventListener('mouseleave', () => mouse_enter = false);
         // 通知进度条
         let progressCount = 101;
         // 计时器
         that.intervalID = window.setInterval(() => {
-            // Log.info(that.intervalID);
             if (mouse_enter) {
                 progressCount = 101;
                 progressBar.style.width = '100%';
@@ -71,13 +65,11 @@ export default class Alert extends Utils {
                 that.close();
             }
         }, timeout * 1000 / 100) as unknown as number;
-        new_node.querySelector('.wh-notify-close').addEventListener('click', that.close);
+        element.querySelector('.wh-notify-close').addEventListener('click', that.close);
-        that.notify = new_node;
+        that.notify = element;
         Log.info(that.notify)
     }
 
-    callback: Function = () => null;
-
     static initContainer() {
         this.container = document.createElement('div');
         this.container.id = 'wh-notify';
@@ -131,10 +123,8 @@ cursor: pointer;
         this.notify = null;
         this.callback();
         let id = this.intervalID;
-        // Log.info('this.intervalID', { id });
-        // Alert.glob.window.clearInterval(id);
-        // Alert.glob.unsafeWindow.clearInterval(id);
-        // clearInterval(id);
         window.clearInterval(id);
     }
+
+    callback: Function = () => null;
 }

src/class/utils/NotificationUtils.ts

@@ -6,32 +6,38 @@ export default class NotificationUtils extends Utils {
     static permission: boolean = window.Notification && window.Notification.permission === 'granted';
 
     static push(msg: string, options: IWHNotify = {}) {
-        Log.info('推送系统通知', { 'permission': this.permission, flag: options.sysNotify });
         let { notifies } = NotificationUtils.glob;
 
         if (options.sysNotify && this.permission) {
             let tmpNode = document.createElement('p');
             tmpNode.innerHTML = msg;
             let notify = new Notification('芜湖助手', {
-                body: Log.getTime() + tmpNode.innerText,
+                body: Log.getTime() + '\r\n' + tmpNode.innerText,
-                requireInteraction: true,
+                // requireInteraction: true,
-                renotify: true,
+                // renotify: true,
-                tag: '芜湖助手' + Utils.getRandomInt(0, 99),
+                // tag: '芜湖助手' + Utils.getRandomInt(0, 99),
             });
             let id = notifies.count++;
-            // notify.id = notifies.count++;
             notifies[id] = notify;
             notify.addEventListener(
                 'close',
                 () => {
-                    options.sysNotifyClick ? options.sysNotifyClick() : null;
                     notifies[id] = null;
+                }
+            );
+            notify.addEventListener(
+                'click',
+                () => {
+                    options.sysNotifyClick ? options.sysNotifyClick() : null;
                     window.focus();
                 }
             );
             notify.addEventListener(
                 'show',
-                () => setTimeout(() => notify.close(), (options.timeout || 3) * 1000)
+                () => {
+                    // setTimeout(() => notify.close(), (options.timeout || 3) * 1000);
+                    Log.info(id)
+                }
             );
         }
     }