loulijun2021
2022-06-15 edbe2964e959a334e1d9e12717bf854d89d25c92
src/layout/components/Navbar.vue
@@ -7,8 +7,13 @@
    <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="/">-->
@@ -22,6 +27,9 @@
          <!--          <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>
@@ -36,6 +44,7 @@
import { mapGetters } from 'vuex'
import Breadcrumb from '@/components/Breadcrumb'
import Hamburger from '@/components/Hamburger'
import { getCookie } from '@/utils/auth'
export default {
  components: {
@@ -47,6 +56,14 @@
      'sidebar',
      'avatar'
    ])
  },
  created() {
    this.username = getCookie('admin')
  },
  data() {
    return {
      username: ''
    }
  },
  methods: {
    toggleSideBar() {
@@ -118,10 +135,18 @@
      .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;
        }