优化bug

src/renderer/App.vue

@@ -19,66 +19,32 @@ export default {
     if (that.$store.getters.token) {
       that.$store.dispatch('chat/initWebSocket') // 初始化websocket
     }
+    this.showNotify()
+    this.showNotify()
+    this.showNotify()
+    this.showNotify()
   },
   watch: {
     '$store.state.chat.printer_error': {
       handler(val) {
         let that = this
-        const currentTime = dayjs().format('HH:mm:ss');
+        const currentTime = dayjs().format('HH:mm:ss')
         if (val.message) {
           if (that.errors.indexOf(val.message) === -1) {
             that.errors.push(val.message)
-            that.$message({
-              message: val.message,
-              type: val.type,
-              onClose() {
-                that.errors.splice(that.errors.indexOf(val.message), 1)
-              }
-            })
+            that.showNotify({ time: currentTime, message: val.message, ...val })
           }
         }
         if (val.notify) {
           if (that.errors.indexOf(val.notify) === -1) {
             that.errors.push(val.notify)
-            that.$notify({
-              title: '温馨提示：' + currentTime,
-              message: val.notify,
-              type: val.type,
-              duration: 0,
-              onClose() {
-                that.errors.splice(that.errors.indexOf(val.notify), 1)
-              }
-            })
+            that.showNotify({ time: currentTime, message: val.notify, ...val })
           }
         }
         if (val.confirm) {
           if (that.errors.indexOf(val.confirm) === -1) {
             that.errors.push(val.confirm)
-            that.$notify({
-              title: '温馨提示：' + currentTime,
-              duration: 0,
-              showClose: false,
-              dangerouslyUseHTMLString: true,
-              message: `<div class="notify_text">${val.confirm}</div><div class="notify_btns"><div class="notify_btn notify_btn2" id="notifyAgain" data-type="continue_task">重试</div></div>`,
-              onClick(event) {
-                if (val.req && val.req === 'continue_task') {
-                  // 下一个任务
-                  that.$store.dispatch('chat/websocketsend', {
-                    req_name: 'continue_task',
-                    req_type: 1,
-                    req_info: {}
-                  }).then(() => {
-                    
-                  }).catch(() => {
-                    
-                  })
-                }
-                this.close()
-              },
-              onClose() {
-                that.errors.splice(that.errors.indexOf(val.confirm), 1)
-              }
-            });
+            that.showNotify({ time: currentTime, message: val.confirm, ...val })
           }
         }
       },
@@ -86,7 +52,76 @@ export default {
       immediate: true
     }
   },
-  methods: {}
+  methods: {
+    showNotify(data) {
+      let that = this
+      let notifyInstance
+      function renderNotifyContent() {
+        let btns = [
+          that.$createElement(
+            'el-button',
+            {
+              props: { size: 'mini' },
+              on: {
+                click: () => {
+                  notifyInstance.close()
+                }
+              }
+            },
+            '跳过'
+          ),
+          that.$createElement(
+            'el-button',
+            {
+              props: { type: 'primary', size: 'mini' },
+              style: { marginLeft: '10px' },
+              on: {
+                click: () => {
+                  that.errors.splice(that.errors.indexOf(data.message), 1)
+                  notifyInstance.close()
+                }
+              }
+            },
+            '确定'
+          )
+        ]
+        if (data.confirm) {
+          btns[1] = that.$createElement(
+            'el-button',
+            {
+              props: { type: 'primary', size: 'mini' },
+              style: { marginLeft: '10px' },
+              on: {
+                click: () => {
+                  // 下一个任务
+                  that.$store
+                    .dispatch('chat/websocketsend', {
+                      req_name: 'continue_task',
+                      req_type: 1,
+                      req_info: {}
+                    })
+                    .then(() => {})
+                    .catch(() => {})
+                  that.errors.splice(that.errors.indexOf(data.message), 1)
+                  notifyInstance.close()
+                }
+              }
+            },
+            '重试'
+          )
+        }
+        return that.$createElement('div', [that.$createElement('p', { style: 'margin-top: 8px; line-height: 24px' }, data.message), that.$createElement('div', { style: 'margin-top: 8px; text-align: right' }, btns)])
+      }
+      // 创建通知实例
+      notifyInstance = that.$notify({
+        title: '温馨提示：' + data.time,
+        message: renderNotifyContent(), // 初始化时直接生成内容
+        duration: 0,
+        type: data.type,
+        showClose: false,
+      })
+    }
+  }
 }
 </script>
 <style lang="scss">
@@ -96,9 +131,9 @@ export default {
 }
 .el-notification__content {
   margin: 0;
-  line-height: 24PX;
+  line-height: 24px;
 }
-.notify_btns{
+.notify_btns {
   display: flex;
   align-items: center;
   justify-content: end;
@@ -117,7 +152,7 @@ export default {
     border: 1px solid #ccc;
   }
   .notify_btn2 {
-    background-color: #409EFF;
+    background-color: #409eff;
     color: #fff;
   }
 }