From 1f7fca0c787f19d9e5047e1d6eb99641237641a4 Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Sat, 4 Mar 2023 15:01:30 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E7=82=B9=E5=87=BB=E4=BC=9A=E8=AF=9D?=
 =?UTF-8?q?=E6=B6=88=E6=81=AF=E5=A4=B4=E5=83=8F@?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/assets/js/components/UserAvatar.vue |  5 ++--
 .../manage/components/ChatInput/index.vue     |  7 ++++++
 .../js/pages/manage/components/DialogItem.vue | 24 ++++++++++++++++++-
 .../pages/manage/components/DialogWrapper.vue | 15 +++++++++++-
 4 files changed, 46 insertions(+), 5 deletions(-)

diff --git a/resources/assets/js/components/UserAvatar.vue b/resources/assets/js/components/UserAvatar.vue
index f1077f6c5..c2f496cc3 100755
--- a/resources/assets/js/components/UserAvatar.vue
+++ b/resources/assets/js/components/UserAvatar.vue
@@ -295,17 +295,16 @@
             onClickOpen() {
                 if (this.clickOpenDialog) {
                     this.openDialog()
+                } else {
+                    this.$emit('open-dialog', this.userid)
                 }
             },
 
             openDialog() {
-                this.$store.dispatch("showSpinner", 600)
                 this.$store.dispatch("openDialogUserid", this.userid).then(_ => {
                     this.goForward({name: 'manage-messenger'})
                 }).catch(({msg}) => {
                     $A.modalError(msg)
-                }).finally(_ => {
-                    this.$store.dispatch("hiddenSpinner")
                 });
             },
 
diff --git a/resources/assets/js/pages/manage/components/ChatInput/index.vue b/resources/assets/js/pages/manage/components/ChatInput/index.vue
index 6b0ab4cfb..abc974024 100755
--- a/resources/assets/js/pages/manage/components/ChatInput/index.vue
+++ b/resources/assets/js/pages/manage/components/ChatInput/index.vue
@@ -1022,6 +1022,13 @@ export default {
             }
         },
 
+        addMention(data) {
+            if (!this.quill) {
+                return;
+            }
+            this.quill.getModule("mention").insertItem(data, true);
+        },
+
         getProjectId() {
             let object = null;
             if (this.dialogId > 0) {
diff --git a/resources/assets/js/pages/manage/components/DialogItem.vue b/resources/assets/js/pages/manage/components/DialogItem.vue
index 1a825fe25..58fa558fa 100644
--- a/resources/assets/js/pages/manage/components/DialogItem.vue
+++ b/resources/assets/js/pages/manage/components/DialogItem.vue
@@ -22,7 +22,12 @@
         </div>
         <template v-else>
             <div class="dialog-avatar">
-                <UserAvatar :userid="source.userid" tooltip-disabled :click-open-dialog="dialogData.type == 'group'" :size="30"/>
+                <UserAvatar
+                    v-longpress="{callback: onMention, delay: 300}"
+                    @open-dialog="onOpenDialog"
+                    :userid="source.userid"
+                    :size="30"
+                    tooltip-disabled/>
             </div>
             <DialogView
                 :msg-data="source"
@@ -48,10 +53,12 @@
 <script>
 import {mapState} from "vuex";
 import DialogView from "./DialogView";
+import longpress from "../../../directives/longpress";
 
 export default {
     name: "DialogItem",
     components: {DialogView},
+    directives: {longpress},
     props: {
         source: {
             type: Object,
@@ -169,6 +176,21 @@ export default {
             })
         },
 
+        onOpenDialog(userid) {
+            if (this.dialogData.type != 'group') {
+                return
+            }
+            this.$store.dispatch("openDialogUserid", userid).then(_ => {
+                this.goForward({name: 'manage-messenger'})
+            }).catch(({msg}) => {
+                $A.modalError(msg)
+            });
+        },
+
+        onMention() {
+            this.dispatch("on-mention", this.source)
+        },
+
         onLongpress(e) {
             this.dispatch("on-longpress", e)
         },
diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index 4bf4f5fb7..4cb072ec3 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -125,6 +125,7 @@
             @range="onRange"
             @totop="onPrevPage"
 
+            @on-mention="onMention"
             @on-longpress="onLongpress"
             @on-view-reply="onViewReply"
             @on-view-text="onViewText"
@@ -569,7 +570,8 @@ export default {
             'cacheDialogs',
             'wsOpenNum',
             'touchBackInProgress',
-            'dialogIns'
+            'dialogIns',
+            'cacheUserBasic'
         ]),
 
         ...mapGetters(['isLoad']),
@@ -1777,6 +1779,17 @@ export default {
             }
         },
 
+        onMention(data) {
+            const user = this.cacheUserBasic.find(({userid}) => userid == data.userid);
+            if (user) {
+                this.$refs.input.addMention({
+                    denotationChar: "@",
+                    id: user.userid,
+                    value: user.nickname,
+                })
+            }
+        },
+
         onLongpress({event, el, msgData}) {
             this.operateVisible = this.operateItem.id === msgData.id;
             this.operateItem = $A.isJson(msgData) ? msgData : {};