loulijun2021
2023-03-15 5c133dd7c3b9e1787dcd3be4f0f578a9d8bef540
src/layout/index.vue
@@ -1,8 +1,29 @@
<template>
  <div :class="classObj" class="app-wrapper">
    <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
    <!--    <sidebar-->
    <!--      :class="$store.state.settings.menuIsHorizontal?-->
    <!--        'sidebar-container-sideBarWidthIsMenuHorizontal':-->
    <!--        !$store.state.settings.leftBackgroundColorValue&&sidebar.opened?-->
    <!--          'sidebar-container-leftBackgroundColorValue':-->
    <!--          'sidebar-container'"-->
    <!--    />-->
    <!--1.当为横向菜单时-->
    <sidebar
      :class="$store.state.settings.menuIsHorizontal?'sidebar-container-sideBarWidthIsMenuHorizontal':'sidebar-container'"
      v-if="$store.state.settings.menuIsHorizontal"
      class="sidebar-container-sideBarWidthIsMenuHorizontal"
    />
    <!--    2.当为竖向菜单且为深色背景色时-->
    <sidebar
      v-else-if="!$store.state.settings.menuIsHorizontal&&$store.state.settings.leftBackgroundColorValue"
      class="sidebar-container"
    />
    <!--    3.当为竖向菜单且为浅色背景色时-->
    <sidebar
      v-else-if="!$store.state.settings.menuIsHorizontal&&!$store.state.settings.leftBackgroundColorValue"
      :class="sidebar.opened?'sidebar-container-leftBackgroundColorValue':'sidebar-container sidebarContainer'"
    />
    <div
      :class="$store.state.settings.menuIsHorizontal?'main-container-sideBarWidthIsMenuHorizontal': 'main-container'"
@@ -74,6 +95,10 @@
//@import "~@/styles/element-variables.scss";
.sidebarContainer {
  background-color: #f8f8fa !important;
}
.app-wrapper {
  @include clearfix;
  position: relative;