perf: 优化消息发送失败

resources/assets/js/pages/manage/components/DialogItem.vue

@@ -38,6 +38,7 @@
                 @on-view-file="onViewFile"
                 @on-down-file="onDownFile"
                 @on-reply-list="onReplyList"
+                @on-error="onError"
                 @on-emoji="onEmoji"
                 @on-show-emoji-user="onShowEmojiUser"/>
         </template>
@@ -192,6 +193,10 @@ export default {
             this.dispatch("on-reply-list", data)
         },
 
+        onError(data) {
+            this.dispatch("on-error", data)
+        },
+
         onEmoji(data) {
             this.dispatch("on-emoji", data)
         },

resources/assets/js/pages/manage/components/DialogView.vue

@@ -128,8 +128,11 @@
             <div v-if="msgData.modify" class="modify">
                 <i class="taskfont">&#xe779;</i>
             </div>
-            <!--等待/时间/阅读-->
+            <!--错误/等待/时间/阅读-->
-            <Loading v-if="isLoading"/>
+            <div v-if="msgData.error === true" class="error" @click="onError">
+                <Icon type="ios-alert" />
+            </div>
+            <Loading v-else-if="isLoading"/>
             <template v-else>
                 <!--时间-->
                 <div v-if="timeShow" class="time" @click="timeShow=false">{{msgData.created_at}}</div>
@@ -462,6 +465,10 @@ export default {
             })
         },
 
+        onError() {
+            this.$emit("on-error", this.msgData)
+        },
+
         onEmoji(symbol) {
             this.$emit("on-emoji", {
                 msg_id: this.msgData.id,

resources/assets/js/pages/manage/components/DialogWrapper.vue

@@ -102,6 +102,7 @@
             @on-view-file="onViewFile"
             @on-down-file="onDownFile"
             @on-reply-list="onReplyList"
+            @on-error="onError"
             @on-emoji="onEmoji"
             @on-show-emoji-user="onShowEmojiUser">
             <template slot="header">
@@ -943,20 +944,12 @@ export default {
                         text: msgText,
                     },
                     method: 'post',
-                    complete: _ => this.tempMsgs = this.tempMsgs.filter(({id}) => id != tempId)
                 }).then(({data}) => {
+                    this.tempMsgs = this.tempMsgs.filter(({id}) => id != tempId)
                     this.sendSuccess(data)
-                }).catch(({msg}) => {
+                }).catch(error => {
-                    $A.modalConfirm({
+                    this.$set(tempMsg, 'error', true)
-                        icon: 'error',
+                    this.$set(tempMsg, 'errorData', {type: 'text', content: error.msg, msg: msgText})
-                        title: '发送失败',
-                        content: msg,
-                        cancelText: '取消',
-                        okText: '再次编辑',
-                        onOk: () => {
-                            this.msgText = msgText
-                        }
-                    })
                 });
             }
             if (emptied) {
@@ -992,20 +985,12 @@ export default {
                     reply_id: this.replyId,
                 }),
                 method: 'post',
-                complete: _ => this.tempMsgs = this.tempMsgs.filter(({id}) => id != tempId)
             }).then(({data}) => {
+                this.tempMsgs = this.tempMsgs.filter(({id}) => id != tempId)
                 this.sendSuccess(data);
             }).catch(error => {
-                $A.modalConfirm({
+                this.$set(tempMsg, 'error', true)
-                    icon: 'error',
+                this.$set(tempMsg, 'errorData', {type: 'record', content: error.msg, msg})
-                    title: '发送失败',
-                    content: error.msg,
-                    cancelText: '取消',
-                    okText: '重新发送',
-                    onOk: () => {
-                        this.sendRecord(msg)
-                    }
-                })
             });
         },
 
@@ -1929,6 +1914,39 @@ export default {
             this.replyListShow = true
         },
 
+        onError(data) {
+            if (data.error !== true) {
+                return
+            }
+            const {type, content, msg} = data.errorData
+            const config = {
+                icon: 'error',
+                title: '发送失败',
+                content,
+                cancelText: '取消发送',
+                onCancel: _ => {
+                    this.tempMsgs = this.tempMsgs.filter(({id}) => id != data.id)
+                }
+            }
+            if (type === 'text') {
+                config.okText = '再次编辑'
+                config.onOk = () => {
+                    this.tempMsgs = this.tempMsgs.filter(({id}) => id != data.id)
+                    this.msgText = msg
+                    this.inputFocus()
+                }
+            } else if (type === 'record') {
+                config.okText = '重新发送'
+                config.onOk = () => {
+                    this.tempMsgs = this.tempMsgs.filter(({id}) => id != data.id)
+                    this.sendRecord(msg)
+                }
+            } else {
+                return
+            }
+            $A.modalConfirm(config)
+        },
+
         onEmoji(data) {
             if (!$A.isJson(data)) {
                 data = {

resources/assets/sass/pages/components/dialog-wrapper.scss

@@ -821,6 +821,14 @@
                     height: 21px;
                     line-height: 1;
 
+                    .error {
+                        cursor: pointer;
+                        color: #ED4014;
+                        > i {
+                            font-size: 14px;
+                        }
+                    }
+
                     .common-loading {
                         margin: 0 2px;
                         width: 10px;