<!--
 * @Descripttion: 当前组件信息
 * @version: 1.0.0
 * @Author: 无尘
 * @Date: 2020-08-03 10:08:57
 * @LastEditors: 无尘
 * @LastEditTime: 2020-10-20 14:01:11
-->
<template>
  <div class="header">
    <a :href="`${origin}/operation-platform/#/index`" class="logo">
      <img src="../images/logo.png" alt="" />
      <span>好办运维平台</span>
    </a>
    <yw-user-info :user-data="userInfo"></yw-user-info>
  </div>
</template>

<script>
import { origin } from '@/config';
import fetch from '@/api';
const { getUserInfo } = fetch;
export default {
  name: 'YwHeader',
  data() {
    return {
      origin,
      userInfo: {}
    };
  },
  created() {
    this.getUserInfo();
  },
  methods: {
    // 获取用户信息
    getUserInfo() {
      getUserInfo().then(res => {
        const result = res.result || {};
        localStorage.setItem('haobanOperate', JSON.stringify(result));
        this.userInfo = Object.assign({}, result);
        this.$emit('updateAsideMenu', result.menuTree || []);
      });
    }
  }
};
</script>

<style lang="less" scoped>
.header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 45px;
  width: 100%;
  min-width: 1400px;
  height: 64px;
  background: #fff;
  box-shadow: 0px 3px 4px 0px rgba(214, 224, 240, 0.3);
  .logo {
    display: flex;
    align-items: center;
    cursor: pointer;
    img {
      margin-right: 10px;
      width: 30px;
      height: 30px;
    }
    span {
      padding-top: 2px;
      font-size: 16px;
      color: #303133;
    }
  }
}
</style>
