Files
learning-system-mobile/components/author-img/author-img.vue
2022-12-05 14:57:12 +08:00

121 lines
2.1 KiB
Vue

<template>
<view class="item-author">
<view>
<u-avatar v-if="avatar && avatar!=''" shape="circle" :size="size" :src="fileBaseUrl + avatar" ></u-avatar>
<view v-else>
<view v-if="sex == null" class="peo" :style="{width:width,height:height}">
<image src="../../static/images/default.png" alt="">
</view>
<view v-else :style="{width:width,height:height}">
<view class="peo" v-if="sex == 1 "><image src="../../static/images/man.png" alt=""></view>
<view class="peo" v-else-if="sex==2 "><image src="../../static/images/woman.png" alt=""></view>
<view class="peo" v-else><image src="../../static/images/man.png" alt=""></view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props:{
avatar:{
type:String,
default:''
},
name:{
type:String,
default:''
},
showInfo:{
type:Boolean,
default:false
},
showCode:{
type:Boolean,
default:false
},
info:{
type:String,
default:''
},
sex:{
type:Number,
default:null
},
size:{
type:Number,
default:40
},
width:{
type:String,
default:'40px'
},
height:{
type:String,
default:'40px'
},
},
data(){
return {
fileBaseUrl:this.$config.fileUrl,
userAvatar:'',
// sex:null,
}
},
computed:{
avatarText(){
let text=this.name;
if(text){
let len=text.length;
if(text.length>2){
text=text.substring(len-2);
}
}
return text;
}
},
mounted() {
this.userAvatar=this.avatar;
},
watch:{
},
methods:{
}
}
</script>
<style lang="scss" scoped>
.peo{
width: 100%;
height: 100%;
image{
width: 100%;
height: 100%;
border-radius: 50%;
vertical-align: middle;
}
}
.uavatar{
border:1px solid #73adfe;
background-color: #d9e9ff;
color:#73adfe;
width: 40px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
.uavatar-scale{
transform:scale(0.8);
}
}
.item-author{
font-size: 14upx;
display: inline-block;
vertical-align: middle;
}
</style>