no message

resources/assets/js/components/UserAvatar/index.vue

@@ -9,7 +9,7 @@
             :class="boxClass"
             :style="boxStyle"
             :title="showName ? undefined : user.nickname">
-            <em :style="spotStyle"></em>
+            <em v-if="showStateDot" :style="spotStyle"></em>
             <EAvatar v-if="showImg" ref="avatar" :class="{'avatar-default':isDefault}" :src="user.userimg" :size="avatarSize" :error="onError">
                 <span class="avatar-char" :style="spotStyle">{{nickname}}</span>
             </EAvatar>

resources/assets/js/components/UserAvatar/mixin.js

@@ -34,6 +34,10 @@ export default {
         },
         userResult: {
             default: null
+        },
+        showStateDot: {
+            type: Boolean,
+            default: true
         }
     }
 }

resources/assets/js/components/UserAvatar/tip.vue

@@ -11,9 +11,6 @@
             <p v-if="user.delete_at"><strong>{{$L('删除时间')}}: {{user.delete_at}}</strong></p>
             <p v-else-if="user.disable_at"><strong>{{$L('离职时间')}}: {{user.disable_at}}</strong></p>
             <slot name="end"/>
-            <div v-if="showMenu" class="avatar-icons">
-                <Icon type="ios-chatbubbles" @click="onOpenDialog"/>
-            </div>
         </div>
         <div>
             <UserAvatar
@@ -26,6 +23,7 @@
                 :borderWitdh="borderWitdh"
                 :borderColor="borderColor"
                 :clickOpenDialog="clickOpenDialog"
+                :showStateDot="showStateDot"
                 :userResult="onUserResult"/>
         </div>
     </ETooltip>
@@ -42,10 +40,6 @@ export default {
             type: Boolean,
             default: false
         },
-        showIconMenu: {
-            type: Boolean,
-            default: false
-        },
         tooltipPlacement: {
             type: String,
             default: 'bottom'
@@ -75,26 +69,12 @@ export default {
     },
 
     computed: {
-        showMenu() {
-            if (this.$store.state.userId == this.userid) {
-                return false
-            }
-            if (this.user.delete_at || this.user.disable_at) {
-                return false
-            }
-            return this.showIconMenu
-        },
-
         isBot() {
             return !!(this.user && this.user.bot);
         },
     },
 
     methods: {
-        onOpenDialog() {
-            this.$refs.avatar.openDialog();
-        },
-
         onUserResult(info) {
             if (typeof this.userResult === "function") {
                 this.userResult(info);

resources/assets/js/pages/manage.vue

@@ -291,6 +291,9 @@
         <!--搜索框-->
         <SearchBox ref="searchBox"/>
 
+        <!--会员详情窗口-->
+        <UserDetail/>
+
         <!--工作报告-->
         <DrawerOverlay
             v-model="workReportShow"
@@ -369,9 +372,11 @@ import ApproveDetails from "./manage/approve/details.vue";
 import notificationKoro from "notification-koro1";
 import emitter from "../store/events";
 import SearchBox from "../components/SearchBox.vue";
+import UserDetail from "./manage/components/UserDetail.vue";
 
 export default {
     components: {
+        UserDetail,
         SearchBox,
         ApproveDetails,
         ImgUpload,

resources/assets/js/pages/manage/components/DialogWrapper.vue

@@ -41,7 +41,7 @@
                                 <template v-for="tag in $A.dialogTags(dialogData)" v-if="tag.color != 'success'">
                                     <Tag :color="tag.color" :fade="false">{{$L(tag.text)}}</Tag>
                                 </template>
-                                <h2 class="user-select-auto">{{dialogData.name}}</h2>
+                                <h2 class="user-select-auto" @click="onViewAvatar">{{dialogData.name}}</h2>
                                 <em v-if="peopleNum > 0" @click="onDialogMenu('groupInfo')">({{peopleNum}})</em>
                                 <Tag v-if="dialogData.bot" class="after" :fade="false">{{$L('机器人')}}</Tag>
                                 <Tag v-if="dialogData.type === 'user' && approvaUserStatus" class="after" color="red" :fade="false">{{$L(approvaUserStatus)}}</Tag>
@@ -4273,15 +4273,19 @@ export default {
         },
 
         onViewAvatar(e) {
-            let src = null
+            if (this.dialogData.type == 'group') {
-            if (e.target.tagName === "IMG") {
+                let src = null
-                src = e.target.src
+                if (e.target.tagName === "IMG") {
-            } else {
+                    src = e.target.src
-                src = $A(e.target).find("img").attr("src")
+                } else {
-            }
+                    src = $A(e.target).find("img").attr("src")
-            if (src) {
+                }
-                this.$store.dispatch("previewImage", src)
+                if (src) {
+                    this.$store.dispatch("previewImage", src)
+                }
+                return;
             }
+            emitter.emit("openUser", this.dialogData.dialog_user?.userid)
         },
 
         onTopOperate() {

resources/assets/sass/components/user-avatar.scss

@@ -126,23 +126,4 @@
             }
         }
     }
-    .avatar-icons {
-        margin-top: 12px;
-        border-top: 1px solid rgba(244, 244, 245, 0.5);
-        padding: 8px 0 0;
-        display: flex;
-        align-items: center;
-        > i {
-            cursor: pointer;
-            font-size: 22px;
-            margin-right: 12px;
-            color: #F4F4F5;
-            &:last-child {
-                margin-right: 0;
-            }
-            &:hover {
-                color: #ffffff;
-            }
-        }
-    }
 }

resources/assets/sass/pages/components/_.scss

@@ -31,3 +31,4 @@
 @import "calendar";
 @import "dialog-droup-word-chain";
 @import "dialog-complaint-info";
+@import "user-detail";

resources/assets/sass/pages/components/user-detail.scss

@@ -0,0 +1,56 @@
+.common-user-detail-modal {
+    .ivu-modal {
+        max-width: 90%;
+
+        &.ivu-modal-fullscreen {
+            max-width: none;
+
+            .ivu-modal-content {
+                margin-top: calc(var(--status-bar-height) + 46px);
+                margin-bottom: 0;
+                border-top-left-radius: 18px !important;
+                border-top-right-radius: 18px !important;
+
+                .ivu-modal-body {
+                    .user-detail-body {
+                        padding-bottom: var(--navigation-bar-height);
+                    }
+                }
+            }
+        }
+
+        .ivu-modal-content {
+            overflow: hidden;
+
+            .ivu-modal-body {
+                padding: 0 !important;
+                display: flex;
+                flex-direction: column;
+
+                .user-detail-body {
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    gap: 16px;
+                    padding: 84px 24px;
+
+                    > ul {
+                        > li {
+                            list-style: none;
+                            display: flex;
+                            justify-content: center;
+                            max-width: 80%;
+                            margin: 12px auto;
+
+                            > span {
+                                flex-shrink: 0;
+                                opacity: 0.8;
+                                padding-right: 4px;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}