This commit is contained in:
筱锋xiao_lfeng 2024-01-27 15:49:16 +08:00
parent 6c9c1fc509
commit 77a1ecf875
20 changed files with 35 additions and 124 deletions

1
.gitattributes vendored Normal file
View File

@ -0,0 +1 @@
* -text

View File

@ -1,9 +1,9 @@
<template>
<div style="display: flex;flex-direction: row" >
<LeftBar></LeftBar>
<router-view></router-view>
</div>
</template>
<script setup>
import LeftBar from "@/Manager/LeftBar.vue";
<template>
<div style="display: flex;flex-direction: row" >
<LeftBar></LeftBar>
<router-view></router-view>
</div>
</template>
<script setup>
import LeftBar from "@/Manager/LeftBar.vue";
</script>

View File

@ -1,100 +0,0 @@
<template>
<div class="header">
<a-button class="logo" ghost>LOGO</a-button>
<div class="centered-text">内部系统管理界面</div>
<div class="avatar-container">
<a-avatar :size="64">
<a-image :size="64" src="../views/images/img1.jpg"></a-image>
</a-avatar>
</div>
</div>
<div>
<a-menu
v-model:selectedKeys="state.selectedKeys"
style="width: 256px"
mode="inline"
:open-keys="state.openKeys"
:items="items"
@openChange="onOpenChange"
></a-menu>
</div>
</template>
<script setup>
import { h, reactive } from 'vue';
import { MailOutlined, AppstoreOutlined, SettingOutlined } from '@ant-design/icons-vue';
function getItem(label, key, icon, children, type) {
return {
key,
icon,
children,
label,
type,
};
}
const items = reactive([
getItem('系统管理', 'sub1', () => h(MailOutlined), [
getItem('用户管理', '1'),
getItem('角色管理', '2'),
getItem('权限管理', '3'),
getItem('日志管理', '4'),
getItem('日报管理', '5'),
getItem('消息管理', '6'),
]),
getItem('首页管理', 'sub2', () => h(AppstoreOutlined), [
getItem('轮播图管理', '5'),
getItem('团队简介', '6'),
getItem('项目推荐', '7'),
getItem('新闻展示', '8'),
getItem('用户推荐', '9'),
]),
getItem('信息管理', 'sub4', () => h(SettingOutlined), [
getItem('项目信息管理', '9'),
getItem('团队信息管理', '10'),
getItem('新闻信息管理', '11'),
]),
]);
const state = reactive({
rootSubmenuKeys: ['sub1', 'sub2', 'sub4'],
openKeys: ['sub1'],
selectedKeys: [],
});
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] : [];
}
};
</script>
<style scoped>
.header {
position: relative;
background: rgb(68, 112, 131);
padding: 8px;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
border: none;
font-size: 25px;
font-weight: bold;
display: flex;
}
.avatar-container {
margin-left: auto; /* 将头像置于最右侧 */
}
.centered-text {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font-size:35px;
font-weight: normal;
color: white;
}
</style>

10
src/manage.vue Normal file
View File

@ -0,0 +1,10 @@
<template >
<div style="display: flex;flex-direction: column;">
<Header></Header>
<MainSection></MainSection>
</div>
</template>
<script setup>
import Header from "@/Manager/Header.vue";
import MainSection from "@/Manager/MainSection.vue";
</script>

View File

@ -11,60 +11,60 @@ const router = createRouter({
{
path:'/Manager',
name:'Manager',
component:()=>import('../Manager/Manage.vue'),
component:()=>import('../manage.vue'),
children:[
{
path:'/Manager/Main',
component:() =>import('../Manager/components/Main.vue')
component:() =>import('@/components/Main.vue')
},
{
path:'/Manager/User',
component:() =>import('../Manager/components/User.vue')
component:() =>import('@/components/User.vue')
},
{
path:'/Manager/Role',
component:() =>import('../Manager/components/Role.vue')
component:() =>import('@/components/Role.vue')
},
{
path:'/Manager/Authority',
component:() =>import('../Manager/components/Authority.vue')
component:() =>import('@/components/Authority.vue')
},
{
path:'/Manager/Log',
component:() =>import('../Manager/components/Log.vue')
component:() =>import('@/components/Log.vue')
},
{
path:'/Manager/Daily',
component:() =>import('../Manager/components/Daily.vue')
component:() =>import('@/components/Daily.vue')
},
{
path:'/Manager/Message',
component:() =>import('../Manager/components/Message.vue')
component:() =>import('@/components/Message.vue')
},
{
path:'/Manager/Carousel',
component:() =>import('../Manager/components/Carousel.vue')
component:() =>import('@/components/Carousel.vue')
} ,{
path:'/Manager/TeamProfile',
component:() =>import('../Manager/components/TeamProfile.vue')
component:() =>import('@/components/TeamProfile.vue')
},{
path:'/Manager/ProjectRecommend',
component:() =>import('../Manager/components/ProjectRecommend.vue')
component:() =>import('@/components/ProjectRecommend.vue')
},{
path:'/Manager/NewsDisplay',
component:() =>import('../Manager/components/NewsDisplay.vue')
component:() =>import('@/components/NewsDisplay.vue')
},{
path:'/Manager/UserRecommend',
component:() =>import('../Manager/components/UserRecommend.vue')
component:() =>import('@/components/UserRecommend.vue')
},{
path:'/Manager/ProjectInformation',
component:() =>import('../Manager/components/ProjectInformation.vue')
component:() =>import('@/components/ProjectInformation.vue')
},{
path:'/Manager/TeamInformation',
component:() =>import('../Manager/components/TeamInformation.vue')
component:() =>import('@/components/TeamInformation.vue')
},{
path:'/Manager/NewsInformation',
component:() =>import('../Manager/components/NewsInformation.vue')
component:() =>import('@/components/NewsInformation.vue')
}
]
}