bonus
/
mallBackend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

导航配置

This commit is contained in:
13218645326 2023-12-02 15:30:19 +08:00
parent 20ebcfa179
commit 32f8aa7437
13 changed files with 161 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components.d.ts vendored
View File

@ -16,6 +16,8 @@ declare module 'vue' {
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
Header: typeof import('./src/components/header.vue')['default']
HeaderTop: typeof import('./src/components/headerTop.vue')['default']
MenuItem: typeof import('./src/components/comNav/sideBar/menuItem.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']

1
package.json
View File

@ -22,6 +22,7 @@
"nprogress": "^0.2.0",
"pinia": "^2.1.7",
"pinia-plugin-persist": "^1.0.0",
"sass": "^1.69.5",
"unplugin-icons": "^0.18.0",
"vite-plugin-html": "^3.2.0",
"vite-plugin-zip-file": "^2.2.0",

26
pnpm-lock.yaml
View File

@ -32,6 +32,9 @@ dependencies:
pinia-plugin-persist:
specifier: ^1.0.0
version: 1.0.0(pinia@2.1.7)(vue@3.3.4)
sass:
specifier: ^1.69.5
version: 1.69.5
unplugin-icons:
specifier: ^0.18.0
version: 0.18.0
@ -81,7 +84,7 @@ devDependencies:
version: 0.25.2(vue@3.3.4)
vite:
specifier: ^4.4.11
version: 4.4.11(@types/node@18.18.5)
version: 4.4.11(@types/node@18.18.5)(sass@1.69.5)
vue-tsc:
specifier: ^1.8.19
version: 1.8.19(typescript@5.2.2)
@ -740,7 +743,7 @@ packages:
'@babel/core': 7.23.5
'@babel/plugin-transform-typescript': 7.23.5(@babel/core@7.23.5)
'@vue/babel-plugin-jsx': 1.1.5(@babel/core@7.23.5)
vite: 4.4.11(@types/node@18.18.5)
vite: 4.4.11(@types/node@18.18.5)(sass@1.69.5)
vue: 3.3.4
transitivePeerDependencies:
- supports-color
@ -753,7 +756,7 @@ packages:
vite: ^4.0.0
vue: ^3.2.25
dependencies:
vite: 4.4.11(@types/node@18.18.5)
vite: 4.4.11(@types/node@18.18.5)(sass@1.69.5)
vue: 3.3.4
dev: true
@ -1581,6 +1584,9 @@ packages:
resolution: {integrity: sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==}
dev: false
/immutable@4.3.4:
resolution: {integrity: sha512-fsXeu4J4i6WNWSikpI88v/PcVflZz+6kMhUfIwc5SY+poQRPnaf5V7qds6SUyUN3cVxEzuCab7QIoLOQ+DQ1wA==}
/inherits@2.0.4:
resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
dev: false
@ -2155,6 +2161,15 @@ packages:
resolution: {integrity: sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==}
dev: false
/sass@1.69.5:
resolution: {integrity: sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==}
engines: {node: '>=14.0.0'}
hasBin: true
dependencies:
chokidar: 3.5.3
immutable: 4.3.4
source-map-js: 1.0.2
/scule@1.1.0:
resolution: {integrity: sha512-vRUjqhyM/YWYzT+jsMk6tnl3NkY4A4soJ8uyh3O6Um+JXEQL9ozUCe7pqrxn3CSKokw0hw3nFStfskzpgYwR0g==}
dev: true
@ -2480,7 +2495,7 @@ packages:
html-minifier-terser: 6.1.0
node-html-parser: 5.4.2
pathe: 0.2.0
vite: 4.4.11(@types/node@18.18.5)
vite: 4.4.11(@types/node@18.18.5)(sass@1.69.5)
dev: false
/vite-plugin-zip-file@2.2.0:
@ -2489,7 +2504,7 @@ packages:
jszip: 3.10.1
dev: false
/vite@4.4.11(@types/node@18.18.5):
/vite@4.4.11(@types/node@18.18.5)(sass@1.69.5):
resolution: {integrity: sha512-ksNZJlkcU9b0lBwAGZGGaZHCMqHsc8OpgtoYhsQ4/I2v5cnpmmmqe5pM4nv/4Hn6G/2GhTdj0DhZh2e+Er1q5A==}
engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true
@ -2521,6 +2536,7 @@ packages:
esbuild: 0.18.20
postcss: 8.4.31
rollup: 3.29.4
sass: 1.69.5
optionalDependencies:
fsevents: 2.3.3

5
src/App.vue
View File

@ -4,4 +4,7 @@
<script setup lang="ts">
</script>
<style scoped></style>
<style lang="scss">
@import url("./style/css/reset.css");
</style>

2
src/components/comNav/index.vue
View File

@ -1,5 +1,5 @@
<template>
<h1>66</h1>
<subMenu></subMenu>
<RouterView />

16
src/components/comNav/sideBar/subMenu.vue
View File

@ -1,6 +1,8 @@
<template>
<el-menu active-text-color="#fff" :background-color="props.backgroundColor" :default-active="'0'" text-color="#999" :unique-opened="true" :default-openeds="['/test1']"
router>
<el-menu :collapse="props.collapse" :background-color="props.backgroundColor" :text-color="props.textColor"
:active-text-color="props.activeTextColor" :default-active="props.defaultActive"
:default-openeds="props.defaultOpeneds" :unique-opened="props.uniqueOpened" :menu-trigger="props.menuTrigger"
:router="props.router" :collapse-transition="props.collapseTransition" :popper-effect="props.popperEffect">
<menuItem :menuList="props.menuList">
</menuItem>
</el-menu>
@ -39,7 +41,7 @@ const props: any = defineProps({
},
defaultOpeneds: {
type: Array,
default: ["/test1/test11"]
default: ["/test1"]
},
uniqueOpened: {
type: Boolean,
@ -80,13 +82,7 @@ const props: any = defineProps({
}]
}
})
const isCollapse = ref(false)
const handleOpen = (key: string, keyPath: string[]) => {
console.log(key, keyPath)
}
const handleClose = (key: string, keyPath: string[]) => {
console.log(key, keyPath)
}
</script>
<style>

66
src/components/headerTop.vue Normal file
View File

@ -0,0 +1,66 @@
<template>
<div class="header_top">
<div class="header_top_left_title">
施工承载力管控系统
</div>
<div class="right_user_opert">
<div class="user_info">
<div class="user_name">
何以解忧
</div>
<div class="user_icon">
<img src="" alt="">
</div>
</div>
<div class="login_opert">
退出登录
</div>
</div>
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
.header_top {
height: 72px;
background-color: $main-color;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 24px;
box-sizing: border-box;
}
.header_top_left_title{
font-size: 32px;
color: #fff;
}
.right_user_opert{
display: flex;
justify-content: flex-end;
align-items: center;
.user_info{
display: flex;
justify-content: flex-end;
align-items: center;
.user_icon{
width: 42px;
height: 42px;
border-radius:50%;
border: 2px solid #ccc;
margin: 0 12px;
}
}
}
</style>

12
src/router/index.ts
View File

@ -8,7 +8,19 @@ const routes: Array<RouteRecordRaw> = [
title: '主页面',
keepAlive: true,
AuthFlag: true
},
children:[{
path: 'configuration',
name: 'configuration',
component: () => import('views/AppMain.vue'),
meta: {
title: '主页面',
keepAlive: true,
AuthFlag: true
},
}
]
}
]

2
src/style/scss/variable.scss
View File

@ -1,2 +1,2 @@
$main-color: #22b2ff;
$main-color: #3fb9f7;
$second-color: #666;

54
src/views/AppMain.vue
View File

@ -1,10 +1,50 @@
<template>
<comNav></comNav>
<RouterView />
</template>
<script setup lang="ts">
import comNav from 'components/comNav/index.vue';
</script>
<div class="view_home">
<div class="main_top">
<headerTop></headerTop>
</div>
<div class="main_">
<div class="main_nav">
<comNav></comNav>
</div>
<div class="main_content">
<style scoped></style>
<RouterView />
</div>
</div>
</div>
</template>
<script setup lang="ts">
import comNav from 'components/comNav/index.vue';
import headerTop from 'components/headerTop.vue';
</script>
<style scoped lang="scss">
.view_home{
display: flex;
flex-direction: column;
width: 100vw;
height: 100vh;
.main_top{
height: 72px;
}
.main_{
flex: 1;
display: flex;
justify-content: space-between;
.main_nav{
width: 240px;
}
.main_content{
flex: 1;
background-color:pink;
}
}
}
</style>

0
src/views/configuration/privacyAgreement.vue Normal file
View File

0
src/views/configuration/specialTopic.vue Normal file
View File

0
src/views/configuration/swiperConfig.vue Normal file
View File