You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
124 lines
3.3 KiB
124 lines
3.3 KiB
<template> |
|
<div :class="{'has-logo':showLogo}"> |
|
<logo v-if="showLogo" :collapse="isCollapse" /> |
|
<el-scrollbar wrap-class="scrollbar-wrapper"> |
|
<el-menu |
|
:default-active="activeMenu" |
|
:collapse="isCollapse" |
|
:background-color="variables.menuBg" |
|
:text-color="variables.menuText" |
|
:unique-opened="false" |
|
:active-text-color="variables.menuActiveText" |
|
:collapse-transition="false" |
|
mode="vertical" |
|
> |
|
<sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" /> |
|
</el-menu> |
|
</el-scrollbar> |
|
|
|
</div> |
|
</template> |
|
|
|
<script> |
|
|
|
import { mapGetters } from 'vuex' |
|
import Logo from './Logo' |
|
import SidebarItem from './SidebarItem' |
|
import variables from '@/styles/variables.scss' |
|
import menusdata from './leftMenusData.js' |
|
import { mirlist } from '@/api/user' |
|
|
|
//console.log(menusdata); |
|
export default { |
|
components: { SidebarItem, Logo }, |
|
created: function () { |
|
this.getmunusdata(); |
|
//this.menusdatas = '' |
|
var fe = 10; |
|
}, |
|
data() { |
|
return { |
|
routes:menusdata |
|
} |
|
}, |
|
computed: { |
|
...mapGetters([ |
|
'sidebar' |
|
]), |
|
// routes() { |
|
// return this.$router.options.routes |
|
// }, |
|
activeMenu() { |
|
const route = this.$route |
|
const { meta, path } = route |
|
// if set path, the sidebar will highlight the path you set |
|
if (meta.activeMenu) { |
|
return meta.activeMenu |
|
} |
|
return path |
|
}, |
|
showLogo() { |
|
return this.$store.state.settings.sidebarLogo |
|
}, |
|
variables() { |
|
return variables |
|
}, |
|
isCollapse() { |
|
return !this.sidebar.opened |
|
} |
|
}, |
|
|
|
methods: { |
|
SplicingMenuTree(menus) { |
|
let newMenu = null, arrMenus = []; |
|
menus.forEach(item => { |
|
//console.log(menusdata[0]); |
|
// if (!this.menusdata.children) { |
|
// this.$set(this.menusdata,'children', []) |
|
// //menusdata[0].children = [] |
|
// } |
|
|
|
newMenu = { |
|
path: '/subfile?id='+item.id, |
|
meta: { title: item.directory, icon: 'dashboard' }, |
|
children:[] |
|
} |
|
//console.log(item.directories.length); |
|
if (item.directories && item.directories.length > 0) { |
|
newMenu.children = this.SplicingMenuTree(item.directories,) |
|
} |
|
|
|
arrMenus.push(newMenu); |
|
//console.log(arrMenus); |
|
|
|
}); |
|
return arrMenus; |
|
}, |
|
|
|
getmunusdata() { |
|
let thiss = this; |
|
// console.log(this.$route); |
|
// console.log(this.$store); |
|
|
|
mirlist().then(response => { |
|
let datamain = response.data; |
|
//routesData(datamain.data.menus); |
|
//console.log(response); |
|
console.log(this.menusdatas); |
|
menusdata[0].children = this.SplicingMenuTree(datamain.data.menus); |
|
//menusdatas[0] = addmunst |
|
console.log(menusdata); |
|
//this.routes = menusdata |
|
//console.log(menusdata); |
|
|
|
}).catch(function (error) { |
|
thiss.$message({ |
|
showClose: true, |
|
message: error, |
|
type: 'error' |
|
}); |
|
}); |
|
} |
|
} |
|
} |
|
</script>
|
|
|