<style>
.layout{
    border: 1px solid #d7dde4;
    background: #f5f7f9;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
    color:red;
}

</style>
<template>
    <div class="layout" style="height: 90vh">
        <Layout>

            <Layout>
                <Sider hide-trigger :style="{background: '#fff'}">
                    <Menu active-name="1-2" theme="light" width="auto" :open-names="['1']">
                        <Submenu name="1">
                            <template #title>
                                <Icon type="ios-cog"></Icon>
                                系统管理
                            </template>
                            <MenuItem name="1-1" @click="navigateTo('/manager/UserManage')">用户管理</MenuItem>
                            <MenuItem name="1-2" @click="navigateTo('/manager/RoleManage')">角色管理</MenuItem>
                            <MenuItem name="1-3" @click="navigateTo('/manager/PermissionsManage')">权限管理</MenuItem>
                            <MenuItem name="1-4" @click="navigateTo('/manager/LogManage')">日志管理</MenuItem>
                            <MenuItem name="1-5" @click="navigateTo('/manager/DailyReportManage')">日报管理</MenuItem>
                            <MenuItem name="1-6" @click="navigateTo('/manager/MessageManage')" >消息管理</MenuItem>
                        </Submenu>
                        <Submenu name="2">
                            <template #title>
                                <Icon type="ios-keypad"></Icon>
                              首页管理
                            </template>
                            <MenuItem name="2-1" @click="navigateTo('/manager/CarouselManagement')">轮播图管理</MenuItem>
                            <MenuItem name="2-2" @click="navigateTo('/manager/TeamIntroduction')">团队简介</MenuItem>
                            <MenuItem name="2-3" @click="navigateTo('/manager/ProjectRecommendations')">项目推荐</MenuItem>
                            <MenuItem name="2-4" @click="navigateTo('/manager/NewsDisplay')">新闻展示</MenuItem>
                            <MenuItem name="2-5" @click="navigateTo('/manager/UserRecommendations')">用户推荐</MenuItem>
                        </Submenu>
                        <Submenu name="3">
                            <template #title>
                                <Icon type="ios-analytics"></Icon>
                              信息管理
                            </template>
                            <MenuItem name="3-1" @click="navigateTo('/manager/ProjectInformationManagement')">项目信息管理</MenuItem>
                            <MenuItem name="3-2" @click="navigateTo('/manager/TeamInformationManagement')">团队信息管理</MenuItem>
                            <MenuItem name="3-3" @click="navigateTo('/manager/NewsInformationManagement')">新闻信息管理</MenuItem>
                        </Submenu>
                    </Menu>
                </Sider>

            </Layout>
        </Layout>
    </div>
</template>
<script>
import {Icon, Layout, MenuItem, Sider, Submenu} from "view-ui-plus";

export default {
    components: {Sider, Icon, MenuItem, Submenu, Layout},
        methods: {
            navigateTo(path) {
                this.$router.push(path);
            }
        }

}

</script>
