You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
76 lines
2.1 KiB
76 lines
2.1 KiB
<template>
|
|
<div class="flex items-center justify-between pr-5 shadow-sm">
|
|
<!-- <h1 class="text-lg font-medium py-3 px-6"></h1> -->
|
|
<el-menu :default-active="activeIndex" class="el-menu-demo flex-1" mode="horizontal">
|
|
<el-menu-item index="1" @click="toShop">插件商城</el-menu-item>
|
|
<el-menu-item index="2" @click="toDevelop">开发教程</el-menu-item>
|
|
<el-menu-item index="3" @click="toDown">下载模板</el-menu-item>
|
|
<el-menu-item index="4" @click="toUp">上传插件</el-menu-item>
|
|
</el-menu>
|
|
<el-dropdown>
|
|
<span class="flex items-center">
|
|
<el-avatar class="mr-2" size="small" src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"></el-avatar>
|
|
<div class="mr-3">{{ account }}</div>
|
|
<el-icon class="el-icon--right">
|
|
<ArrowDown />
|
|
</el-icon>
|
|
</span>
|
|
<template #dropdown>
|
|
<el-dropdown-menu>
|
|
<el-dropdown-item @click="openChangePassword">修改密码</el-dropdown-item>
|
|
<el-dropdown-item @click="signOut">退出登录</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</template>
|
|
</el-dropdown>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, ref } from 'vue';
|
|
import { useStore } from 'vuex';
|
|
import { useRouter } from 'vue-router';
|
|
import { ArrowDown } from '@element-plus/icons';
|
|
|
|
const store = useStore();
|
|
const router = useRouter();
|
|
// const toggleCollapse = () => {
|
|
// console.log('Toggle Collapse');
|
|
// store.commit('toggleCollapse');
|
|
// };
|
|
// const menu = computed(() => store.state.menu);
|
|
const account = computed(() => store.getters['user/account']);
|
|
const activeIndex = ref('1');
|
|
|
|
// 打开修改密码的页面
|
|
function openChangePassword() {
|
|
router.push({ name: 'pw-change' });
|
|
}
|
|
|
|
// 退出登录
|
|
function signOut() {
|
|
store.commit('user/setUser', null);
|
|
router.push({ name: 'signin' });
|
|
}
|
|
|
|
function toShop() {
|
|
router.push({ name: 'plugin-shop' });
|
|
}
|
|
|
|
function toDevelop() {
|
|
router.push({ name: 'develop' });
|
|
}
|
|
|
|
function toDown() {
|
|
router.push({ name: 'download-mould' });
|
|
}
|
|
|
|
function toUp() {
|
|
router.push({ name: 'upload' });
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.el-menu-item {
|
|
width: 10%;
|
|
}
|
|
</style>
|
|
|