用户头像旁加上用户名
This commit is contained in:
parent
cc37dc9e4d
commit
5679699985
@ -21,7 +21,7 @@
|
||||
<div v-if="item.music.name !== null">
|
||||
<el-image v-if="grid" :style="{'width':details?'110px':'80px','height':details?'110px':'80px'}" fit="contain" :src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
|
||||
<div slot="error" class="image-slot">
|
||||
<svg-icon icon-class="audio"/>
|
||||
<svg-icon class="avatar-default-image" icon-class="audio"/>
|
||||
</div>
|
||||
</el-image>
|
||||
<el-avatar v-if="!grid" shape="square" :src="item.fileId ? (audioCoverUrl+item.fileId) : (audioCoverUrl+item.id)">
|
||||
@ -31,7 +31,7 @@
|
||||
</el-avatar>
|
||||
</div>
|
||||
</div>
|
||||
<svg-icon v-else class="avatar-default-image" icon-class="audio"/>
|
||||
<svg-icon v-else icon-class="audio"/>
|
||||
</div>
|
||||
<!--<svg-icon v-else-if="item.contentType.indexOf('text') > -1" icon-class="file-txt"/>-->
|
||||
<div v-else-if="item.contentType.indexOf('image') > -1" v-on:mousedown="noDrag($event)">
|
||||
@ -92,6 +92,9 @@
|
||||
computed: {
|
||||
findIconClass(){
|
||||
let suffix = this.item.suffix;
|
||||
if(!suffix && this.item.fileName){
|
||||
suffix = this.item.fileName.substring(this.item.fileName.lastIndexOf('.') + 1);
|
||||
}
|
||||
if(iconClass.has(suffix)){
|
||||
return iconClass.get(suffix)
|
||||
}
|
||||
|
||||
@ -4,33 +4,38 @@
|
||||
|
||||
<breadcrumb class="breadcrumb-container" />
|
||||
|
||||
<div class="right-menu">
|
||||
<el-dropdown class="avatar-container" trigger="click">
|
||||
<div class="avatar-wrapper">
|
||||
<!--<img :src="avatar" class="user-avatar">-->
|
||||
<el-avatar :src="imageUrl+avatar" icon="el-icon-user-solid"></el-avatar>
|
||||
<i class="el-icon-caret-bottom" />
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown" class="user-dropdown">
|
||||
<router-link to="/setting">
|
||||
<el-dropdown-item>
|
||||
<i class="el-icon-setting" />设置
|
||||
</el-dropdown-item>
|
||||
</router-link>
|
||||
<!--<router-link to="/">-->
|
||||
<div class="right-content">
|
||||
<div class="right-username">{{username}}</div>
|
||||
<div class="right-menu">
|
||||
<el-dropdown class="avatar-container" trigger="click">
|
||||
<div class="avatar-wrapper">
|
||||
<!--<img :src="avatar" class="user-avatar">-->
|
||||
<el-avatar :src="imageUrl+avatar" icon="el-icon-user-solid"></el-avatar>
|
||||
<i class="el-icon-caret-bottom" />
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown" class="user-dropdown">
|
||||
<router-link to="/setting">
|
||||
<el-dropdown-item>
|
||||
<i class="el-icon-setting" />设置
|
||||
</el-dropdown-item>
|
||||
</router-link>
|
||||
<!--<router-link to="/">-->
|
||||
<!--<el-dropdown-item>-->
|
||||
<!--首页-->
|
||||
<!--首页-->
|
||||
<!--</el-dropdown-item>-->
|
||||
<!--</router-link>-->
|
||||
<!--<a target="_blank" href="https://github.com/jamebal/jmal-cloud-view/">-->
|
||||
<!--</router-link>-->
|
||||
<!--<a target="_blank" href="https://github.com/jamebal/jmal-cloud-view/">-->
|
||||
<!--<el-dropdown-item>Github</el-dropdown-item>-->
|
||||
<!--</a>-->
|
||||
<el-dropdown-item divided @click.native="logout">
|
||||
<span style="display:block;">退出登录</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<!--</a>-->
|
||||
<el-dropdown-item divided @click.native="logout">
|
||||
<span style="display:block;">退出登录</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -43,6 +48,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
imageUrl: process.env.VUE_APP_BASE_API + '/view/thumbnail?jmal-token=' + this.$store.state.user.token + '&id=',
|
||||
username: this.$store.state.user.name,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
@ -92,6 +98,21 @@ export default {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.right-content {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
|
||||
.right-username {
|
||||
line-height: 50px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.right-menu {
|
||||
float: right;
|
||||
height: 100%;
|
||||
|
||||
@ -147,6 +147,8 @@ export const constantRoutes = [
|
||||
path: '',
|
||||
name: 'setting',
|
||||
component: () => import('@/views/setting/index'),
|
||||
meta: { title: '设置' },
|
||||
hidden: true
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user