birt
2025-04-13 9888eb4278a2c74f8533b468bba958cfffb7b125
zhitan-vue/src/layout/index.vue
@@ -9,7 +9,7 @@
              <img v-if="sideTheme === 'theme-dark'" :src="systemInfo.leftLogo" class="sidebar-logo" />
              <img v-else :src="systemInfo.leftLogo" class="sidebar-logo" />
            </div>
            <div class="name" v-if="sidebar.opened" :style="{ color: '#fff' }">
            <div class="name" v-if="sidebar.opened" :style="{ color: sideTheme === 'theme-dark' ? '#fff' : '#333' }">
              {{ title }}
            </div>
          </div>
@@ -91,8 +91,8 @@
// 打开AI大模型对话框
function openAIModel() {
  // 这里可以实现打开AI对话框的逻辑
  console.log('打开AI大模型对话框')
  // 跳转到指定的URL
  window.open('https://deepseek.tan-zhonghe.com/chat', '_blank')
}
const classObj = computed(() => ({
@@ -119,21 +119,25 @@
// 监听路由变化,处理首页的侧边栏显示
watchEffect(() => {
  // 检查是否是首页路由
  if (route.path === '/index' || route.path === '/') {
  // 检查是否是首页路由,但排除/index/index子路由
  if ((route.path === '/index' || route.path === '/') && route.path !== '/index/index') {
    // 首页路由,确保侧边栏不隐藏,但状态是折叠的
    appStore.showCollapsedSidebar()
    appStore.toggleSideBarHide(false) // 改为不隐藏侧边栏
  } else if (route.meta && route.meta.showSidebar === false) {
    // 如果路由明确指定隐藏侧边栏
    appStore.toggleSideBarHide(true)
  } else {
    // 其他路由,确保侧边栏可见
    appStore.toggleSideBarHide(false)
  }
})
// 组件挂载时,确保首页侧边栏状态正确
onMounted(() => {
  // 如果当前是首页,确保侧边栏是折叠的而不是隐藏的
  if (route.path === '/index' || route.path === '/') {
    appStore.showCollapsedSidebar()
  // 如果当前是首页,确保侧边栏可见
  if (route.path === '/index/index') {
    appStore.toggleSideBarHide(false)
    appStore.sidebar.opened = true
  }
})
@@ -351,47 +355,12 @@
}
.themeDark {
  .navbar-container {
    background: #1a235d;
    border-bottom: 2px solid #110f2e;
  }
  .navbar {
    background: transparent !important;
    background: #002866 !important;
  }
  
  .sidebar-container {
    background-color: #002866 !important;
  }
}
.themeLight {
  .navbar-container {
    background: #3883FA;
  }
  .navbar {
    background: transparent !important;
    .left {
      .sidebar-logo-container {
        .name {
          color: #fff !important;
        }
      }
    }
    .right {
      .right-menu {
        .right-menu-item {
          color: #fff;
          .right-menu-icon {
            color: #fff;
          }
        }
      }
    }
  }
}
</style>