56 lines
1.3 KiB
Vue
56 lines
1.3 KiB
Vue
<!--
|
|
* @Description: layout
|
|
* @Author: zenghua.wang
|
|
* @Date: 2024-01-26 20:13:37
|
|
* @LastEditors: zenghua.wang
|
|
* @LastEditTime: 2024-02-05 16:03:31
|
|
-->
|
|
<template>
|
|
<div class="basic-layout" :style="{ 'background-image': 'url(' + getAssetsFile('images/vsualized/screenbg.png') + ')' }">
|
|
<div class="basic-layout-container">
|
|
<Main />
|
|
<!-- <Bottom :name-val="route.name"></Bottom> -->
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup name="layout">
|
|
import { getAssetsFile } from '@/utils';
|
|
import { useSettingStore } from '@/store/modules/setting';
|
|
|
|
import Sider from './component/Sider';
|
|
import Header from './component/Header';
|
|
import Bottom from './component/Bottom';
|
|
import Main from './component/Main';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
import { onMounted } from 'vue';
|
|
const route = useRoute();
|
|
|
|
const SettingStore = useSettingStore();
|
|
onMounted(() => {
|
|
console.info('route', route);
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.basic-layout {
|
|
width: 100%;
|
|
height: 100vh;
|
|
&.hideSider {
|
|
:deep(.layout-sider) {
|
|
width: 60px !important;
|
|
}
|
|
.basic-layout-container {
|
|
margin-left: 60px !important;
|
|
}
|
|
}
|
|
&-container {
|
|
position: relative;
|
|
height: 100%;
|
|
transition: margin-left 0.28s;
|
|
box-sizing: border-box;
|
|
@include flex-column;
|
|
}
|
|
}
|
|
</style>
|