61 lines
1.0 KiB
Vue
61 lines
1.0 KiB
Vue
<template>
|
|
<el-container class="container">
|
|
<el-header style="box-shadow: var(--el-box-shadow);">
|
|
<TopBar />
|
|
</el-header>
|
|
<el-container>
|
|
<el-aside width="200px">
|
|
<SideBar class="sidebar" />
|
|
</el-aside>
|
|
<el-main>
|
|
<el-radio-group v-model="isCollapse" style="margin-bottom: 20px">
|
|
<el-radio-button @click="toggleSideBar">expand</el-radio-button>
|
|
</el-radio-group>
|
|
</el-main>
|
|
</el-container>
|
|
</el-container>
|
|
|
|
<!--
|
|
<img src="./assets/logo.png">
|
|
<nav>
|
|
<router-link to="/">Home</router-link> |
|
|
<router-link to="/about">About</router-link>
|
|
</nav>
|
|
<router-view />
|
|
-->
|
|
</template>
|
|
|
|
<script>
|
|
// @ is an alias to /src
|
|
import SideBar from '@/components/SideBar.vue'
|
|
import TopBar from './components/TopBar.vue'
|
|
|
|
export default {
|
|
name: 'App',
|
|
components: {
|
|
SideBar,
|
|
TopBar
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
@import 'normalize.css/normalize.css';
|
|
|
|
html,
|
|
body,
|
|
#app,
|
|
.container {
|
|
height: 100%;
|
|
}
|
|
|
|
#app {
|
|
text-align: center;
|
|
}
|
|
|
|
.el-header {
|
|
padding: 0;
|
|
border: 0;
|
|
}
|
|
</style>
|