From 6b2b072e16952ff7cd3ba9b116b5f05b66389a7d Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Wed, 20 Apr 2022 16:46:12 +0800
Subject: [PATCH] no message

---
 .../pages/manage/components/ChatInput/index.vue   | 15 ++++++++++++++-
 .../js/pages/manage/components/DialogWrapper.vue  | 13 +++++++++++--
 .../assets/sass/pages/components/chat-input.scss  |  5 +++--
 .../sass/pages/components/dialog-wrapper.scss     |  7 +++++++
 4 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/resources/assets/js/pages/manage/components/ChatInput/index.vue b/resources/assets/js/pages/manage/components/ChatInput/index.vue
index 1eb3f0731..091f1a204 100755
--- a/resources/assets/js/pages/manage/components/ChatInput/index.vue
+++ b/resources/assets/js/pages/manage/components/ChatInput/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="chat-input-wrapper" :class="modeClass">
-        <div ref="editor" class="no-dark-content"></div>
+        <div ref="editor" class="no-dark-content" :style="editorStyle"></div>
         <div class="chat-input-toolbar">
             <slot name="toolbarBefore"/>
 
@@ -106,6 +106,7 @@ export default {
             _options: {},
 
             modeClass: '',
+            editorStyle: {},
 
             userList: null,
             taskList: null,
@@ -268,10 +269,12 @@ export default {
                 this._content = html
                 this.$emit('input', this._content)
                 this.$emit('on-change', { html, text, quill })
+                this.calcEditStyle();
             })
 
             // Emit ready event
             this.$emit('on-ready', this.quill)
+            this.calcEditStyle();
         },
 
         focus() {
@@ -290,6 +293,16 @@ export default {
             this.$emit('on-send')
         },
 
+        calcEditStyle() {
+            if (this.$refs.editor.clientWidth < 120 || this.$refs.editor.clientHeight > 40) {
+                this.editorStyle = {
+                    width: '100%'
+                };
+            } else {
+                this.editorStyle = {};
+            }
+        },
+
         onSelectEmoji(item) {
             if (!this.quill) {
                 return;
diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index 73c1598e5..e876900d3 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -307,9 +307,18 @@ export default {
                     this.msgNew = 0;
                     this.topId = -1;
                     this.visible = false;
+                    if (this.dialogMsgList.length > 0) {
+                        setTimeout(_ => {
+                            this.onToBottom();
+                            this.visible = true;
+                        }, 10);
+                    }
+                    let startTime = new Date().getTime();
                     this.$store.dispatch("getDialogMsgs", id).then(_ => {
-                        this.onToBottom();
-                        this.visible = true;
+                        setTimeout(_ => {
+                            this.onToBottom();
+                            this.visible = true;
+                        }, Math.max(0, 100 - (new Date().getTime() - startTime)));
                     });
                 }
             },
diff --git a/resources/assets/sass/pages/components/chat-input.scss b/resources/assets/sass/pages/components/chat-input.scss
index 1f2dd9ea0..f2f2297ac 100755
--- a/resources/assets/sass/pages/components/chat-input.scss
+++ b/resources/assets/sass/pages/components/chat-input.scss
@@ -28,8 +28,9 @@
     .ql-container {
         display: block;
         float: left;
+        width: auto;
         max-width: 100%;
-        min-width: calc(100% - 175px);
+        min-width: calc(100% - 170px);
         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
 
         .ql-editor {
@@ -216,7 +217,7 @@
         align-items: center;
         justify-content: flex-end;
         float: right;
-        width: 175px;
+        width: 170px;
         height: 28px;
         padding: 0 2px;
         .common-loading {
diff --git a/resources/assets/sass/pages/components/dialog-wrapper.scss b/resources/assets/sass/pages/components/dialog-wrapper.scss
index d05984528..5fd6cff20 100644
--- a/resources/assets/sass/pages/components/dialog-wrapper.scss
+++ b/resources/assets/sass/pages/components/dialog-wrapper.scss
@@ -601,6 +601,13 @@
                                         > pre {
                                             .mention {
                                                 color: #333333;
+
+                                                &.me {
+                                                    font-size: 14px;
+                                                    font-weight: normal;
+                                                    padding: 3px 0;
+                                                    background-color: transparent;
+                                                }
                                             }
                                         }
                                     }