初始化
This commit is contained in:
parent
32f8aa7437
commit
200959cf2a
|
|
@ -1,11 +1,54 @@
|
|||
<template>
|
||||
|
||||
<subMenu></subMenu>
|
||||
|
||||
<RouterView />
|
||||
<subMenu :menuList="menuInfo.menuList" :collapse="menuInfo.collapse" :backgroundColor="menuInfo.backgroundColor" :textColor="menuInfo.textColor"
|
||||
:activeTextColor="menuInfo.activeTextColor" :defaultActive="menuInfo.defaultActive"
|
||||
:defaultOpeneds="menuInfo.defaultOpeneds" :uniqueOpened="menuInfo.uniqueOpened" :menuTrigger="menuInfo.menuTrigger"
|
||||
:router="menuInfo.router" :collapseTransition="menuInfo.collapseTransition" :popperEffect="menuInfo.popperEffect" :isCustomLink="menuInfo.isCustomLink" :customLinkCallBack="menuInfo.customLinkCallBack"></subMenu>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import subMenu from './sideBar/subMenu.vue';
|
||||
import {list } from "router/routerData"
|
||||
import subMenu from './sideBar/subMenu.vue';
|
||||
|
||||
const routes = useRoute()
|
||||
const router = useRouter()
|
||||
const menuInfo:any = reactive({
|
||||
collapse:false,
|
||||
backgroundColor:'#d3e6f3',
|
||||
textColor:"",
|
||||
activeTextColor:'',
|
||||
defaultActive:"",
|
||||
defaultOpeneds:['staticDefault_PathParent'],
|
||||
router:false,
|
||||
collapseTransition:true,
|
||||
menuList:list,
|
||||
isCustomLink:true,
|
||||
customLinkCallBack:(ev:any)=>{
|
||||
console.log("customLinkCallBack",ev)
|
||||
if(ev.startsWith('staticDefault')){
|
||||
return
|
||||
}
|
||||
router.push({
|
||||
name:ev
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
onMounted(()=>{
|
||||
console.log("routes",router.getRoutes())
|
||||
// initRouteList()
|
||||
|
||||
|
||||
})
|
||||
|
||||
|
||||
const initRouteList = ()=>{
|
||||
const routeList = router.getRoutes()
|
||||
menuInfo.menuList = routeList.find(ele=>ele.meta.routeListRoot)?.children
|
||||
menuInfo.defaultOpeneds = menuInfo.menuList[0].path
|
||||
console.log("menuInfo.menuList",menuInfo.menuList)
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<template v-for="item in props.menuList" :key="item.path">
|
||||
|
||||
<el-sub-menu :index="item.path" v-if="item.children && item.children.length > 0">
|
||||
<el-sub-menu :index="item.name" v-if="item.children && item.children.length > 0">
|
||||
<template #title v-if="item.meta.icon">
|
||||
<el-icon>
|
||||
<Edit />
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
<template #title v-else>{{ item.meta.title }}</template>
|
||||
<menuItem :menuList="(item.children as any)" />
|
||||
</el-sub-menu>
|
||||
<el-menu-item :index="item.path" v-else>
|
||||
<el-menu-item :index="item.name" v-else >
|
||||
<template v-if="item.meta.icon">
|
||||
<el-icon >
|
||||
<Search/> </el-icon>
|
||||
|
|
@ -26,14 +26,26 @@
|
|||
|
||||
|
||||
<script lang="ts" setup>
|
||||
const emits = defineEmits(['selectItem'])
|
||||
const menuInfo: any = reactive({
|
||||
list: []
|
||||
})
|
||||
|
||||
// 获取父组件传进来的子菜单列表
|
||||
const props = defineProps({
|
||||
menuList: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
isCustomLink:{
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
const handleSelectItem =(ev:any)=>{
|
||||
console.log("ev=========666",ev)
|
||||
emits("selectItem",ev)
|
||||
|
||||
}
|
||||
</script>
|
||||
|
|
@ -2,22 +2,15 @@
|
|||
<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">
|
||||
:router="props.router" :collapse-transition="props.collapseTransition" :popper-effect="props.popperEffect" @select="customLinkCallBackFn">
|
||||
<menuItem :menuList="props.menuList" :isCustomLink="props.isCustomLink" >
|
||||
</menuItem>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import menuItem from "./menuItem.vue"
|
||||
import { ref } from 'vue'
|
||||
import {
|
||||
Document,
|
||||
Menu as IconMenu,
|
||||
Location,
|
||||
Setting,
|
||||
} from '@element-plus/icons-vue'
|
||||
|
||||
|
||||
const props: any = defineProps({
|
||||
collapse: {
|
||||
type: Boolean,
|
||||
|
|
@ -41,7 +34,7 @@ const props: any = defineProps({
|
|||
},
|
||||
defaultOpeneds: {
|
||||
type: Array,
|
||||
default: ["/test1"]
|
||||
default: []
|
||||
},
|
||||
uniqueOpened: {
|
||||
type: Boolean,
|
||||
|
|
@ -65,23 +58,22 @@ const props: any = defineProps({
|
|||
},
|
||||
menuList: {
|
||||
type: Array,
|
||||
default: [{
|
||||
meta: {
|
||||
title: "666",
|
||||
icon: "Search"
|
||||
},
|
||||
path: '/test1',
|
||||
children: [{
|
||||
meta: {
|
||||
title: "666",
|
||||
icon: "Search"
|
||||
},
|
||||
path: '/test1/test11',
|
||||
}
|
||||
]
|
||||
}]
|
||||
default: []
|
||||
},
|
||||
isCustomLink:{
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
customLinkCallBack:{
|
||||
type:Function,
|
||||
default:()=>{}
|
||||
}
|
||||
})
|
||||
|
||||
const customLinkCallBackFn =(ev:any)=>{
|
||||
console.log("2342423",ev)
|
||||
props.customLinkCallBack(ev)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import './assets/main.css'
|
|||
|
||||
import { createApp } from 'vue'
|
||||
import { createPinia } from 'pinia'
|
||||
|
||||
import 'element-plus/dist/index.css'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
|
||||
|
||||
const routes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/index',
|
||||
|
|
@ -7,21 +8,100 @@ const routes: Array<RouteRecordRaw> = [
|
|||
meta: {
|
||||
title: '主页面',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
AuthFlag: true,
|
||||
routeListRoot: true
|
||||
},
|
||||
children:[{
|
||||
|
||||
path: 'configuration',
|
||||
name: 'configuration',
|
||||
component: () => import('views/AppMain.vue'),
|
||||
meta: {
|
||||
title: '主页面',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
children:[
|
||||
{
|
||||
path: 'swiperConfig',
|
||||
name: 'swiperConfig',
|
||||
component: () => import('views/configuration/swiperConfig.vue'),
|
||||
meta: {
|
||||
title: '轮播图配置',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
}
|
||||
{
|
||||
path: 'specialInformationConfiguration',
|
||||
name: 'specialInformationConfiguration',
|
||||
component: () => import('views/configuration/specialInformationConfiguration.vue'),
|
||||
meta: {
|
||||
title: '专题资讯配置',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'privacyAgreement',
|
||||
name: 'privacyAgreement',
|
||||
component: () => import('views/configuration/privacyAgreement.vue'),
|
||||
meta: {
|
||||
title: '隐私协议模板管理',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
path: 'enterpriseManagement',
|
||||
name: 'enterpriseManagement',
|
||||
component: () => import('views/enterpriseManagement/AppMain.vue'),
|
||||
meta: {
|
||||
title: '企业管理',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
path: 'enterpriseType',
|
||||
name: 'configuration',
|
||||
component: () => import('views/enterpriseManagement/enterpriseType.vue'),
|
||||
meta: {
|
||||
title: '企业类型',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'enterpriseEntryReview',
|
||||
name: 'enterpriseEntryReview',
|
||||
component: () => import('views/enterpriseManagement/enterpriseEntryReview.vue'),
|
||||
meta: {
|
||||
title: '企业入驻审核',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
},
|
||||
|
||||
},
|
||||
{
|
||||
path: 'businessReview',
|
||||
name: 'businessReview',
|
||||
component: () => import('views/enterpriseManagement/businessReview.vue'),
|
||||
meta: {
|
||||
title: '企业业务开通审核',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'enterpriseInfo',
|
||||
name: 'enterpriseInfo',
|
||||
component: () => import('views/enterpriseManagement/enterpriseInfo.vue'),
|
||||
meta: {
|
||||
title: '企业信息',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
}
|
||||
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,106 @@
|
|||
export const list = [
|
||||
{
|
||||
name: "staticDefault_PathParent",
|
||||
path: 'staticDefault_PathParent',
|
||||
meta: {
|
||||
title: '配置管理',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'swiperConfig',
|
||||
name: 'swiperConfig',
|
||||
component: 'views/configuration/swiperConfig.vue',
|
||||
meta: {
|
||||
title: '轮播图配置',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'specialInformationConfiguration',
|
||||
name: 'specialInformationConfiguration',
|
||||
component: 'views/configuration/specialInformationConfiguration.vue',
|
||||
meta: {
|
||||
title: '专题资讯配置',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'privacyAgreement',
|
||||
name: 'privacyAgreement',
|
||||
component: 'views/configuration/privacyAgreement.vue',
|
||||
meta: {
|
||||
title: '隐私协议模板管理',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "企业管理",
|
||||
path: '',
|
||||
meta: {
|
||||
title: '轮播图配置',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'enterpriseManagement',
|
||||
name: 'enterpriseManagement',
|
||||
component: 'views/enterpriseManagement/AppMain.vue',
|
||||
meta: {
|
||||
title: '企业管理',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
path: 'enterpriseType',
|
||||
name: 'configuration',
|
||||
component: 'views/enterpriseManagement/enterpriseType.vue',
|
||||
meta: {
|
||||
title: '企业类型',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'enterpriseEntryReview',
|
||||
name: 'enterpriseEntryReview',
|
||||
component: 'views/enterpriseManagement/enterpriseEntryReview.vue',
|
||||
meta: {
|
||||
title: '企业入驻审核',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
},
|
||||
|
||||
},
|
||||
{
|
||||
path: 'businessReview',
|
||||
name: 'businessReview',
|
||||
component: 'views/enterpriseManagement/businessReview.vue',
|
||||
meta: {
|
||||
title: '企业业务开通审核',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'enterpriseInfo',
|
||||
name: 'enterpriseInfo',
|
||||
component: 'views/enterpriseManagement/enterpriseInfo.vue',
|
||||
meta: {
|
||||
title: '企业信息',
|
||||
keepAlive: true,
|
||||
AuthFlag: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
|
@ -1,9 +1,9 @@
|
|||
<script setup lang="ts">
|
||||
import TheWelcome from '../components/TheWelcome.vue'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main>
|
||||
<TheWelcome />
|
||||
</main>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
|
||||
<style scoped></style>
|
||||
<style scoped lang="scss"></style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue