<template> <div class="user-wrapper"> <div class="content-box"> <!-- <a href="https://pro.loacg.com/docs/getting-started" target="_blank"> <span class="action"> <a-icon type="question-circle-o"></a-icon> </span> </a> --> <!-- <notice-icon class="action"/> --> <a-dropdown> <span class="action ant-dropdown-link user-dropdown-menu"> <!-- <a-avatar class="avatar" size="small" :src="avatar==''?defaultAvatar:avatar"/> --> <a-icon type="user" /> <span style="margin: 0 5px;">{{ nickname }}</span> <a-icon type="down" /> </span> <a-menu slot="overlay" class="user-dropdown-menu-wrapper"> <a-menu-item key="0"> <router-link :to="{ name: 'changePwd' }"> <a-icon type="user"/> <span>修改密码</span> </router-link> </a-menu-item> <!-- <a-menu-item key="1"> <router-link :to="{ name: 'settings' }"> <a-icon type="setting"/> <span>账户设置</span> </router-link> </a-menu-item> <a-menu-item key="2" disabled> <a-icon type="setting"/> <span>测试</span> </a-menu-item> --> <a-menu-divider/> <a-menu-item key="3"> <a href="javascript:;" @click="handleLogout"> <a-icon type="logout"/> <span>退出登录</span> </a> </a-menu-item> </a-menu> </a-dropdown> </div> </div> </template> <script> import NoticeIcon from '@/components/NoticeIcon' import { mapActions, mapGetters } from 'vuex' import defaultAvatar from '@/assets/avatar2.jpg' export default { name: 'UserMenu', components: { NoticeIcon }, computed: { ...mapGetters(['nickname', 'avatar']) }, data () { return { defaultAvatar: defaultAvatar } }, methods: { ...mapActions(['Logout']), handleLogout () { this.$confirm({ title: '提示', content: '真的要注销登录吗 ?', centered: true, onOk: () => { return this.Logout({}).then(() => { setTimeout(() => { // window.location.reload() this.$router.push({ path: '/user/login' }) }, 16) }).catch(err => { this.$message.error({ title: '错误', description: err.message }) }) }, onCancel () { } }) } } } </script>