From 19da7a74dfcb55ca0d8492c6613d6615c0c9b5b3 Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Thu, 10 Apr 2025 10:47:12 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E9=95=BF=E6=8C=89?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../assets/js/pages/manage/messenger.vue      | 162 +++++++++---------
 .../assets/sass/pages/page-messenger.scss     |  18 +-
 2 files changed, 90 insertions(+), 90 deletions(-)

diff --git a/resources/assets/js/pages/manage/messenger.vue b/resources/assets/js/pages/manage/messenger.vue
index d8a834352..d79e44384 100644
--- a/resources/assets/js/pages/manage/messenger.vue
+++ b/resources/assets/js/pages/manage/messenger.vue
@@ -2,7 +2,7 @@
     <div class="page-messenger">
         <PageTitle :title="$L(tabActive==='dialog' ? '消息' : '通讯录')"/>
         <div class="messenger-wrapper">
-            <div class="messenger-select">
+            <div ref="select" class="messenger-select">
                 <div class="messenger-search">
                     <div class="search-wrapper">
                         <div class="search-pre">
@@ -164,84 +164,6 @@
                             {{$L(contactsKey ? `没有任何与"${contactsKey}"相关的结果` : `没有任何联系人`)}}
                         </li>
                     </ul>
-                    <div class="operate-position" :style="operateStyles" v-show="operateVisible">
-                        <Dropdown
-                            trigger="custom"
-                            transferClassName="scrollbar-hidden"
-                            :placement="windowLandscape ? 'bottom' : 'top'"
-                            :visible="operateVisible"
-                            @on-clickoutside="operateVisible = false"
-                            transfer>
-                            <div :style="{userSelect:operateVisible ? 'none' : 'auto', height: operateStyles.height}"></div>
-                            <DropdownMenu slot="list" class="messenger-dialog-operation">
-                                <template v-if="operateType==='dialog'">
-                                    <DropdownItem @click.native="handleDialogClick('top')">
-                                        <div class="item">
-                                            {{ $L(operateItem.top_at ? '取消置顶' : '置顶') }}
-                                            <i class="taskfont" v-html="operateItem.top_at ? '&#xe7e3;' : '&#xe7e6;'"></i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleDialogClick('read')">
-                                        <div class="item">
-                                            {{ $L($A.getDialogUnread(operateItem, true) > 0 ? '标记已读' : '标记未读') }}
-                                            <i class="taskfont" v-html="$A.getDialogUnread(operateItem, true) > 0 ? '&#xe7e8;' : '&#xe7e9;'"></i>
-                                        </div>
-
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleDialogClick('silence')" :disabled="silenceDisabled(operateItem)">
-                                        <div class="item">
-                                            {{ $L(operateItem.silence ? '允许消息通知' : '消息免打扰') }}
-                                            <i class="taskfont" v-html="operateItem.silence ? '&#xe7eb;' : '&#xe7d7;'"></i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem v-if="$Electron" divided @click.native="handleDialogClick('single')">
-                                        <div class="item">
-                                            {{ $L('独立窗口显示') }}
-                                            <i class="taskfont">&#xe776;</i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleDialogClick('hide')" :disabled="!!operateItem.top_at">
-                                        <div class="item">
-                                            {{ $L('不显示该会话') }}
-                                            <i class="taskfont">&#xe881;</i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleDialogClick('color', c.color)" v-for="(c, k) in taskColorList" :key="'c_' + k" :divided="k==0"  v-if="k<6" >
-                                        <div class="item">
-                                            {{$L(c.name)}}
-                                            <i class="taskfont color" :style="{color:c.primary||'#ddd'}" v-html="c.color == (operateItem.color||'') ? '&#xe61d;' : '&#xe61c;'"></i>
-                                        </div>
-                                    </DropdownItem>
-                                </template>
-                                <template v-else>
-                                    <DropdownItem @click.native="handleUserClick('msg')">
-                                        <div class="item">
-                                            {{ $L('发送消息') }}
-                                            <i class="taskfont">&#xe6eb;</i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleUserClick('meet')">
-                                        <div class="item">
-                                            {{ $L('发起会议') }}
-                                            <i class="taskfont">&#xe794;</i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleUserClick('group')">
-                                        <div class="item">
-                                            {{ $L('创建群组') }}
-                                            <i class="taskfont">&#xe63f;</i>
-                                        </div>
-                                    </DropdownItem>
-                                    <DropdownItem @click.native="handleUserClick('avatar')">
-                                        <div class="item">
-                                            {{ $L('查看头像') }}
-                                            <i class="taskfont">&#xe7bc;</i>
-                                        </div>
-                                    </DropdownItem>
-                                </template>
-                            </DropdownMenu>
-                        </Dropdown>
-                    </div>
                 </Scrollbar>
                 <div class="messenger-menu">
                     <div class="menu-icon">
@@ -252,6 +174,84 @@
                         <Icon @click="tabActive='contacts'" :class="{active:tabActive==='contacts'}" type="md-person" />
                     </div>
                 </div>
+                <div class="operate-position" :style="operateStyles" v-show="operateVisible">
+                    <Dropdown
+                        trigger="custom"
+                        transferClassName="scrollbar-hidden"
+                        :placement="windowLandscape ? 'bottom' : 'top'"
+                        :visible="operateVisible"
+                        @on-clickoutside="operateVisible = false"
+                        transfer>
+                        <div :style="{userSelect:operateVisible ? 'none' : 'auto', height: operateStyles.height}"></div>
+                        <DropdownMenu slot="list" class="messenger-dialog-operation">
+                            <template v-if="operateType==='dialog'">
+                                <DropdownItem @click.native="handleDialogClick('top')">
+                                    <div class="item">
+                                        {{ $L(operateItem.top_at ? '取消置顶' : '置顶') }}
+                                        <i class="taskfont" v-html="operateItem.top_at ? '&#xe7e3;' : '&#xe7e6;'"></i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleDialogClick('read')">
+                                    <div class="item">
+                                        {{ $L($A.getDialogUnread(operateItem, true) > 0 ? '标记已读' : '标记未读') }}
+                                        <i class="taskfont" v-html="$A.getDialogUnread(operateItem, true) > 0 ? '&#xe7e8;' : '&#xe7e9;'"></i>
+                                    </div>
+
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleDialogClick('silence')" :disabled="silenceDisabled(operateItem)">
+                                    <div class="item">
+                                        {{ $L(operateItem.silence ? '允许消息通知' : '消息免打扰') }}
+                                        <i class="taskfont" v-html="operateItem.silence ? '&#xe7eb;' : '&#xe7d7;'"></i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem v-if="$Electron" divided @click.native="handleDialogClick('single')">
+                                    <div class="item">
+                                        {{ $L('独立窗口显示') }}
+                                        <i class="taskfont">&#xe776;</i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleDialogClick('hide')" :disabled="!!operateItem.top_at">
+                                    <div class="item">
+                                        {{ $L('不显示该会话') }}
+                                        <i class="taskfont">&#xe881;</i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleDialogClick('color', c.color)" v-for="(c, k) in taskColorList" :key="'c_' + k" :divided="k==0"  v-if="k<6" >
+                                    <div class="item">
+                                        {{$L(c.name)}}
+                                        <i class="taskfont color" :style="{color:c.primary||'#ddd'}" v-html="c.color == (operateItem.color||'') ? '&#xe61d;' : '&#xe61c;'"></i>
+                                    </div>
+                                </DropdownItem>
+                            </template>
+                            <template v-else>
+                                <DropdownItem @click.native="handleUserClick('msg')">
+                                    <div class="item">
+                                        {{ $L('发送消息') }}
+                                        <i class="taskfont">&#xe6eb;</i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleUserClick('meet')">
+                                    <div class="item">
+                                        {{ $L('发起会议') }}
+                                        <i class="taskfont">&#xe794;</i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleUserClick('group')">
+                                    <div class="item">
+                                        {{ $L('创建群组') }}
+                                        <i class="taskfont">&#xe63f;</i>
+                                    </div>
+                                </DropdownItem>
+                                <DropdownItem @click.native="handleUserClick('avatar')">
+                                    <div class="item">
+                                        {{ $L('查看头像') }}
+                                        <i class="taskfont">&#xe7bc;</i>
+                                    </div>
+                                </DropdownItem>
+                            </template>
+                        </DropdownMenu>
+                    </Dropdown>
+                </div>
             </div>
 
             <div v-if="activeNum > 0 && routeName === 'manage-messenger'" class="messenger-msg">
@@ -1060,9 +1060,9 @@ export default {
             this.operateVisible = false;
             this.operateItem = $A.isJson(item) ? item : {};
             this.$nextTick(() => {
-                const parentRect = this.$refs.list?.$el?.getBoundingClientRect() || {top: 0, left: 0}
+                const parentRect = this.$refs.select?.getBoundingClientRect() || {top: 0, left: 0}
                 this.operateStyles = {
-                    left: `${clientX - parentRect.left}px`,
+                    left: `${clientX}px`,
                     top: `${rect.top + this.windowScrollY - parentRect.top}px`,
                     height: rect.height + 'px',
                 }
diff --git a/resources/assets/sass/pages/page-messenger.scss b/resources/assets/sass/pages/page-messenger.scss
index 8e283a99c..bb1e4b539 100644
--- a/resources/assets/sass/pages/page-messenger.scss
+++ b/resources/assets/sass/pages/page-messenger.scss
@@ -519,15 +519,6 @@
                         }
                     }
                 }
-                .operate-position {
-                    position: fixed;
-                    top: 0;
-                    left: 0;
-                    width: 1px;
-                    opacity: 0;
-                    visibility: hidden;
-                    pointer-events: none;
-                }
             }
             .messenger-menu {
                 display: flex;
@@ -564,6 +555,15 @@
                     }
                 }
             }
+            .operate-position {
+                position: fixed;
+                top: 0;
+                left: 0;
+                width: 1px;
+                opacity: 0;
+                visibility: hidden;
+                pointer-events: none;
+            }
         }
         .messenger-msg {
             flex: 1;