2025-11-11 09:54:39 +08:00

49 lines
1.2 KiB
Vue

<script setup lang="ts">
import { reactive, computed } from "vue";
import LayoutHeader from "./Header/index.vue";
import LayoutSider from "./Sider/index.vue";
import LayoutContent from "./Content/index.vue";
import { router } from "@/router/index.ts";
import { inject } from "vue";
import bgImg from "@/assets/images/index/bg.jpg";
const data = reactive({
loading: true,
});
</script>
<template>
<a-layout class="system-layout">
<layout-header></layout-header>
<a-layout>
<layout-sider v-model:contentLoading="data.loading"> </layout-sider>
<layout-content v-model:contentLoading="data.loading"> </layout-content>
</a-layout>
</a-layout>
</template>
<style lang="scss" scoped>
.system-layout {
width: 100%;
height: 100vh;
position: relative;
background:
linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)),
url(@/assets/images/index/bg.jpg) no-repeat center center;
background-size: cover;
:deep(.ant-layout) {
background: transparent;
}
&_header {
}
&_content {
// padding-top: 80px;
box-sizing: border-box;
height: 100%;
width: 100%;
// position: relative;
// z-index: 0;
}
}
</style>