| | |
| | | <script setup>
|
| | | import { nextTick, ref, inject, onMounted } from 'vue';
|
| | | import { nextTick, ref, inject, onMounted, h, reactive } from 'vue';
|
| | | import { useRouter } from "vue-router";
|
| | | import { get, post, postForm } from '@/utils/request.js'
|
| | | import { logout } from '@/config.js';
|
| | | import * as Icons from "@ant-design/icons-vue";
|
| | | import { message } from 'ant-design-vue';
|
| | | // import type { MenuMode, MenuTheme } from 'ant-design-vue';
|
| | | // import { ItemType } from 'ant-design-vue';
|
| | |
|
| | | import {
|
| | | MenuUnfoldOutlined,
|
| | | MenuFoldOutlined,
|
| | |
| | | ...Icons,
|
| | | };
|
| | |
|
| | |
|
| | |
|
| | | onMounted(() => {
|
| | | let name = router.currentRoute.value.name;
|
| | | let path = router.currentRoute.value.path;
|
| | |
| | | }
|
| | | })
|
| | |
|
| | |
|
| | | const state = reactive({
|
| | | rootSubmenuKeys: [],
|
| | | openKeys: ["/"],
|
| | | selectedKeys: [],
|
| | | });
|
| | |
|
| | | getMenu()
|
| | | function getMenu() {
|
| | | get('/api/auth/menu', {}).then((result) => {
|
| | | menuCache.value = result.data.data;
|
| | | let routes = menuCache.value.map(item =>{
|
| | | return item.route
|
| | | })
|
| | | routes.unshift('/')
|
| | | state.rootSubmenuKeys = routes
|
| | | console.log(state.rootSubmenuKeys)
|
| | | })
|
| | | }
|
| | |
|
| | |
| | | selectedKeys.value = [item.key]
|
| | |
|
| | | // open menu
|
| | | let arr = item.key.split("/");
|
| | | let key = '/' + arr[1];
|
| | | openKeys.value = [key]
|
| | | // let arr = item.key.split("/");
|
| | | // let key = '/' + arr[1];
|
| | | // openKeys.value = [key]
|
| | | }
|
| | |
|
| | | const switchLocale = async (locale) => {
|
| | |
| | | }
|
| | | }
|
| | |
|
| | | const onOpenChange = (openKeys) => {
|
| | | const latestOpenKey = openKeys.find(
|
| | | (key) => state.openKeys.indexOf(key) === -1
|
| | | );
|
| | | if (state.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {
|
| | | state.openKeys = openKeys
|
| | | } else {
|
| | | state.openKeys = latestOpenKey ? [latestOpenKey] : [];
|
| | | }
|
| | | console.log(state.openKeys)
|
| | | }
|
| | |
|
| | |
|
| | | </script>
|
| | |
|
| | | <template>
|
| | |
| | | <div class="sider-style">
|
| | | <a-layout-sider class="main-sider" v-model:collapsed="collapsed" :trigger="null" theme="dark">
|
| | | <div class="logo" />
|
| | | <a-menu v-model:openKeys="openKeys" v-model:selectedKeys="selectedKeys" @select="menuSelect" theme="dark"
|
| | | mode="inline" >
|
| | | <a-menu v-model:openKeys="state.openKeys" v-model:selectedKeys="state.selectedKeys" @select="menuSelect" theme="dark"
|
| | | mode="inline" @openChange="onOpenChange">
|
| | | <div>
|
| | | <a-menu-item key="/" name="主页">
|
| | | <HomeOutlined /> {{ formatMessage('common.home', '主页') }}
|