diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index f13774976..d3d6a9a29 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -75,7 +75,7 @@
                                     active: msgType === item.type,
                                 }"
                                 @click="msgType=item.type">
-                                <i></i>
+                                <i class="no-dark-content"></i>
                                 <span>{{$L(item.label)}}</span>
                             </li>
                         </ul>
@@ -573,11 +573,12 @@ export default {
         dialogId: {
             handler(dialog_id) {
                 if (dialog_id) {
-                    this.msgNew = 0;
+                    this.tempMsgs = []
+                    this.msgNew = 0
                     //
                     if (this.allMsgList.length > 0) {
-                        this.allMsgs = this.allMsgList;
-                        requestAnimationFrame(this.onToBottom);
+                        this.allMsgs = this.allMsgList
+                        requestAnimationFrame(this.onToBottom)
                     }
                     this.msgType = '';
                     this.$store.dispatch("getDialogMsgs", {
@@ -602,9 +603,6 @@ export default {
         },
 
         msgType(msg_type) {
-            this.tempMsgs = this.tempMsgs.filter(({is_msg_type}) => is_msg_type !== true)
-            requestAnimationFrame(this.onToBottom)
-            //
             if (msg_type) {
                 this.$store.dispatch("getDialogMsgs", {
                     dialog_id: this.dialogId,
@@ -613,12 +611,19 @@ export default {
                     save_cancel: true,
                 }).then(({data}) => {
                     if (data.list.length > 0) {
-                        this.tempMsgs.push(...data.list.map(item => Object.assign(item, {
-                            is_msg_type: true
-                        })))
+                        const ids = this.tempMsgs.map(item => item.id)
+                        const list = data.list.filter(item => !ids.includes(item.id))
+                        if (list.length > 0) {
+                            this.tempMsgs.push(...list.map(item => Object.assign(item, {
+                                isMsgType: true
+                            })))
+                        }
                     }
                 }).catch(_ => {});
+            } else {
+                this.tempMsgs = this.tempMsgs.filter(({isMsgType}) => isMsgType !== true)
             }
+            requestAnimationFrame(this.onToBottom)
         },
 
         dialogSearchMsgId() {
@@ -644,11 +649,12 @@ export default {
         },
 
         wsOpenNum(num) {
-            if (num <= 1) return
+            if (num <= 1 || this.msgType) {
+                return
+            }
             this.$store.dispatch("getDialogMsgs", {
                 dialog_id: this.dialogId,
                 msg_id: this.msgId,
-                msg_type: this.msgType,
             }).catch(_ => {});
         },
 
@@ -1103,22 +1109,20 @@ export default {
                 msg_id: this.msgId,
                 msg_type: this.msgType,
                 prev_id: this.prevId,
-                save_before: _ => {
-                    this.scrollDisabled = true
-                }
+                save_before: _ => this.scrollDisabled = true
             }).then(({data}) => {
                 const ids = data.list.map(item => item.id)
                 this.$nextTick(() => {
                     const scroller = this.$refs.scroller
-                    const offset = ids.reduce((previousValue, currentId) => {
+                    const reducer = ids.reduce((previousValue, currentId) => {
                         const previousSize = typeof previousValue === "object" ? previousValue.size : scroller.getSize(previousValue)
                         return {size: previousSize + scroller.getSize(currentId)}
                     })
-                    let size = scroller.getOffset() + offset.size;
+                    let offset = scroller.getOffset() + reducer.size
                     if (this.prevId === 0) {
-                        size -= 36
+                        offset -= 52
                     }
-                    this.onToOffset(size)
+                    this.onToOffset(offset)
                     this.scrollDisabled = false
                 });
             }).catch(() => {})
diff --git a/resources/assets/sass/pages/components/dialog-wrapper.scss b/resources/assets/sass/pages/components/dialog-wrapper.scss
index 0f1020b6c..365c77efd 100644
--- a/resources/assets/sass/pages/components/dialog-wrapper.scss
+++ b/resources/assets/sass/pages/components/dialog-wrapper.scss
@@ -210,15 +210,16 @@
 
         .nav-tags {
             position: absolute;
-            top: 78px;
-            left: 0;
-            width: 100%;
+            top: 68px;
+            left: 12px;
+            right: 12px;
             z-index: 2;
-            padding: 4px 0;
+            height: 56px;
             display: flex;
             align-items: center;
             justify-content: flex-start;
             overflow-x: auto;
+            background-color: #ffffff;
 
             > ul {
                 margin: 0 auto;
@@ -240,6 +241,14 @@
                     cursor: pointer;
                     box-shadow: 0 1px 6px rgba(255, 255, 255, 0.2);
 
+                    @media (max-width: 640px) {
+                        margin: 0 6px;
+                    }
+
+                    @media (max-width: 375px) {
+                        margin: 0 4px;
+                    }
+
                     > i {
                         width: 14px;
                         height: 14px;
@@ -843,6 +852,7 @@
                 height: 20px;
                 box-sizing: content-box;
                 justify-content: center;
+                padding-top: 16px;
 
                 .common-loading {
                     margin: 0;
@@ -1336,13 +1346,10 @@
                     }
                 }
             }
+
             .nav-tags {
-                top: 58px;
-                > ul {
-                    > li {
-                        margin: 0 5px;
-                    }
-                }
+                top: 52px;
+                height: 46px;
             }
         }
         .dialog-scroller {
@@ -1353,7 +1360,7 @@
             background-color: #ffffff;
 
             &.default-header {
-                padding-top: 48px;
+                padding-top: 46px;
             }
 
             .dialog-item {