From abbd0e097c5227e16aadf9a18e16f7b2b150a4df Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Sun, 19 Mar 2023 20:26:45 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E8=BE=93=E5=85=A5?=
 =?UTF-8?q?=E8=8D=89=E7=A8=BF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../manage/components/ChatInput/index.vue     | 18 +++--
 .../assets/js/pages/manage/messenger.vue      | 72 +++++++++----------
 resources/assets/js/store/actions.js          | 43 ++++++++---
 .../assets/sass/pages/page-messenger.scss     | 14 ++++
 4 files changed, 93 insertions(+), 54 deletions(-)

diff --git a/resources/assets/js/pages/manage/components/ChatInput/index.vue b/resources/assets/js/pages/manage/components/ChatInput/index.vue
index 02b961b59..c5f9fc8d4 100755
--- a/resources/assets/js/pages/manage/components/ChatInput/index.vue
+++ b/resources/assets/js/pages/manage/components/ChatInput/index.vue
@@ -435,14 +435,14 @@ export default {
             this.userCache = null;
             this.taskList = null;
             this.fileList = {};
-            this.$emit('input', this.getInputCache())
+            this.loadInputCache()
         },
         taskId() {
             this.userList = null;
             this.userCache = null;
             this.taskList = null;
             this.fileList = {};
-            this.$emit('input', this.getInputCache())
+            this.loadInputCache()
         },
 
         showEmoji(val) {
@@ -516,7 +516,7 @@ export default {
             if (this.isFocus) {
                 return
             }
-            this.$emit('input', this.getInputCache())
+            this.loadInputCache()
         },
 
         wrapperHeight(newVal, oldVal) {
@@ -637,7 +637,7 @@ export default {
             if (this.value) {
                 this.setContent(this.value)
             } else {
-                this.$emit('input', this.getInputCache())
+                this.loadInputCache()
             }
 
             // Mark model as touched if editor lost focus
@@ -806,9 +806,15 @@ export default {
             this.pasteClean = bool
         },
 
-        getInputCache() {
+        loadInputCache() {
             const item = this.dialogInputCache.find(item => item.key == this.cacheKey);
-            return item ? item.cache : '';
+            if (item) {
+                this.pasteClean = false
+                this.$emit('input', item.cache)
+                this.$nextTick(_ => this.pasteClean = true)
+            } else {
+                this.$emit('input', '')
+            }
         },
 
         onClickEditor() {
diff --git a/resources/assets/js/pages/manage/messenger.vue b/resources/assets/js/pages/manage/messenger.vue
index 19957b20b..ba686233c 100644
--- a/resources/assets/js/pages/manage/messenger.vue
+++ b/resources/assets/js/pages/manage/messenger.vue
@@ -89,14 +89,20 @@
                                     <em v-if="dialog.last_at">{{$A.formatTime(dialog.last_at)}}</em>
                                 </div>
                                 <div class="dialog-text no-dark-content">
-                                    <template v-if="dialog.type=='group' && dialog.last_msg && dialog.last_msg.userid">
-                                        <div v-if="dialog.last_msg.userid == userId" class="last-self">{{$L('你')}}</div>
-                                        <UserAvatar v-else :userid="dialog.last_msg.userid" :show-name="true" :show-icon="false" tooltip-disabled/>
+                                    <template v-if="dialog.draft && dialog.id != dialogId">
+                                        <div class="last-draft">[{{$L('草稿')}}]</div>
+                                        <div class="last-text"><span>{{dialog.draft}}</span></div>
+                                    </template>
+                                    <template v-else>
+                                        <template v-if="dialog.type=='group' && dialog.last_msg && dialog.last_msg.userid">
+                                            <div v-if="dialog.last_msg.userid == userId" class="last-self">{{$L('你')}}</div>
+                                            <UserAvatar v-else :userid="dialog.last_msg.userid" :show-name="true" :show-icon="false" tooltip-disabled/>
+                                        </template>
+                                        <div class="last-text">
+                                            <em v-if="formatMsgEmojiDesc(dialog.last_msg)">{{formatMsgEmojiDesc(dialog.last_msg)}}</em>
+                                            <span>{{$A.getMsgSimpleDesc(dialog.last_msg)}}</span>
+                                        </div>
                                     </template>
-                                    <div class="last-text">
-                                        <em v-if="formatMsgEmojiDesc(dialog.last_msg)">{{formatMsgEmojiDesc(dialog.last_msg)}}</em>
-                                        <span>{{$A.getMsgSimpleDesc(dialog.last_msg)}}</span>
-                                    </div>
                                     <div v-if="dialog.silence" class="taskfont last-silence">&#xe7d7;</div>
                                 </div>
                             </div>
@@ -309,15 +315,7 @@ export default {
                 })
             }
             if (dialogActive == '' && dialogSearchKey == '') {
-                return this.cacheDialogs.filter(dialog => this.filterDialog(dialog)).sort((a, b) => {
-                    if (a.top_at || b.top_at) {
-                        return $A.Date(b.top_at) - $A.Date(a.top_at);
-                    }
-                    if (a.todo_num > 0 || b.todo_num > 0) {
-                        return b.todo_num - a.todo_num;
-                    }
-                    return $A.Date(b.last_at) - $A.Date(a.last_at);
-                });
+                return this.cacheDialogs.filter(dialog => this.filterDialog(dialog)).sort(this.dialogSort);
             }
             const list = this.cacheDialogs.filter(dialog => {
                 if (!this.filterDialog(dialog)) {
@@ -369,18 +367,7 @@ export default {
                 }
                 return true;
             })
-            return list.sort((a, b) => {
-                // 根据置顶时间排序
-                if (a.top_at || b.top_at) {
-                    return $A.Date(b.top_at) - $A.Date(a.top_at);
-                }
-                // 根据未读数排序
-                if (a.todo_num > 0 || b.todo_num > 0) {
-                    return b.todo_num - a.todo_num;
-                }
-                // 根据最后会话时间排序
-                return $A.Date(b.last_at) - $A.Date(a.last_at);
-            })
+            return list.sort(this.dialogSort)
         },
 
         contactsFilter() {
@@ -598,6 +585,23 @@ export default {
             }
         },
 
+        dialogSort(a, b) {
+            // 根据置顶时间排序
+            if (a.top_at || b.top_at) {
+                return $A.Date(b.top_at) - $A.Date(a.top_at);
+            }
+            // 根据未读数排序
+            if (a.todo_num > 0 || b.todo_num > 0) {
+                return b.todo_num - a.todo_num;
+            }
+            // 根据草稿排序
+            if (a.draft || b.draft) {
+                return (b.draft ? 1 : 0) - (a.draft ? 1 : 0);
+            }
+            // 根据最后会话时间排序
+            return $A.Date(b.last_at) - $A.Date(a.last_at);
+        },
+
         openDialog(dialogId) {
             if (this.operateVisible) {
                 return
@@ -925,18 +929,6 @@ export default {
             const {type, group_type} = data
             return type === 'group' && group_type !== 'user'
         },
-
-        userTag({identity, department_name}) {
-            const array = []
-            const deps = department_name?.split(",").find(item => /\(M\)$/.test(item))
-            if (deps) {
-                array.push(deps.replace(/\(M\)$/, '') + ' ' + this.$L('负责人'))
-            }
-            if (identity?.includes('temp')) {
-                array.push(this.$L('临时'))
-            }
-            return array.join(', ')
-        }
     }
 }
 </script>
diff --git a/resources/assets/js/store/actions.js b/resources/assets/js/store/actions.js
index d0f195916..21a6a9c7d 100644
--- a/resources/assets/js/store/actions.js
+++ b/resources/assets/js/store/actions.js
@@ -26,7 +26,7 @@ export default {
             // 读取缓存
             state.cacheServerUrl = await $A.IDBString("cacheServerUrl")
             state.cacheUserBasic = await $A.IDBArray("cacheUserBasic")
-            state.cacheDialogs = (await $A.IDBArray("cacheDialogs")).map(item => Object.assign(item, {loading: false}))
+            state.cacheDialogs = (await $A.IDBArray("cacheDialogs")).map(item => Object.assign(item, {loading: false, draft: null}))
             state.cacheProjects = await $A.IDBArray("cacheProjects")
             state.cacheColumns = await $A.IDBArray("cacheColumns")
             state.cacheTasks = await $A.IDBArray("cacheTasks")
@@ -38,6 +38,11 @@ export default {
             state.userInfo = await $A.IDBJson("userInfo")
             state.callAt = await $A.IDBArray("callAt")
 
+            // 聊天草稿
+            state.dialogInputCache.some(item => {
+                dispatch("saveDialogDraft", item)
+            })
+
             // 会员信息
             if (state.userInfo.userid) {
                 state.userId = state.userInfo.userid = $A.runNum(state.userInfo.userid)
@@ -2202,6 +2207,7 @@ export default {
                 search_msg_id = dialog_id.search_msg_id;
                 dialog_id = dialog_id.dialog_id;
             }
+            //
             requestAnimationFrame(_ => {
                 state.dialogSearchMsgId = /^\d+$/.test(search_msg_id) ? search_msg_id : 0;
                 state.dialogId = /^\d+$/.test(dialog_id) ? dialog_id : 0;
@@ -2338,6 +2344,9 @@ export default {
         if (!/^\d+$/.test(dialog_id)) {
             return
         }
+        // 保存聊天草稿
+        const item = state.dialogInputCache.find(item => item.key == dialog_id) || {key: dialog_id, cache: null};
+        dispatch("saveDialogDraft", item)
         // 关闭会话后只保留会话最后50条数据
         const retain = 50
         const msgs = state.dialogMsgs.filter(item => item.dialog_id == dialog_id)
@@ -2389,21 +2398,39 @@ export default {
     },
 
     /**
-     * 保存聊天草稿
+     * 保存输入缓存
      * @param state
-     * @param data {key, cache}
+     * @param key
+     * @param cache
      */
-    saveDialogInputCache({state}, data) {
-        const index = state.dialogInputCache.findIndex(item => item.key == data.key);
+    saveDialogInputCache({state}, {key, cache}) {
+        const index = state.dialogInputCache.findIndex(item => item.key == key);
         if (index > -1) {
-            state.dialogInputCache.splice(index, 1, data)
-        } else {
-            state.dialogInputCache.push(data)
+            if (cache) {
+                state.dialogInputCache.splice(index, 1, {key, cache})
+            } else {
+                state.dialogInputCache.splice(index, 1)
+            }
+        } else if (cache) {
+            state.dialogInputCache.push({key, cache})
         }
         //
         $A.IDBSave("dialogInputCache", state.dialogInputCache, 600);
     },
 
+    /**
+     * 保存聊天草稿
+     * @param state
+     * @param key
+     * @param cache
+     */
+    saveDialogDraft({state}, {key, cache}) {
+        const dialogs = state.cacheDialogs.find(item => item.id == key);
+        if (dialogs) {
+            dialogs.draft = cache?.replace(/<img[^>]*>/gi, `[${$A.L('图片')}]`).replace(/<[^>]*>/g, '') || null;
+        }
+    },
+
     /** *****************************************************************************************/
     /** ************************************** 消息 **********************************************/
     /** *****************************************************************************************/
diff --git a/resources/assets/sass/pages/page-messenger.scss b/resources/assets/sass/pages/page-messenger.scss
index 10e356a43..1c820981d 100644
--- a/resources/assets/sass/pages/page-messenger.scss
+++ b/resources/assets/sass/pages/page-messenger.scss
@@ -247,12 +247,14 @@
                                     align-items: center;
                                     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
 
+                                    .last-draft,
                                     .common-avatar,
                                     .last-self {
                                         flex-shrink: 0;
                                         padding-right: 4px;
                                         margin-right: 4px;
                                         position: relative;
+                                        overflow: hidden;
                                         &:after {
                                             content: ":";
                                             position: absolute;
@@ -261,6 +263,18 @@
                                             right: 0;
                                         }
                                     }
+                                    .last-draft {
+                                        color: #ff0000;
+                                        &:after {
+                                            color: $primary-desc-color;
+                                        }
+                                    }
+                                    .common-avatar {
+                                        flex-shrink: 1;
+                                        .avatar-name {
+                                            max-width: 100%;
+                                        }
+                                    }
                                     .last-text {
                                         flex: 1;
                                         display: flex;