mirror of
https://github.com/zclzone/vue-naive-admin.git
synced 2026-01-22 23:50:22 +08:00
43 lines
1.0 KiB
Vue
43 lines
1.0 KiB
Vue
<!--------------------------------
|
|
- @Author: Ronnie Zhang
|
|
- @LastEditor: Ronnie Zhang
|
|
- @LastEditTime: 2023/12/16 18:51:02
|
|
- @Email: zclzone@outlook.com
|
|
- Copyright © 2023 Ronnie Zhang(大脸怪) | https://isme.top
|
|
--------------------------------->
|
|
|
|
<template>
|
|
<div class="wh-full flex">
|
|
<aside
|
|
class="flex-col flex-shrink-0 transition-width-300"
|
|
:class="appStore.collapsed ? 'w-64' : 'w-220'"
|
|
border-r="1px solid light_border dark:dark_border"
|
|
>
|
|
<SideBar />
|
|
</aside>
|
|
|
|
<article class="w-0 flex-col flex-1">
|
|
<AppHeader class="h-60 flex-shrink-0" />
|
|
<div class="p-12" border-b="1px solid light_border dark:dark_border">
|
|
<AppTab class="flex-shrink-0" />
|
|
</div>
|
|
<slot />
|
|
</article>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { AppTab } from '@/layouts/components'
|
|
import { useAppStore } from '@/store'
|
|
import AppHeader from './header/index.vue'
|
|
import SideBar from './sidebar/index.vue'
|
|
|
|
const appStore = useAppStore()
|
|
</script>
|
|
|
|
<style>
|
|
.collapsed {
|
|
width: 64px;
|
|
}
|
|
</style>
|