| | |
| | | <div class="right-menu"> |
| | | <el-dropdown class="avatar-container" trigger="click"> |
| | | <div class="avatar-wrapper"> |
| | | <img :src="avatar+'?imageView2/1/w/80/h/80'" class="user-avatar"> |
| | | <i class="el-icon-caret-bottom" /> |
| | | <!-- <img :src="avatar+'?imageView2/1/w/80/h/80'" class="user-avatar">--> |
| | | <div style="display: flex;align-items: center;margin-top: -5px"> |
| | | <div class="headerImg"><i class="el-icon-user" /></div> |
| | | <div class="headerName">{{ username }}</div> |
| | | </div> |
| | | |
| | | <!-- <i class="el-icon-caret-bottom" />--> |
| | | </div> |
| | | <el-dropdown-menu slot="dropdown" class="user-dropdown"> |
| | | <!-- <router-link to="/">--> |
| | |
| | | <!-- <a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/#/">--> |
| | | <!-- <el-dropdown-item>Docs</el-dropdown-item>--> |
| | | <!-- </a>--> |
| | | <!-- <el-dropdown-item @click.native="logout">--> |
| | | <!-- <span style="display:block;">修改密码</span>--> |
| | | <!-- </el-dropdown-item>--> |
| | | <!-- divided--> |
| | | <el-dropdown-item @click.native="logout"> |
| | | <span style="display:block;">退出</span> |
| | |
| | | import { mapGetters } from 'vuex' |
| | | import Breadcrumb from '@/components/Breadcrumb' |
| | | import Hamburger from '@/components/Hamburger' |
| | | import { getCookie } from '@/utils/auth' |
| | | |
| | | export default { |
| | | components: { |
| | |
| | | 'sidebar', |
| | | 'avatar' |
| | | ]) |
| | | }, |
| | | created() { |
| | | this.username = getCookie('admin') |
| | | }, |
| | | data() { |
| | | return { |
| | | username: '' |
| | | } |
| | | }, |
| | | methods: { |
| | | toggleSideBar() { |
| | |
| | | .avatar-wrapper { |
| | | margin-top: 5px; |
| | | position: relative; |
| | | cursor: pointer; |
| | | .headerImg{ |
| | | margin: 5px; |
| | | } |
| | | |
| | | .headerName{ |
| | | font-weight: bolder; |
| | | } |
| | | |
| | | .user-avatar { |
| | | cursor: pointer; |
| | | width: 40px; |
| | | width: 60px; |
| | | height: 40px; |
| | | border-radius: 10px; |
| | | } |