UA 整理提交

he wei

2025-04-23 b9bd29a1a81f6f7de479e3cc3fdfe3d85fc660bf

 src/layout/components/Sidebar/index.vue

@@ -1,11 +1,25 @@
<template>
  <div :class="{ 'has-logo': showLogo }">
  <div :class="['hh', { 'has-logo': showLogo }]" style="font-size: 14px">
    <logo v-if="showLogo" :collapse="false" />
    <el-scrollbar wrap-class="scrollbar-wrapper">
      <el-menu class="left-menu" :default-active="activeMenu" :collapse="false"
        :background-color="variables.menuBg" :text-color="variables.menuText" :unique-opened="false"
        :active-text-color="variables.menuActiveText" :collapse-transition="false" mode="vertical">
        <sidebar-item v-for="route in permission_routes" :key="route.path" :item="route" :base-path="route.path" :is-top-route="true" />
      <el-menu
        class="left-menu"
        :default-active="activeMenu"
        :collapse="false"
        :background-color="variables.menuBg"
        :text-color="variables.menuText"
        :unique-opened="false"
        :active-text-color="variables.menuActiveText"
        :collapse-transition="false"
        mode="vertical"
      >
        <sidebar-item
          v-for="route in permission_routes"
          :key="route.path"
          :item="route"
          :base-path="route.path"
          :is-top-route="true"
        />
      </el-menu>
    </el-scrollbar>
  </div>
@@ -17,35 +31,26 @@
import Logo from './Logo';
import SidebarItem from './SidebarItem';
// import variables from '@/styles/variables.modules.scss';
import useAppStore from '@/store/app';
import usePromissionStore from '@/store/permission';
import useSettingsStore from '@/store/settings';
import { useAppStore } from '@/store/app';
import { usePermissionStore } from '@/store/permission';
import { useSettingsStore } from '@/store/settings';
import { useRoute, useRouter } from 'vue-router';
const route = useRoute();
const router = useRouter();

const settingsStore = useSettingsStore();
const appStore = useAppStore();
const permissionStore = usePromissionStore();
const permissionStore = usePermissionStore();
const { sidebar } = storeToRefs(appStore);
const { permission_routes: routes } = storeToRefs(permissionStore);
const { routes: permission_routes } = storeToRefs(permissionStore);
const { secondMenuPopup, sidebarLogo: showLogo } = storeToRefs(settingsStore);
const { toggleSidebar } = appStore;

const veriables = reactive()({
  menuBg: '#304156',
  menuText: '#fff',
  menuActiveText: '#409EFF'
const variables = reactive({
   menuBg: '#304156',
   menuText: '#fff',
   menuActiveText: '#409EFF'
});

watch(
  () => activeMenu.value,
  () => {
    if (isCollapse.value) {
      toggleSidebar();
    }
  }
);

const activeMenu = computed(() => {
  const { meta, path } = route;
@@ -56,10 +61,20 @@
  return path;
});

watch(
   () => activeMenu.value,
   () => {
      if (isCollapse.value) {
         toggleSidebar();
      }
   }
);


const isCollapse = computed(() => {
  if (secondMenuPopup.value) {
    return true;
  }
  return !sidebar.value.opened;
   if (secondMenuPopup.value) {
      return true;
   }
   return !sidebar.value.opened;
});
</script>