perf: 优化头像

This commit is contained in:
kuaifan 2023-12-13 16:21:51 +08:00
parent 689d842d58
commit fe4cba61e2
19 changed files with 362 additions and 356 deletions

View File

@ -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'

View File

@ -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>

View File

@ -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>

View File

@ -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
}
}
}

View File

@ -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>

View File

@ -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>

View File

@ -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':

View File

@ -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>

View File

@ -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>

View File

@ -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"

View File

@ -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>

View File

@ -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>

View File

@ -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,

View File

@ -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,

View File

@ -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">

View File

@ -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>

View File

@ -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,

View File

@ -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 {

View File

@ -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>