84 lines
1.6 KiB
Vue
84 lines
1.6 KiB
Vue
<template>
|
|
<u-avatar @longpress="longpress" @click="click" @onError="errorHandle" :src="getAvatarUrl" :text="avatarText"
|
|
bgColor="#0089FF" :defaultUrl="getDdefaultUrl" :shape="shape" :size="size" mode="aspectFill" font-size="14">
|
|
</u-avatar>
|
|
</template>
|
|
|
|
<script>
|
|
import defaultGroupIcon from "static/images/contact_my_group.png";
|
|
import defaultNotifyIcon from "static/images/default_notify_icon.png";
|
|
import util from "@/util";
|
|
export default {
|
|
name: "MyAvatar",
|
|
props: {
|
|
src: String,
|
|
shape: {
|
|
type: String,
|
|
default: "square",
|
|
},
|
|
size: {
|
|
type: String,
|
|
default: "40",
|
|
},
|
|
isGroup: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
isNotify: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
|
|
desc: String,
|
|
},
|
|
data() {
|
|
return {
|
|
avatarText: undefined,
|
|
};
|
|
},
|
|
computed: {
|
|
getAvatarUrl() {
|
|
if (this.src) {
|
|
return util.cdn(this.src);
|
|
}
|
|
if (this.isGroup) {
|
|
return defaultGroupIcon;
|
|
}
|
|
if (this.isNotify) {
|
|
return defaultNotifyIcon;
|
|
}
|
|
this.avatarText = this.desc ? this.desc.slice(0, 1) : "未知";
|
|
return "";
|
|
},
|
|
getDdefaultUrl() {
|
|
return this.isGroup ? defaultGroupIcon : undefined;
|
|
},
|
|
},
|
|
methods: {
|
|
errorHandle() {
|
|
this.avatarText = this.desc ? this.desc.slice(0, 1) : "未知";
|
|
},
|
|
redirectShow() {
|
|
if (this.avatarText) {
|
|
this.avatarText = undefined;
|
|
}
|
|
},
|
|
click() {
|
|
this.$emit("click");
|
|
},
|
|
longpress() {
|
|
this.$emit("longpress");
|
|
},
|
|
},
|
|
watch: {
|
|
src() {
|
|
this.redirectShow();
|
|
},
|
|
desc() {
|
|
this.redirectShow();
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style></style> |