Kane
/
vue-learning
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

加入需求管理模块。

This commit is contained in:
Kane 2023-01-26 00:01:29 +08:00
parent f7da18f679
commit a7f05c10c3
6 changed files with 154 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
企业级管理系统/web/admin_system/public/index.html
View File

@ -2,7 +2,7 @@
* @Author: Kane * @Author: Kane
* @Date: 2022-12-17 11:08:18 * @Date: 2022-12-17 11:08:18
* @LastEditors: Kane * @LastEditors: Kane
* @LastEditTime: 2023-01-07 20:54:14 * @LastEditTime: 2023-01-25 23:58:55
* @FilePath: \admin_system\public\index.html * @FilePath: \admin_system\public\index.html
* @Description: * @Description:
* *
@ -34,10 +34,11 @@
} }
body { body {
overflow: hidden; overflow: overlay;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
max-height: 100vh; max-height: 100vh;
min-width: 1280px;
} }
</style> </style>
</html> </html>

5
企业级管理系统/web/admin_system/src/layout/Index.vue
View File

@ -2,7 +2,7 @@
* @Author: Kane * @Author: Kane
* @Date: 2023-01-04 11:05:44 * @Date: 2023-01-04 11:05:44
* @LastEditors: Kane * @LastEditors: Kane
* @LastEditTime: 2023-01-25 14:55:14 * @LastEditTime: 2023-01-25 23:57:51
* @FilePath: \admin_system\src\layout\Index.vue * @FilePath: \admin_system\src\layout\Index.vue
* @Description: * @Description:
* *
@ -52,11 +52,12 @@ export default {
height: 100vh; height: 100vh;
max-height: 100vh; max-height: 100vh;
/* overflow: hiddens; */ /* overflow: hiddens; */
min-width: 1280px;
} }
#layout-aside { #layout-aside {
/* width: 175px; */ /* width: 175px; */
background-color: #223142; background-color: #2f4156;
overflow-x: hidden; overflow-x: hidden;
height: calc(100vh - 50px); height: calc(100vh - 50px);
max-height: calc(100vh - 50px); max-height: calc(100vh - 50px);

86
企业级管理系统/web/admin_system/src/layout/components/Aside.vue
View File

@ -2,44 +2,47 @@
* @Author: Kane * @Author: Kane
* @Date: 2023-01-04 11:30:33 * @Date: 2023-01-04 11:30:33
* @LastEditors: Kane * @LastEditors: Kane
* @LastEditTime: 2023-01-25 15:11:23 * @LastEditTime: 2023-01-25 23:44:43
* @FilePath: \admin_system\src\layout\components\Aside.vue * @FilePath: \admin_system\src\layout\components\Aside.vue
* @Description: * @Description:
* *
* Copyright (c) ${2022} by Kane, All Rights Reserved. * Copyright (c) ${2022} by Kane, All Rights Reserved. 223142 2f4156
--> -->
<template> <template>
<el-menu id="side-bar" router :default-active="currentPath" background-color="#223142" text-color="#fff" <div class="wrapper">
active-text-color="#ffd04b" :collapse="asideCollapse"> <el-menu id="side-bar" router :default-active="currentPath" background-color="#2f4156" text-color="#fff"
<template v-for="route in this.routers" :key="route.path"> active-text-color="#ffd04b" :collapse="asideCollapse">
<template v-if="!route.hidden"> <template v-for="route in this.routers" :key="route.path">
<template v-if="hasOnlyChild(route.children)"> <template v-if="!route.hidden">
<!-- 当只有一个子路由时，直接渲染子路由 --> <template v-if="hasOnlyChild(route.children)">
<el-menu-item :index="route.children[0].path"> <!-- 当只有一个子路由时，直接渲染子路由 -->
<component :is="route.children[0].meta.icon" class="icons"> <el-menu-item :index="route.children[0].path" class="sidebar-submenu">
</component> <component :is="route.children[0].meta.icon" class="icons">
<!-- <el-icon v-html="route.children[0].meta && route.children[0].meta.icon"></el-icon> --> </component>
<template #title>{{ route.children[0].meta && route.children[0].meta.title }}</template> <!-- <el-icon v-html="route.children[0].meta && route.children[0].meta.icon"></el-icon> -->
</el-menu-item> <template #title>{{ route.children[0].meta && route.children[0].meta.title }}</template>
</template> </el-menu-item>
<template v-else> </template>
<!-- 不是一个子路由时，有可能没有子路由，或者是多个子路由 --> <template v-else>
<el-sub-menu v-if="route.children && route.children.length" :index="route.path"> <!-- 不是一个子路由时，有可能没有子路由，或者是多个子路由 -->
<template #title> <el-sub-menu v-if="route.children && route.children.length" :index="route.path"
<component :is="route.meta.icon" class="icons"></component> class="sidebar-submenu">
<span>{{ route.meta && route.meta.title }}</span> <template #title>
</template> <component :is="route.meta.icon" class="icons"></component>
<template v-for="child in route.children" :key="child.path"> <span>{{ route.meta && route.meta.title }}</span>
<el-menu-item v-if="!child.hidden" :index="child.path"> </template>
<component :is="child.meta.icon" class="icons"></component> <template v-for="child in route.children" :key="child.path">
<template #title>{{ child.meta && child.meta.title }}</template> <el-menu-item v-if="!child.hidden" :index="child.path" class="sidebar-item">
</el-menu-item> <component :is="child.meta.icon" class="icons"></component>
</template> <template #title>{{ child.meta && child.meta.title }}</template>
</el-sub-menu> </el-menu-item>
</template>
</el-sub-menu>
</template>
</template> </template>
</template> </template>
</template> </el-menu>
</el-menu> </div>
</template> </template>
<script> <script>
@ -123,10 +126,9 @@ export default {
.is-opened { /* .is-opened {
border-left: 5px solid #1d74b2; border-left: 5px solid #1d74b2;
/* background-color: #344a5f !important; */ } */
}
.icons { .icons {
width: 1em; width: 1em;
@ -134,8 +136,16 @@ export default {
margin-right: 8px; margin-right: 8px;
} }
/* .el-menu-item { .sidebar-submenu {
padding: 5px; background-color: #2f4156 !important;
border: 1px solid red; }
} */
.sidebar-item {
background-color: #223142 !important;
}
.wrapper {
height: 100%;
overflow-y: overlay;
}
</style> </style>

33
企业级管理系统/web/admin_system/src/router/index.js
View File

@ -2,7 +2,7 @@
* @Author: Kane * @Author: Kane
* @Date: 2022-12-14 15:12:46 * @Date: 2022-12-14 15:12:46
* @LastEditors: Kane * @LastEditors: Kane
* @LastEditTime: 2023-01-25 15:10:03 * @LastEditTime: 2023-01-25 23:33:05
* @FilePath: \admin_system\src\router\index.js * @FilePath: \admin_system\src\router\index.js
* @Description: 定义应用路由配置 * @Description: 定义应用路由配置
* *
@ -54,6 +54,37 @@ const routes = [
], ],
component: () => import("../layout/Index.vue"), component: () => import("../layout/Index.vue"),
}, },
{
//需求管理
path: "/requirement",
name: "Requirement",
meta: {
title: "需求管理",
icon: "Document",
},
component: () => import("../layout/Index.vue"),
children: [
{
path: "/requirement-manager",
name: "RequirementManager",
meta: {
title: "需求管理",
icon: "Document",
},
component: () => import("../views/requirement/RequirementManager.vue"),
},
{
path: "/requirement-editing",
name: "RequirementEditing",
hidden: true,
meta: {
title: "需求管理",
icon: "edit",
},
component: () => import("../views/requirement/RequirementEditing.vue"),
},
],
},
{//信息管理 {//信息管理
path: "/news", path: "/news",
name: "News", name: "News",

37
企业级管理系统/web/admin_system/src/views/requirement/RequirementEditing.vue Normal file
View File

@ -0,0 +1,37 @@
<!--
* @Author: Kane
* @Date: 2023-01-25 23:16:29
* @LastEditors: Kane
* @LastEditTime: 2023-01-25 23:19:00
* @FilePath: \admin_system\src\views\requirement\RequirementEditing.vue
* @Description:
*
* Copyright (c) ${2022} by Kane, All Rights Reserved.
-->
<!--
* @Author: Kane
* @Date: 2023-01-25 23:13:47
* @LastEditors: Kane
* @LastEditTime: 2023-01-25 23:15:21
* @FilePath: \admin_system\src\views\requirement\RequirementManager.vue
* @Description:
*
* Copyright (c) ${2022} by Kane, All Rights Reserved.
-->
<template>
需求编辑页面
</template>
<script>
export default {
name: "requirement-editing",
data()
{
return {};
},
};
</script>
<style scoped>
</style>

31
企业级管理系统/web/admin_system/src/views/requirement/RequirementManager.vue Normal file
View File

@ -0,0 +1,31 @@
<!--
* @Author: Kane
* @Date: 2023-01-25 23:13:47
* @LastEditors: Kane
* @LastEditTime: 2023-01-25 23:51:03
* @FilePath: \admin_system\src\views\requirement\RequirementManager.vue
* @Description:
*
* Copyright (c) ${2022} by Kane, All Rights Reserved.
-->
<template>
<el-scrollbar>
</el-scrollbar>
</template>
<script>
export default {
name: "requirement-manager",
data()
{
return {};
},
};
</script>
<style scoped>
.el-scrollbar {
height: calc(100vh - 90px);
}
</style>