<template>
    <Menu theme="dark" width="auto" :open-names="['product']" @on-select="open" :active-name="activeName">
        <div class="layout-logo-left"></div>
        <Submenu :name="key" v-for="(purview, key) in purviews" :key="key" v-if="purview.menu">
            <template slot="title">
                <Icon type="ios-navigate"></Icon>
                {{purview.name}}

            </template>
            <Menu-item :name="`${key}.${subKey}`" v-for="(subPurview, subKey) in purview.subPurviews" v-if="subPurview.menu" :key="subKey">{{subPurview.name}}</Menu-item>
        </Submenu>
    </Menu>
</template>

<script>
import _ from 'lodash';

export default {
    name: 'purview-menu',
    data() {
        return {
            purviews: this.$config.purviews, // TODO 根据用户权限，初始化菜单
            activeName: ''
        };
    },
    created() {
        this.activeName = this.$router.history.current.name;
    },
    methods: {
        open(menuName) {
            let menu = _.get(this.purviews, menuName.replace('.', '.subPurviews.'));

            if (menu) {
                this.$router.push(menu.path);
            }
        }
    }
};
</script>

<style lang="scss">

</style>