upkeep-pc/src/components/navcon.vue

/**
* 头部菜单
*/
<template>
  <el-menu class="el-menu-demo" mode="horizontal" background-color="#334157" text-color="#fff" active-text-color="#fff">
<!--    <el-button class="button_img">-->
<!--      <img class="show_img" :src="collapsed ? imgSq : imgShow" @click="toggle(collapsed)">-->
<!--    </el-button>-->
    <div class="submenu">
      <div style="margin-right: 20px">责任人:&emsp;{{ username }}</div>
     <el-button size="small" type="primary" @click="exit">返回</el-button>
    </div>
  </el-menu>
</template>
<script>
import { setStore,getStore } from '@/utils/store'
import img from '../assets/img/user.png'
import { getLoginUserInfo } from "@/api/common"
export default {
  name: 'navCon',
  data() {
    return {
      collapsed: true,
      imgShow: require('../assets/img/show.png'),
      imgSq: require('../assets/img/sq.png'),
      user: {},
      imgPath: img,
      username: ''
    }
  },
  created() {
    this.get_login_user_info()
  },
  methods: {
  get_login_user_info() {
    getLoginUserInfo().then(res=> {
      // setStore({'name': 'user', 'content': res.data, 'type':''})
      this.username = res.data.name
    })
  },
	exit() {
    window.location.href = `http://81.70.84.72:30043/planWeb/#/choose?token=${getStore({'name':'token','type':'','debug':''})}`
	}
    // // 退出登录
    // exit() {
    //   this.$confirm('退出登录, 是否继续?', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   })
    //     .then(() => {
    //         this.$store.commit('logout')
    //         this.$router.push({ path: '/login' })
    //         this.$message({type: 'success', message: '已退出登录!'})
    //     })
    //     .catch(() => {
    //       this.$message({ type: 'info', message: '已取消'})
    //     })
    // },
    // 切换显示
    // toggle(val) {
    //   this.collapsed = !val
    //   this.$root.Bus.$emit('toggle', this.collapsed)
    // }
  }
}
</script>
<style scoped>
.submenu {
  float: right;
  color: #fff;
  line-height: 60px;
  margin-right: 20px;
  display: flex;
  align-items: center;
}
.button_img {
  height: 60px;
  background-color: transparent;
  border: none;
}
.show_img {
  width: 26px;
  height: 26px;
  position: absolute;
  top: 17px;
  left: 17px;
}
.show_img:active {
  border: none;
}
</style>