<template>
    <div class="layout-wrap">
        <LayoutHeader />
        <div class="layout-bottom-wrap">
            <!-- <SideMenu /> -->
            <div class="layout-bottom-right-content" :class="(currentName == '/workbench' || currentName == '/workbenchcm') ? '':' p-16'">
                <el-scrollbar :style="'height:'+`${contentHeight}`+'px'">
                    <router-view></router-view>
                </el-scrollbar>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    components: {
        LayoutHeader: () => import('./components/LayoutHeader'),
        // SideMenu: () => import('./components/SideMenu'),
    },
    computed:{
        // 获取抽屉drawer的内容高度
        contentHeight(){
            let oh = document.documentElement.clientHeight;
            return oh-85

        } ,
        currentPath() {
            return this.$route.path; // 获取当前路由的路径
        },
        currentName() {
            return this.$route.name; // 获取当前路由的名称
        }
    },
}
</script>
<style lang="scss">
.layout-wrap{
    display: flex;
    flex-direction: column;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}
.layout-bottom-wrap{
    display: flex;
    height: calc(100% - 56px);
}
.layout-bottom-right-content{
    width: calc(100% - 0px);
    height: calc(100%);
    background-color: #f6f4f4;
    font-size: 14px;
}
.layout-content-wrap{
    width: 100%;
    height: calc(100%);
}
</style>