From c482628d3daf21dafba7e2b9eaba6e46ffda0fdb Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期四, 27 二月 2025 20:11:14 +0800
Subject: [PATCH] 首页跳转bug

---
 src/layout/index.vue |  150 +++++++++++++++++++++++++++++---------------------
 1 files changed, 87 insertions(+), 63 deletions(-)

diff --git a/src/layout/index.vue b/src/layout/index.vue
index dba4393..a4542d5 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,18 +1,36 @@
 <template>
-  <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
-    <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
-    <sidebar v-if="!sidebar.hide" class="sidebar-container"/>
-    <div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
-      <div :class="{'fixed-header':fixedHeader}">
-        <navbar/>
-        <tags-view v-if="needTagsView"/>
-      </div>
-      <app-main/>
-      <right-panel>
-        <settings/>
-      </right-panel>
+    <div
+        :class="classObj"
+        class="app-wrapper"
+        :style="{ '--current-color': theme }"
+    >
+        <div
+            v-if="device === 'mobile' && sidebar.opened"
+            class="drawer-bg"
+            @click="handleClickOutside"
+        />
+        <navbar ref="navbarRef" @set-layout="setLayout" />
+
+        <div
+            :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }"
+            class="main-container"
+        >
+            <!-- <el-scrollbar>
+        <div :class="{ 'fixed-header': fixedHeader }">
+          <navbar ref="navbarRef" @setLayout="setLayout" />
+          <tags-view v-if="needTagsView" />
+        </div>
+        <app-main />
+        <settings ref="settingRef" />
+      </el-scrollbar> -->
+            <side-bar v-if="!sidebar.hide" class="sidebar-container" />
+            <div :class="{ 'fixed-header': fixedHeader }">
+                <tags-view v-if="needTagsView" />
+            </div>
+            <app-main />
+            <settings ref="settingRef" />
+        </div>
     </div>
-  </div>
 </template>
 
 <script>
@@ -21,64 +39,70 @@
 import ResizeMixin from './mixin/ResizeHandler'
 import { mapState } from 'vuex'
 import variables from '@/assets/styles/variables.scss'
+import SideBar from './components/Sidebar/index.vue';
 
 export default {
-  name: 'Layout',
-  components: {
-    AppMain,
-    Navbar,
-    RightPanel,
-    Settings,
-    Sidebar,
-    TagsView
-  },
-  mixins: [ResizeMixin],
-  computed: {
-    ...mapState({
-      theme: state => state.settings.theme,
-      sideTheme: state => state.settings.sideTheme,
-      sidebar: state => state.app.sidebar,
-      device: state => state.app.device,
-      needTagsView: state => state.settings.tagsView,
-      fixedHeader: state => state.settings.fixedHeader
-    }),
-    classObj() {
-      return {
-        hideSidebar: !this.sidebar.opened,
-        openSidebar: this.sidebar.opened,
-        withoutAnimation: this.sidebar.withoutAnimation,
-        mobile: this.device === 'mobile'
-      }
+    name: 'Layout',
+    components: {
+        AppMain,
+        Navbar,
+        RightPanel,
+        Settings,
+        Sidebar,
+        TagsView,
+        SideBar
     },
-    variables() {
-      return variables;
+    mixins: [ResizeMixin],
+    computed: {
+        ...mapState({
+            theme: state => state.settings.theme,
+            sideTheme: state => state.settings.sideTheme,
+            sidebar: state => state.app.sidebar,
+            device: state => state.app.device,
+            needTagsView: state => state.settings.tagsView,
+            fixedHeader: state => state.settings.fixedHeader
+        }),
+        classObj() {
+            return {
+                hideSidebar: !this.sidebar.opened,
+                openSidebar: this.sidebar.opened,
+                withoutAnimation: this.sidebar.withoutAnimation,
+                mobile: this.device === 'mobile'
+            }
+        },
+        variables() {
+            return variables;
+        }
+    },
+    methods: {
+        setLayout() {
+            this.settingRef.value?.openSetting();
+        },
+        handleClickOutside() {
+            this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
+            
+        }
     }
-  },
-  methods: {
-    handleClickOutside() {
-      this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
-    }
-  }
 }
 </script>
 
 <style lang="scss" scoped>
-  @import "~@/assets/styles/mixin.scss";
-  @import "~@/assets/styles/variables.scss";
+@import '~@/assets/styles/mixin.scss';
+@import '~@/assets/styles/variables.scss';
 
-  .app-wrapper {
+.app-wrapper {
     @include clearfix;
     position: relative;
     height: 100%;
     width: 100%;
 
     &.mobile.openSidebar {
-      position: fixed;
-      top: 0;
+        position: fixed;
+        top: 0;
     }
-  }
+}
 
-  .drawer-bg {
+.drawer-bg {
     background: #000;
     opacity: 0.3;
     width: 100%;
@@ -86,26 +110,26 @@
     height: 100%;
     position: absolute;
     z-index: 999;
-  }
+}
 
-  .fixed-header {
+.fixed-header {
     position: fixed;
     top: 0;
     right: 0;
     z-index: 9;
     width: calc(100% - #{$base-sidebar-width});
     transition: width 0.28s;
-  }
+}
 
-  .hideSidebar .fixed-header {
+.hideSidebar .fixed-header {
     width: calc(100% - 54px);
-  }
+}
 
-  .sidebarHide .fixed-header {
+.sidebarHide .fixed-header {
     width: 100%;
-  }
+}
 
-  .mobile .fixed-header {
+.mobile .fixed-header {
     width: 100%;
-  }
+}
 </style>

--
Gitblit v1.8.0