|
@@ -33,14 +33,12 @@ import {
|
|
|
computed,
|
|
|
onMounted,
|
|
|
watchEffect,
|
|
|
- useCssModule,
|
|
|
onBeforeMount,
|
|
|
getCurrentInstance
|
|
|
} from "vue";
|
|
|
import { setType } from "./types";
|
|
|
import { useI18n } from "vue-i18n";
|
|
|
import { emitter } from "/@/utils/mitt";
|
|
|
-import { toggleClass } from "/@/utils/operate";
|
|
|
import { useEventListener } from "@vueuse/core";
|
|
|
import { storageLocal } from "/@/utils/storage";
|
|
|
import { useAppStoreHook } from "/@/store/modules/app";
|
|
@@ -56,7 +54,6 @@ import Vertical from "./components/sidebar/vertical.vue";
|
|
|
import Horizontal from "./components/sidebar/horizontal.vue";
|
|
|
|
|
|
const pureSetting = useSettingStoreHook();
|
|
|
-const { hiddenMainContainer } = useCssModule();
|
|
|
|
|
|
const instance =
|
|
|
getCurrentInstance().appContext.app.config.globalProperties.$storage;
|
|
@@ -128,21 +125,9 @@ const $_resizeHandler = () => {
|
|
|
};
|
|
|
|
|
|
function onFullScreen() {
|
|
|
- if (unref(hiddenSideBar)) {
|
|
|
- hiddenSideBar.value = false;
|
|
|
- toggleClass(
|
|
|
- false,
|
|
|
- hiddenMainContainer,
|
|
|
- document.querySelector(".main-container")
|
|
|
- );
|
|
|
- } else {
|
|
|
- hiddenSideBar.value = true;
|
|
|
- toggleClass(
|
|
|
- true,
|
|
|
- hiddenMainContainer,
|
|
|
- document.querySelector(".main-container")
|
|
|
- );
|
|
|
- }
|
|
|
+ unref(hiddenSideBar)
|
|
|
+ ? (hiddenSideBar.value = false)
|
|
|
+ : (hiddenSideBar.value = true);
|
|
|
}
|
|
|
|
|
|
onMounted(() => {
|
|
@@ -151,11 +136,6 @@ onMounted(() => {
|
|
|
useAppStoreHook().toggleDevice("mobile");
|
|
|
handleClickOutside(true);
|
|
|
}
|
|
|
- toggleClass(
|
|
|
- unref(hiddenSideBar),
|
|
|
- hiddenMainContainer,
|
|
|
- document.querySelector(".main-container")
|
|
|
- );
|
|
|
});
|
|
|
|
|
|
onBeforeMount(() => {
|
|
@@ -175,7 +155,7 @@ onBeforeMount(() => {
|
|
|
@click="handleClickOutside(false)"
|
|
|
/>
|
|
|
<Vertical v-show="!hiddenSideBar && layout.includes('vertical')" />
|
|
|
- <div class="main-container">
|
|
|
+ <div :class="['main-container', hiddenSideBar ? 'main-hidden' : '']">
|
|
|
<div :class="{ 'fixed-header': set.fixedHeader }">
|
|
|
<!-- 顶部导航栏 -->
|
|
|
<navbar v-show="!hiddenSideBar && layout.includes('vertical')" />
|
|
@@ -196,12 +176,6 @@ onBeforeMount(() => {
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
-<style scoped module>
|
|
|
-.hiddenMainContainer {
|
|
|
- margin-left: 0 !important;
|
|
|
-}
|
|
|
-</style>
|
|
|
-
|
|
|
<style lang="scss" scoped>
|
|
|
@mixin clearfix {
|
|
|
&::after {
|
|
@@ -224,6 +198,10 @@ onBeforeMount(() => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+.main-hidden {
|
|
|
+ margin-left: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
.drawer-bg {
|
|
|
background: #000;
|
|
|
opacity: 0.3;
|