顶部导航栏与标签页固定

ruoyi-ui/src/assets/styles/index.scss

@@ -176,3 +176,20 @@ aside {
     margin-bottom: 10px;
   }
 }
+
+// 固定导航栏
+.fixed-header {
+  position: fixed;
+  top: 0;
+  right: 0;
+  // left: 0;
+  width: 100%;
+  z-index: 999;
+  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+}
+
+// 调整内容区域位置（防止被导航栏遮挡）
+.app-main {
+  padding-top: 78px; // 根据导航栏实际高度调整
+  min-height: calc(100vh - 78px); // 保持高度正确
+}

ruoyi-ui/src/layout/components/Navbar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="navbar">
+  <div class="navbar fixed-header">
     <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
 
     <breadcrumb v-if="!topNav" id="breadcrumb-container" class="breadcrumb-container" />

ruoyi-ui/src/layout/components/TagsView/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="tags-view-container" class="tags-view-container">
+  <div id="tags-view-container" class="tags-view-container fixed-tags">
     <scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll">
       <router-link
         v-for="tag in visitedViews"
@@ -240,6 +240,31 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+/* 添加固定定位样式 */
+.tags-view-container.fixed-tags {
+  position: fixed;
+  top: 44px; /* 导航栏高度 */
+  right: 0;
+  left: 200px; /* 侧边栏宽度 */
+  z-index: 998; /* 低于导航栏 */
+  height: 34px; /* 标签页高度 */
+  transition: left 0.28s;
+}
+
+/* 侧边栏收起时的样式 */
+.hideSidebar .tags-view-container.fixed-tags {
+  left: 54px;
+}
+
+/* 侧边栏隐藏时的样式 */
+.sidebarHide .tags-view-container.fixed-tags {
+  left: 0;
+}
+
+/* 移动端样式 */
+.mobile .tags-view-container.fixed-tags {
+  left: 0;
+}
 .tags-view-container {
   height: 32px;
   width: 100%;