From fe4cba61e2a85ac8b671d3769d0b157ba32fffb9 Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Wed, 13 Dec 2023 16:21:51 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E5=A4=B4=E5=83=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/assets/js/app.js                    |   2 +-
 resources/assets/js/components/UserAvatar.vue | 316 ------------------
 .../assets/js/components/UserAvatar/index.vue | 184 ++++++++++
 .../assets/js/components/UserAvatar/mixin.js  |  39 +++
 .../assets/js/components/UserAvatar/tip.vue   |  94 ++++++
 resources/assets/js/components/UserSelect.vue |   6 +-
 resources/assets/js/pages/manage.vue          |   6 +-
 .../manage/components/ChatInput/index.vue     |   2 +-
 .../manage/components/DialogGroupInfo.vue     |   2 +-
 .../js/pages/manage/components/DialogItem.vue |   9 +-
 .../pages/manage/components/DialogRespond.vue |   2 +-
 .../js/pages/manage/components/DialogView.vue |  14 +-
 .../pages/manage/components/DialogWrapper.vue |   6 +-
 .../pages/manage/components/ProjectPanel.vue  |  10 +-
 .../manage/components/ProjectWorkflow.vue     |   2 +-
 .../pages/manage/components/TaskExistTips.vue |   2 +-
 .../manage/components/TeamManagement.vue      |   7 +-
 resources/assets/js/pages/manage/file.vue     |  13 +-
 .../assets/js/pages/manage/messenger.vue      |   2 +-
 19 files changed, 362 insertions(+), 356 deletions(-)
 delete mode 100755 resources/assets/js/components/UserAvatar.vue
 create mode 100755 resources/assets/js/components/UserAvatar/index.vue
 create mode 100644 resources/assets/js/components/UserAvatar/mixin.js
 create mode 100755 resources/assets/js/components/UserAvatar/tip.vue

diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js
index 958a25038..23daf1646 100644
--- a/resources/assets/js/app.js
+++ b/resources/assets/js/app.js
@@ -39,7 +39,7 @@ import AutoTip from './components/AutoTip.vue'
 import TagInput from './components/TagInput.vue'
 import TableAction from './components/TableAction.vue'
 import QuickEdit from './components/QuickEdit.vue'
-import UserAvatar from './components/UserAvatar.vue'
+import UserAvatar from './components/UserAvatar'
 import ImgView from './components/ImgView.vue'
 import Scrollbar from './components/Scrollbar'
 
diff --git a/resources/assets/js/components/UserAvatar.vue b/resources/assets/js/components/UserAvatar.vue
deleted file mode 100755
index 8b1c2278a..000000000
--- a/resources/assets/js/components/UserAvatar.vue
+++ /dev/null
@@ -1,316 +0,0 @@
-<template>
-    <ETooltip
-        v-if="user"
-        class="common-avatar"
-        :open-delay="openDelay"
-        :disabled="$isEEUiApp || windowTouch || tooltipDisabled || isBot"
-        :placement="tooltipPlacement">
-        <div slot="content" class="common-avatar-transfer">
-            <slot/>
-            <p>{{$L('昵称')}}: {{user.nickname}}<em v-if="user.delete_at" class="deleted no-dark-content">{{$L('已删除')}}</em><em v-else-if="user.disable_at" class="disabled no-dark-content">{{$L('已离职')}}</em></p>
-            <p class="department-name" :title="user.department_name || ''">{{$L('部门')}}: {{user.department_name || '-'}}</p>
-            <p>{{$L('职位/职称')}}: {{user.profession || '-'}}</p>
-            <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="openDialog"/>
-            </div>
-        </div>
-        <div class="avatar-wrapper" :class="{'avatar-pointer': clickOpenDialog}" @click="onClickOpen">
-            <div v-if="showIcon" :class="boxClass" :style="boxStyle">
-                <em :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>
-                <EAvatar v-else :size="avatarSize" class="avatar-text">
-                    <span class="avatar-char" :style="spotStyle">{{nickname}}</span>
-                </EAvatar>
-            </div>
-            <div v-if="showName" class="avatar-name" :style="nameStyle">
-                <div v-if="user.bot" class="taskfont bot">&#xe68c;</div>
-                <span>{{nameText || user.nickname}}</span>
-            </div>
-        </div>
-    </ETooltip>
-</template>
-
-<script>
-    import {mapState} from "vuex";
-    import {Store} from 'le5le-store';
-
-    export default {
-        name: 'UserAvatar',
-        props: {
-            userid: {
-                type: [String, Number],
-                default: ''
-            },
-            size: {
-                type: [String, Number],
-                default: 'default'
-            },
-            showIcon: {
-                type: Boolean,
-                default: true
-            },
-            showName: {
-                type: Boolean,
-                default: false
-            },
-            nameText: {
-                type: String,
-                default: null   // showName = true 时有效，留空就显示会员昵称
-            },
-            tooltipDisabled: {
-                type: Boolean,
-                default: false
-            },
-            showIconMenu: {
-                type: Boolean,
-                default: false
-            },
-            clickOpenDialog: {
-                type: Boolean,
-                default: false
-            },
-            tooltipPlacement: {
-                type: String,
-                default: 'bottom'
-            },
-            borderWitdh: {
-                type: Number,
-                default: 0
-            },
-            borderColor: {
-                type: String,
-                default: ''
-            },
-            openDelay: {
-                type: Number,
-                default: 600
-            },
-            userResult: {
-                type: Function,
-                default: () => {
-                }
-            }
-        },
-        data() {
-            return {
-                user: null,
-                subscribe: null
-            }
-        },
-        mounted() {
-            this.getData();
-            //
-            this.subscribe = Store.subscribe('cacheUserActive', (data) => {
-                if (data.userid == this.userid) {
-                    this.setUser(data)
-                }
-            });
-            this.$store.state.userAvatar[this._uid] = this.$props;
-        },
-        beforeDestroy() {
-            if (this.subscribe) {
-                this.subscribe.unsubscribe();
-                this.subscribe = null;
-            }
-            if (this.$store.state.userAvatar[this._uid] !== undefined) {
-                delete this.$store.state.userAvatar[this._uid];
-            }
-        },
-        computed: {
-            ...mapState(['userInfo', 'userOnline', 'cacheUserBasic']),
-
-            boxClass() {
-                return {
-                    'avatar-box': true,
-                    'online': this.userId === this.userid || this.user.online || this.isBot,
-                    'disabled': this.user.disable_at,
-                    'deleted': this.user.delete_at
-                }
-            },
-
-            boxStyle() {
-                const style = {};
-                const {borderWitdh, borderColor} = this
-                if (borderWitdh > 0) {
-                    style.border = borderWitdh + "px solid " + (borderColor || "#ffffff");
-                }
-                return style;
-            },
-
-            spotStyle() {
-                let {borderWitdh, size} = this
-                if (size === 'default') size = 32;
-                if (borderWitdh > 0) size-= borderWitdh;
-                if (size == 32) {
-                    return {}
-                }
-                return {
-                    'transform': 'scale(' + Math.min(1.25, size / 32) + ')',
-                }
-            },
-
-            nameStyle() {
-                const {showIcon} = this;
-                const {delete_at, disable_at} = this.user
-                const styles = {}
-                if (!showIcon) {
-                    styles.marginLeft = 0
-                }
-                if (delete_at || disable_at) {
-                    styles.opacity = 0.8
-                    styles.textDecoration = "line-through"
-                }
-                return styles
-            },
-
-            avatarSize() {
-                let {borderWitdh, size} = this
-                if (size === 'default') size = 32;
-                if (borderWitdh > 0) {
-                    return size - borderWitdh * 2;
-                } else {
-                    return size;
-                }
-            },
-
-            showImg() {
-                const {userimg} = this.user
-                if (!userimg) {
-                    return false;
-                }
-                return !$A.rightExists(userimg, '/avatar.png');
-            },
-
-            showMenu() {
-                if (this.userId == this.userid) {
-                    return false
-                }
-                if (this.user.delete_at || this.user.disable_at) {
-                    return false
-                }
-                return this.showIconMenu
-            },
-
-            isDefault() {
-                const {userimg} = this.user
-                return $A.strExists(userimg, '/avatar');
-            },
-
-            isBot() {
-                return !!(this.user && this.user.bot);
-            },
-
-            nickname() {
-                const {nickname} = this.user;
-                if (!nickname) {
-                    return "D";
-                }
-                let value = nickname.substring(0, 2);
-                if (/^[\u4e00-\u9fa5]+$/.test(value)) {
-                    value = value.substring(0, 1);
-                }
-                return value || 'D';
-            }
-        },
-        watch: {
-            userid() {
-                this.getData()
-            },
-
-            userInfo(info) {
-                if (info.userid == this.userid) {
-                    this.setUser(info);
-                }
-            },
-
-            userOnline(data) {
-                if (this.user && typeof data[this.user.userid] !== "undefined") {
-                    this.$set(this.user, 'online', data[this.user.userid]);
-                }
-            },
-
-            'user.online'(val) {
-                if (val || this.userId === this.userid) {
-                    this.$emit('update:online', true)
-                } else {
-                    const now = $A.Time()
-                    const line = $A.Time(this.user.line_at)
-                    const seconds = now - line
-                    let stats = '最后在线于很久以前';
-                    if (seconds < 60) {
-                        stats = `最后在线于刚刚`
-                    } else if (seconds < 3600) {
-                        stats = `最后在线于 ${Math.floor(seconds / 60)} 分钟前`
-                    } else if (seconds < 3600 * 6) {
-                        stats = `最后在线于 ${Math.floor(seconds / 3600)} 小时前`
-                    } else {
-                        const nowYmd = $A.formatDate('Y-m-d', now)
-                        const lineYmd = $A.formatDate('Y-m-d', line)
-                        const lineHi = $A.formatDate('H:i', line)
-                        if (nowYmd === lineYmd) {
-                            stats = `最后在线于今天 ${lineHi}`
-                        } else if ($A.formatDate('Y-m-d', now - 86400) === lineYmd) {
-                            stats = `最后在线于昨天 ${lineHi}`
-                        } else if (seconds < 3600 * 24 * 365) {
-                            stats = `最后在线于 ${lineYmd}`
-                        }
-                    }
-                    this.$emit('update:online', this.$L(stats))
-                }
-            }
-        },
-        methods: {
-            getData() {
-                if (!this.userid) {
-                    return;
-                }
-                if (this.userid == this.userInfo.userid) {
-                    this.setUser(this.userInfo);
-                    return;
-                }
-                const tempUser = this.cacheUserBasic.find(({userid}) => userid == this.userid);
-                if (tempUser) {
-                    this.setUser(tempUser);
-                }
-                this.$store.dispatch("getUserBasic", {userid: this.userid});
-            },
-
-            setUser(info) {
-                try {
-                    if (this.user && this.user.userimg != info.userimg && this.$refs.avatar) {
-                        this.$refs.avatar.$data.isImageExist = true;
-                    }
-                } catch (e) {
-                    //
-                }
-                this.user = info;
-                this.userResult(info);
-            },
-
-            onClickOpen() {
-                if (this.clickOpenDialog) {
-                    this.openDialog()
-                } else {
-                    this.$emit('open-dialog', this.userid)
-                }
-            },
-
-            openDialog() {
-                this.$store.dispatch("openDialogUserid", this.userid).then(_ => {
-                    this.goForward({name: 'manage-messenger'})
-                }).catch(({msg}) => {
-                    $A.modalError(msg)
-                });
-            },
-
-            onError() {
-                return true
-            },
-        }
-    };
-</script>
diff --git a/resources/assets/js/components/UserAvatar/index.vue b/resources/assets/js/components/UserAvatar/index.vue
new file mode 100755
index 000000000..2c2f357e8
--- /dev/null
+++ b/resources/assets/js/components/UserAvatar/index.vue
@@ -0,0 +1,184 @@
+<template>
+    <div
+        v-if="user"
+        class="avatar-wrapper common-avatar"
+        :class="{'avatar-pointer': clickOpenDialog}"
+        @click="onClickOpen">
+        <div v-if="showIcon" :class="boxClass" :style="boxStyle">
+            <em :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>
+            <EAvatar v-else :size="avatarSize" class="avatar-text">
+                <span class="avatar-char" :style="spotStyle">{{nickname}}</span>
+            </EAvatar>
+        </div>
+        <div v-if="showName" class="avatar-name" :style="nameStyle">
+            <div v-if="user.bot" class="taskfont bot">&#xe68c;</div>
+            <span>{{nameText || user.nickname}}</span>
+        </div>
+    </div>
+</template>
+
+<script>
+import {Store} from "le5le-store";
+import mixin from './mixin';
+
+export default {
+    name: 'UserAvatar',
+    mixins: [ mixin ],
+    data() {
+        return {
+            user: null,
+            subscribe: null
+        }
+    },
+    mounted() {
+        this.getData();
+        //
+        this.subscribe = Store.subscribe('cacheUserActive', (data) => {
+            if (data.userid == this.userid) {
+                this.setUser(data)
+            }
+        });
+        this.$store.state.userAvatar[this._uid] = this.$props;
+    },
+    beforeDestroy() {
+        if (this.subscribe) {
+            this.subscribe.unsubscribe();
+            this.subscribe = null;
+        }
+        if (this.$store.state.userAvatar[this._uid] !== undefined) {
+            delete this.$store.state.userAvatar[this._uid];
+        }
+    },
+    computed: {
+        boxClass() {
+            return {
+                'avatar-box': true,
+                'online': this.$store.state.userId === this.userid || this.user.online || this.isBot,
+                'disabled': this.user.disable_at,
+                'deleted': this.user.delete_at
+            }
+        },
+
+        boxStyle() {
+            const style = {};
+            const {borderWitdh, borderColor} = this
+            if (borderWitdh > 0) {
+                style.border = borderWitdh + "px solid " + (borderColor || "#ffffff");
+            }
+            return style;
+        },
+
+        spotStyle() {
+            let {borderWitdh, size} = this
+            if (size === 'default') size = 32;
+            if (borderWitdh > 0) size-= borderWitdh;
+            if (size == 32) {
+                return {}
+            }
+            return {
+                'transform': 'scale(' + Math.min(1.25, size / 32) + ')',
+            }
+        },
+
+        nameStyle() {
+            const {showIcon} = this;
+            const {delete_at, disable_at} = this.user
+            const styles = {}
+            if (!showIcon) {
+                styles.marginLeft = 0
+            }
+            if (delete_at || disable_at) {
+                styles.opacity = 0.8
+                styles.textDecoration = "line-through"
+            }
+            return styles
+        },
+
+        avatarSize() {
+            let {borderWitdh, size} = this
+            if (size === 'default') size = 32;
+            if (borderWitdh > 0) {
+                return size - borderWitdh * 2;
+            } else {
+                return size;
+            }
+        },
+
+        showImg() {
+            const {userimg} = this.user
+            if (!userimg) {
+                return false;
+            }
+            return !$A.rightExists(userimg, '/avatar.png');
+        },
+
+        isDefault() {
+            const {userimg} = this.user
+            return $A.strExists(userimg, '/avatar');
+        },
+
+        isBot() {
+            return !!(this.user && this.user.bot);
+        },
+
+        nickname() {
+            const {nickname} = this.user;
+            if (!nickname) {
+                return "D";
+            }
+            let value = nickname.substring(0, 2);
+            if (/^[\u4e00-\u9fa5]+$/.test(value)) {
+                value = value.substring(0, 1);
+            }
+            return value || 'D';
+        }
+    },
+    methods: {
+        getData() {
+            if (!this.$store.state.userId) {
+                return;
+            }
+            if (this.userid == this.$store.state.userId) {
+                this.setUser(this.$store.state.userInfo);
+                return;
+            }
+            const tempUser = this.$store.state.cacheUserBasic.find(({userid}) => userid == this.userid);
+            if (tempUser) {
+                this.setUser(tempUser);
+            }
+            this.$store.dispatch("getUserBasic", {userid: this.userid});
+        },
+
+        setUser(info) {
+            this.user = info;
+
+            if (typeof this.userResult === "function") {
+                this.userResult(info);
+            }
+        },
+
+        onClickOpen() {
+            if (this.clickOpenDialog) {
+                this.openDialog()
+            } else {
+                this.$emit('open-dialog', this.userid)
+            }
+        },
+
+        openDialog() {
+            this.$store.dispatch("openDialogUserid", this.userid).then(_ => {
+                this.goForward({name: 'manage-messenger'})
+            }).catch(({msg}) => {
+                $A.modalError(msg)
+            });
+        },
+
+        onError() {
+            return true
+        },
+    }
+}
+</script>
diff --git a/resources/assets/js/components/UserAvatar/mixin.js b/resources/assets/js/components/UserAvatar/mixin.js
new file mode 100644
index 000000000..3e1a563bb
--- /dev/null
+++ b/resources/assets/js/components/UserAvatar/mixin.js
@@ -0,0 +1,39 @@
+export default {
+    props: {
+        userid: {
+            type: [String, Number],
+            default: ''
+        },
+        size: {
+            type: [String, Number],
+            default: 'default'
+        },
+        showIcon: {
+            type: Boolean,
+            default: true
+        },
+        showName: {
+            type: Boolean,
+            default: false
+        },
+        nameText: {
+            type: String,
+            default: null   // showName = true 时有效，留空就显示会员昵称
+        },
+        borderWitdh: {
+            type: Number,
+            default: 0
+        },
+        borderColor: {
+            type: String,
+            default: ''
+        },
+        clickOpenDialog: {
+            type: Boolean,
+            default: false
+        },
+        userResult: {
+            default: null
+        }
+    }
+}
diff --git a/resources/assets/js/components/UserAvatar/tip.vue b/resources/assets/js/components/UserAvatar/tip.vue
new file mode 100755
index 000000000..e6249cfda
--- /dev/null
+++ b/resources/assets/js/components/UserAvatar/tip.vue
@@ -0,0 +1,94 @@
+<template>
+    <ETooltip
+        :open-delay="openDelay"
+        :disabled="$isEEUiApp || windowTouch || tooltipDisabled || isBot"
+        :placement="tooltipPlacement">
+        <div v-if="user" slot="content" class="common-avatar-transfer">
+            <slot/>
+            <p>{{$L('昵称')}}: {{user.nickname}}<em v-if="user.delete_at" class="deleted no-dark-content">{{$L('已删除')}}</em><em v-else-if="user.disable_at" class="disabled no-dark-content">{{$L('已离职')}}</em></p>
+            <p class="department-name" :title="user.department_name || ''">{{$L('部门')}}: {{user.department_name || '-'}}</p>
+            <p>{{$L('职位/职称')}}: {{user.profession || '-'}}</p>
+            <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
+                ref="avatar"
+                :userid="userid"
+                :size="size"
+                :showIcon="showIcon"
+                :showName="showName"
+                :nameText="nameText"
+                :borderWitdh="borderWitdh"
+                :borderColor="borderColor"
+                :clickOpenDialog="clickOpenDialog"
+                :userResult="onUserResult"/>
+        </div>
+    </ETooltip>
+</template>
+
+<script>
+import mixin from './mixin';
+
+export default {
+    name: 'UserAvatarTip',
+    mixins: [mixin],
+    props: {
+        tooltipDisabled: {
+            type: Boolean,
+            default: false
+        },
+        showIconMenu: {
+            type: Boolean,
+            default: false
+        },
+        tooltipPlacement: {
+            type: String,
+            default: 'bottom'
+        },
+        openDelay: {
+            type: Number,
+            default: 600
+        },
+    },
+
+    data() {
+        return {
+            user: null,
+        }
+    },
+
+    computed: {
+        showMenu() {
+            if (this.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);
+            }
+            this.user = info;
+        }
+    }
+}
+</script>
diff --git a/resources/assets/js/components/UserSelect.vue b/resources/assets/js/components/UserSelect.vue
index fe2d02b5a..22e35e948 100755
--- a/resources/assets/js/components/UserSelect.vue
+++ b/resources/assets/js/components/UserSelect.vue
@@ -2,7 +2,7 @@
     <div class="common-user-select" :class="warpClass">
         <ul v-if="!module">
             <li v-for="userid in values" v-if="userid" @click="onSelection">
-                <UserAvatar :userid="userid" :size="avatarSize" :show-icon="avatarIcon" :show-name="avatarName" tooltip-disabled/>
+                <UserAvatar :userid="userid" :size="avatarSize" :show-icon="avatarIcon" :show-name="avatarName"/>
             </li>
             <li v-if="addIcon || values.length === 0" class="add-icon" :style="addStyle" @click="onSelection"></li>
         </ul>
@@ -48,7 +48,7 @@
                                 <i v-else-if="item.group_type=='okr'" class="taskfont icon-avatar task">&#xe6f4;</i>
                                 <Icon v-else class="icon-avatar" type="ios-people" />
                             </template>
-                            <UserAvatar v-else :userid="item.userid" tooltip-disabled/>
+                            <UserAvatar v-else :userid="item.userid"/>
                         </li>
                     </ul>
                 </Scrollbar>
@@ -119,7 +119,7 @@
                                 <span>{{item.name}}</span>
                             </div>
                         </div>
-                        <UserAvatar v-else class="user-modal-avatar" :userid="item.userid" :size="40" show-name tooltip-disabled/>
+                        <UserAvatar v-else class="user-modal-avatar" :userid="item.userid" :size="40" show-name/>
                     </li>
                 </ul>
             </Scrollbar>
diff --git a/resources/assets/js/pages/manage.vue b/resources/assets/js/pages/manage.vue
index 70d5ad12c..f3d81a850 100644
--- a/resources/assets/js/pages/manage.vue
+++ b/resources/assets/js/pages/manage.vue
@@ -8,7 +8,7 @@
                 @on-visible-change="menuVisibleChange">
                 <div :class="['manage-box-title', visibleMenu ? 'menu-visible' : '']">
                     <div class="manage-box-avatar">
-                        <UserAvatar :userid="userId" :size="36" tooltipDisabled/>
+                        <UserAvatar :userid="userId" :size="36"/>
                     </div>
                     <span>{{userInfo.nickname}}</span>
                     <Badge v-if="!!clientNewVersion" class="manage-box-top-report" dot/>
@@ -786,8 +786,8 @@ export default {
                     return;
                 case 'okrManage':
                 case 'okrAnalyze':
-                    this.goForward({ 
-                        path:'/manage/apps/' + ( path == 'okrManage' ? '/#/list' : '/#/analysis'), 
+                    this.goForward({
+                        path:'/manage/apps/' + ( path == 'okrManage' ? '/#/list' : '/#/analysis'),
                     });
                     return;
                 case 'logout':
diff --git a/resources/assets/js/pages/manage/components/ChatInput/index.vue b/resources/assets/js/pages/manage/components/ChatInput/index.vue
index fcd416ea6..22ac1796f 100755
--- a/resources/assets/js/pages/manage/components/ChatInput/index.vue
+++ b/resources/assets/js/pages/manage/components/ChatInput/index.vue
@@ -27,7 +27,7 @@
             <!-- 回复、修改 -->
             <div v-if="quoteData" class="chat-quote">
                 <div v-if="quoteUpdate" class="quote-label">{{$L('编辑消息')}}</div>
-                <UserAvatar v-else :userid="quoteData.userid" :show-icon="false" :show-name="true" :tooltip-disabled="true"/>
+                <UserAvatar v-else :userid="quoteData.userid" :show-icon="false" :show-name="true"/>
                 <div class="quote-desc">{{$A.getMsgSimpleDesc(quoteData)}}</div>
                 <i class="taskfont" @click.stop="cancelQuote">&#xe6e5;</i>
             </div>
diff --git a/resources/assets/js/pages/manage/components/DialogGroupInfo.vue b/resources/assets/js/pages/manage/components/DialogGroupInfo.vue
index bb3fd87c6..b7a9dede8 100644
--- a/resources/assets/js/pages/manage/components/DialogGroupInfo.vue
+++ b/resources/assets/js/pages/manage/components/DialogGroupInfo.vue
@@ -19,7 +19,7 @@
         <div class="group-info-user">
             <ul>
                 <li v-for="(item, index) in userList" :key="index" @click="openUser(item.userid)">
-                    <UserAvatar :userid="item.userid" :size="32" showName tooltipDisabled/>
+                    <UserAvatar :userid="item.userid" :size="32" showName/>
                     <div v-if="item.userid === dialogData.owner_id" class="user-tag">{{ $L("群主") }}</div>
                     <div v-else-if="operableExit(item)" class="user-exit" @click.stop="onExit(item)"><Icon type="md-exit"/></div>
                 </li>
diff --git a/resources/assets/js/pages/manage/components/DialogItem.vue b/resources/assets/js/pages/manage/components/DialogItem.vue
index 81378d185..d619879e3 100644
--- a/resources/assets/js/pages/manage/components/DialogItem.vue
+++ b/resources/assets/js/pages/manage/components/DialogItem.vue
@@ -1,18 +1,18 @@
 <template>
     <div :class="classArray">
         <div v-if="source.type === 'tag'" class="dialog-tag" @click="onViewTag">
-            <div class="tag-user"><UserAvatar :userid="source.userid" :tooltipDisabled="source.userid == userId" :show-name="true" :show-icon="false"/></div>
+            <div class="tag-user"><UserAvatar :userid="source.userid" :show-name="true" :show-icon="false"/></div>
             {{$L(source.msg.action === 'remove' ? '取消标注' : '标注了')}}
             "{{$A.getMsgSimpleDesc(source.msg.data)}}"
         </div>
         <div v-else-if="source.type === 'todo'" class="dialog-todo" @click="onViewTodo">
-            <div class="todo-user"><UserAvatar :userid="source.userid" :tooltipDisabled="source.userid == userId" :show-name="true" :show-icon="false"/></div>
+            <div class="todo-user"><UserAvatar :userid="source.userid" :show-name="true" :show-icon="false"/></div>
             {{$L(source.msg.action === 'remove' ? '取消待办' : (source.msg.action === 'done' ? '完成' : '设待办'))}}
             "{{$A.getMsgSimpleDesc(source.msg.data)}}"
             <div v-if="formatTodoUser(source.msg.data).length > 0" class="todo-users">
                 <span>{{$L('给')}}</span>
                 <template v-for="(item, index) in formatTodoUser(source.msg.data)">
-                    <div v-if="index < 3" class="todo-user"><UserAvatar :userid="item" :tooltipDisabled="item == userId" :show-name="true" :show-icon="false"/></div>
+                    <div v-if="index < 3" class="todo-user"><UserAvatar :userid="item" :show-name="true" :show-icon="false"/></div>
                     <div v-else-if="index == 3" class="todo-user">+{{formatTodoUser(source.msg.data).length - 3}}</div>
                 </template>
             </div>
@@ -26,8 +26,7 @@
                     v-longpress="{callback: onMention, delay: 300}"
                     @open-dialog="onOpenDialog"
                     :userid="source.userid"
-                    :size="30"
-                    tooltip-disabled/>
+                    :size="30"/>
             </div>
             <DialogView
                 :msg-data="source"
diff --git a/resources/assets/js/pages/manage/components/DialogRespond.vue b/resources/assets/js/pages/manage/components/DialogRespond.vue
index 03d1e9ef2..ac4fbafa2 100644
--- a/resources/assets/js/pages/manage/components/DialogRespond.vue
+++ b/resources/assets/js/pages/manage/components/DialogRespond.vue
@@ -5,7 +5,7 @@
         <div class="respond-user">
             <ul>
                 <li v-for="(userid, index) in respondData.userids" :key="index" @click="openUser(userid)">
-                    <UserAvatar :userid="userid" :size="32" showName tooltipDisabled/>
+                    <UserAvatar :userid="userid" :size="32" showName/>
                 </li>
             </ul>
         </div>
diff --git a/resources/assets/js/pages/manage/components/DialogView.vue b/resources/assets/js/pages/manage/components/DialogView.vue
index e7c7cafb5..081112063 100644
--- a/resources/assets/js/pages/manage/components/DialogView.vue
+++ b/resources/assets/js/pages/manage/components/DialogView.vue
@@ -11,7 +11,7 @@
             v-longpress="{callback: handleLongpress, delay: 300}">
             <!--回复-->
             <div v-if="!hideReply && msgData.reply_data" class="dialog-reply no-dark-content" @click="viewReply">
-                <UserAvatar :userid="msgData.reply_data.userid" :show-icon="false" :show-name="true" :tooltip-disabled="true"/>
+                <UserAvatar :userid="msgData.reply_data.userid" :show-icon="false" :show-name="true"/>
                 <div class="reply-desc" v-html="$A.getMsgSimpleDesc(msgData.reply_data, 'image-preview')"></div>
             </div>
             <!--详情-->
@@ -50,7 +50,7 @@
                         </li>
                         <li>
                             <em>{{$L('会议创建人')}}</em>
-                            <UserAvatar :userid="msgData.msg.userid" :show-icon="false" :show-name="true" tooltip-disabled/>
+                            <UserAvatar :userid="msgData.msg.userid" :show-icon="false" :show-name="true"/>
                         </li>
                         <li>
                             <em>{{$L('频道ID')}}</em>
@@ -80,7 +80,7 @@
                     <div class="emoji-users" @click="onShowEmojiUser(item)">
                         <ul>
                             <template v-for="(uitem, uindex) in item.userids">
-                                <li v-if="uindex < emojiUsersNum" :class="{bold:uitem==userId}"><UserAvatar :userid="uitem" tooltip-disabled show-name :show-icon="false"/></li>
+                                <li v-if="uindex < emojiUsersNum" :class="{bold:uitem==userId}"><UserAvatar :userid="uitem" show-name :show-icon="false"/></li>
                                 <li v-else-if="uindex == emojiUsersNum">+{{item.userids.length - emojiUsersNum}}位</li>
                             </template>
                         </ul>
@@ -111,7 +111,7 @@
                             <div class="read-title"><em>{{ todoDoneList.length }}</em>{{ $L('完成') }}</div>
                             <ul>
                                 <li v-for="item in todoDoneList">
-                                    <UserAvatar :userid="item.userid" :size="26" showName tooltipDisabled/>
+                                    <UserAvatar :userid="item.userid" :size="26" showName/>
                                 </li>
                             </ul>
                         </Scrollbar>
@@ -119,7 +119,7 @@
                             <div class="read-title"><em>{{ todoUndoneList.length }}</em>{{ $L('待办') }}</div>
                             <ul>
                                 <li v-for="item in todoUndoneList">
-                                    <UserAvatar :userid="item.userid" :size="26" showName tooltipDisabled/>
+                                    <UserAvatar :userid="item.userid" :size="26" showName/>
                                 </li>
                             </ul>
                         </Scrollbar>
@@ -155,7 +155,7 @@
                                     <div class="read-title"><em>{{ readList.length }}</em>{{ $L('已读') }}</div>
                                     <ul>
                                         <li v-for="item in readList">
-                                            <UserAvatar :userid="item.userid" :size="26" showName tooltipDisabled/>
+                                            <UserAvatar :userid="item.userid" :size="26" showName/>
                                         </li>
                                     </ul>
                                 </Scrollbar>
@@ -163,7 +163,7 @@
                                     <div class="read-title"><em>{{ unreadList.length }}</em>{{ $L('未读') }}</div>
                                     <ul>
                                         <li v-for="item in unreadList">
-                                            <UserAvatar :userid="item.userid" :size="26" showName tooltipDisabled/>
+                                            <UserAvatar :userid="item.userid" :size="26" showName/>
                                         </li>
                                     </ul>
                                 </Scrollbar>
diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index 73c60451b..db5ac43fe 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -28,11 +28,11 @@
                                 <Icon v-else class="icon-avatar" type="ios-people" />
                             </template>
                             <div v-else-if="dialogData.dialog_user" class="user-avatar">
-                                <UserAvatar :online.sync="dialogData.online_state" :userid="dialogData.dialog_user.userid" :size="42">
+                                <UserAvatarTip :online.sync="dialogData.online_state" :userid="dialogData.dialog_user.userid" :size="42">
                                     <p v-if="dialogData.type === 'user' && dialogData.online_state !== true" slot="end">
                                         {{$L(dialogData.online_state)}}
                                     </p>
-                                </UserAvatar>
+                                </UserAvatarTip>
                             </div>
                             <Icon v-else class="icon-avatar" type="md-person" />
                         </div>
@@ -530,10 +530,12 @@ import {choiceEmojiOne} from "./ChatInput/one";
 
 import ApproveDetails from "../../../pages/manage/approve/details.vue";
 import UserSelect from "../../../components/UserSelect.vue";
+import UserAvatarTip from "../../../components/UserAvatar/tip.vue";
 
 export default {
     name: "DialogWrapper",
     components: {
+        UserAvatarTip,
         UserSelect,
         ImgUpload,
         DialogRespond,
diff --git a/resources/assets/js/pages/manage/components/ProjectPanel.vue b/resources/assets/js/pages/manage/components/ProjectPanel.vue
index 455681523..a575b5ac5 100644
--- a/resources/assets/js/pages/manage/components/ProjectPanel.vue
+++ b/resources/assets/js/pages/manage/components/ProjectPanel.vue
@@ -13,9 +13,9 @@
                 <li class="project-avatar" :class="{'cursor-default': projectData.owner_userid !== userId}" @click="projectDropdown('user')">
                     <ul>
                         <li>
-                            <UserAvatar :userid="projectData.owner_userid" :size="36" :borderWitdh="2" :openDelay="0">
+                            <UserAvatarTip :userid="projectData.owner_userid" :size="36" :borderWitdh="2" :openDelay="0">
                                 <p>{{$L('项目负责人')}}</p>
-                            </UserAvatar>
+                            </UserAvatarTip>
                             <Badge v-if="(windowWidth <= 980 || projectData.cacheParameter.chat) && projectUser.length > 0" type="normal" :overflow-count="999" :count="projectData.project_user.length"/>
                         </li>
                         <template v-if="!(windowWidth <= 980 || projectData.cacheParameter.chat) && projectUser.length > 0" v-for="item in projectUser">
@@ -25,7 +25,7 @@
                                 </ETooltip>
                             </li>
                             <li v-else>
-                                <UserAvatar :userid="item.userid" :size="36" :borderWitdh="2" :openDelay="0"/>
+                                <UserAvatarTip :userid="item.userid" :size="36" :borderWitdh="2" :openDelay="0"/>
                             </li>
                         </template>
                     </ul>
@@ -369,7 +369,7 @@
                         <ul class="project-panel-wait-remove">
                             <li>{{$L('即将移除')}}：</li>
                             <li v-for="id in userWaitRemove" :key="id">
-                                <UserAvatar :userid="id" :size="20" showName tooltipDisabled/>
+                                <UserAvatar :userid="id" :size="20" showName/>
                             </li>
                         </ul>
                     </div>
@@ -477,10 +477,12 @@ import TaskDeleted from "./TaskDeleted";
 import ProjectGantt from "./ProjectGantt";
 import MarkdownPreviewNostyle from "../../../components/MDEditor/components/preview/nostyle.vue";
 import UserSelect from "../../../components/UserSelect.vue";
+import UserAvatarTip from "../../../components/UserAvatar/tip.vue";
 
 export default {
     name: "ProjectPanel",
     components: {
+        UserAvatarTip,
         UserSelect,
         MarkdownPreviewNostyle,
         TaskMenu,
diff --git a/resources/assets/js/pages/manage/components/ProjectWorkflow.vue b/resources/assets/js/pages/manage/components/ProjectWorkflow.vue
index 7caf0ae3a..808c1d283 100644
--- a/resources/assets/js/pages/manage/components/ProjectWorkflow.vue
+++ b/resources/assets/js/pages/manage/components/ProjectWorkflow.vue
@@ -90,7 +90,7 @@
                                                     <EDropdownMenu slot="dropdown" class="taskflow-config-more-dropdown-menu">
                                                         <EDropdownItem v-if="item.userids.length > 0" command="user">
                                                             <div class="users">
-                                                                <UserAvatar v-for="(uid, ukey) in item.userids" :key="ukey" :userid="uid" :size="28" :borderWitdh="1" :showName="item.userids.length === 1" tooltipDisabled/>
+                                                                <UserAvatar v-for="(uid, ukey) in item.userids" :key="ukey" :userid="uid" :size="28" :borderWitdh="1" :showName="item.userids.length === 1"/>
                                                             </div>
                                                         </EDropdownItem>
                                                         <EDropdownItem command="user">
diff --git a/resources/assets/js/pages/manage/components/TaskExistTips.vue b/resources/assets/js/pages/manage/components/TaskExistTips.vue
index 38f2564db..7a24319d5 100644
--- a/resources/assets/js/pages/manage/components/TaskExistTips.vue
+++ b/resources/assets/js/pages/manage/components/TaskExistTips.vue
@@ -10,7 +10,7 @@
         <List :split="false" size="small">
             <ListItem v-for="(items, userid) in tipsTask" :key="userid">
                 <div class="list-content">
-                    <UserAvatar :userid="userid" :size="28" :show-icon="true" :show-name="true" tooltipDisabled />
+                    <UserAvatar :userid="userid" :size="28" :show-icon="true" :show-name="true"/>
                     <div class="list-task" v-for="(item, key) in items" :key="key">
                         <div class="list-task-info">
                             <span>[{{ item.project_name }}] </span>
diff --git a/resources/assets/js/pages/manage/components/TeamManagement.vue b/resources/assets/js/pages/manage/components/TeamManagement.vue
index a97e7c9f0..011f2e673 100644
--- a/resources/assets/js/pages/manage/components/TeamManagement.vue
+++ b/resources/assets/js/pages/manage/components/TeamManagement.vue
@@ -33,9 +33,9 @@
                         :key="item.id"
                         :class="[`level-${item.level}`, departmentSelect === item.id ? 'active' : '']"
                         @click="onSelectDepartment(item.id)">
-                        <UserAvatar :userid="item.owner_userid" :size="20" class="department-icon">
+                        <UserAvatarTip :userid="item.owner_userid" :size="20" class="department-icon">
                             <p><strong>{{$L('部门负责人')}}</strong></p>
-                        </UserAvatar>
+                        </UserAvatarTip>
                         <div class="department-title">{{item.name}}</div>
                         <EDropdown
                             size="medium"
@@ -299,10 +299,11 @@
 
 <script>
 import UserSelect from "../../../components/UserSelect.vue";
+import UserAvatarTip from "../../../components/UserAvatar/tip.vue";
 
 export default {
     name: "TeamManagement",
-    components: {UserSelect},
+    components: {UserAvatarTip, UserSelect},
     props: {
         checkinMac: {
             type: Boolean,
diff --git a/resources/assets/js/pages/manage/file.vue b/resources/assets/js/pages/manage/file.vue
index e7a3c43b9..1f36b0480 100644
--- a/resources/assets/js/pages/manage/file.vue
+++ b/resources/assets/js/pages/manage/file.vue
@@ -125,18 +125,18 @@
                                     </div>
                                     <div :class="`no-dark-before file-icon ${item.type}${item.share ? ' share' : ''}`">
                                         <template v-if="item.share">
-                                            <UserAvatar v-if="item.userid != userId" :userid="item.userid" class="share-avatar" :size="20">
+                                            <UserAvatarTip v-if="item.userid != userId" :userid="item.userid" class="share-avatar" :size="20">
                                                 <p>{{$L('共享权限')}}: {{$L(item.permission == 1 ? '读/写' : '只读')}}</p>
-                                            </UserAvatar>
+                                            </UserAvatarTip>
                                             <div v-else class="share-icon no-dark-content">
                                                 <i class="taskfont">&#xe757;</i>
                                             </div>
                                         </template>
                                         <template v-else-if="isParentShare">
-                                            <UserAvatar :userid="item.created_id" class="share-avatar" :size="20">
+                                            <UserAvatarTip :userid="item.created_id" class="share-avatar" :size="20">
                                                 <p v-if="item.created_id != item.userid"><strong>{{$L('成员创建于')}}: {{item.created_at}}</strong></p>
                                                 <p v-else>{{$L('所有者创建于')}}: {{item.created_at}}</p>
-                                            </UserAvatar>
+                                            </UserAvatarTip>
                                         </template>
                                     </div>
                                     <div v-if="item._edit" class="file-input">
@@ -345,7 +345,7 @@
                             <EAvatar class="avatar-text" icon="el-icon-s-custom"/>
                             <span class="avatar-name">{{$L('所有人')}}</span>
                         </div>
-                        <UserAvatar v-else :size="32" :userid="item.userid" showName tooltipDisabled/>
+                        <UserAvatar v-else :size="32" :userid="item.userid" showName/>
                         <Select v-model="item.permission" :placeholder="$L('权限')" @on-change="upShare(item)">
                             <Option :value="1">{{ $L('读/写') }}</Option>
                             <Option :value="0">{{ $L('只读') }}</Option>
@@ -439,13 +439,14 @@ import DrawerOverlay from "../../components/DrawerOverlay";
 import PreviewImage from "../../components/PreviewImage";
 import longpress from "../../directives/longpress";
 import UserSelect from "../../components/UserSelect.vue";
+import UserAvatarTip from "../../components/UserAvatar/tip.vue";
 
 const FilePreview = () => import('./components/FilePreview');
 const FileContent = () => import('./components/FileContent');
 const FileObject = {sort: null, mode: null, shared: null};
 
 export default {
-    components: {UserSelect, PreviewImage, FilePreview, DrawerOverlay, FileContent},
+    components: {UserAvatarTip, UserSelect, PreviewImage, FilePreview, DrawerOverlay, FileContent},
     directives: {longpress},
     data() {
         return {
diff --git a/resources/assets/js/pages/manage/messenger.vue b/resources/assets/js/pages/manage/messenger.vue
index 6065c4eef..c11c5fb32 100644
--- a/resources/assets/js/pages/manage/messenger.vue
+++ b/resources/assets/js/pages/manage/messenger.vue
@@ -101,7 +101,7 @@
                                     <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/>
+                                            <UserAvatar v-else :userid="dialog.last_msg.userid" :show-name="true" :show-icon="false"/>
                                         </template>
                                         <div class="last-text">
                                             <em v-if="formatMsgEmojiDesc(dialog.last_msg)">{{formatMsgEmojiDesc(dialog.last_msg)}}</em>