fix: 🐛 折叠/打开侧边栏菜单按钮样式调整

Former-commit-id: 451a2f4b1f7300ab48cd049ceb362b53ea96692b

src/components/Hamburger/index.vue

@@ -30,9 +30,10 @@ function toggleClick() {
 .hamburger {
   vertical-align: middle;
   cursor: pointer;
+  transform: scaleX(-1);
 }
 
 .hamburger.is-active {
-  transform: rotate(180deg);
+  transform: scaleX(1);
 }
 </style>

src/layout/components/Sidebar/Item.vue

@@ -1,3 +1,13 @@
+<template>
+  <i
+    v-if="icon && icon.includes('el-icon')"
+    :class="icon"
+    class="sub-el-icon"
+  ></i>
+  <SvgIcon v-else-if="icon" :icon-class="icon" />
+  <span v-if="title">{{ translateRouteTitle(title) }}</span>
+</template>
+
 <script setup lang="ts">
 import SvgIcon from "@/components/SvgIcon/index.vue";
 import { translateRouteTitle } from "@/utils/i18n";
@@ -12,26 +22,8 @@ const props = defineProps({
     default: "",
   },
 });
-
-const vnodes: any[] = [];
-if (props.icon) {
-  if (props.icon.includes("el-icon")) {
-    vnodes.push(h("i", { class: [props.icon, "sub-el-icon"] }));
-  } else {
-    vnodes.push(h(SvgIcon, { "icon-class": props.icon }));
-  }
-}
-
-if (props.title) {
-  vnodes.push(h("span", { slot: "title" }, translateRouteTitle(props.title)));
-}
-const render = h("div", vnodes);
 </script>
 
-<template>
-  <render />
-</template>
-
 <style scoped>
 .sub-el-icon {
   width: 1em;

src/layout/components/Sidebar/Link.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import { computed } from "vue";
 import { isExternal } from "@/utils/index";
 import { useRouter } from "vue-router";
 

src/layout/components/Sidebar/SidebarItem.vue

@@ -84,7 +84,7 @@ function resolvePath(routePath: string) {
 </script>
 <template>
   <div v-if="!item.meta || !item.meta.hidden">
-    <!-- 无子路由 || 一个子路由（始终显示 alwaysShow = false 情况） -->
+    <!-- 无子路由 || 目录只有一个子路由并配置始终显示为否(alwaysShow=false) -->
     <template
       v-if="
         hasOneShowingChild(item.children, item) &&

src/styles/sidebar.scss

@@ -119,6 +119,19 @@
           margin-left: 19px;
         }
       }
+
+      // TODO
+      & > .svg-icon {
+        margin: 0 auto;
+      }
+
+      & > span {
+        display: inline-block;
+        width: 0;
+        height: 0;
+        overflow: hidden;
+        visibility: hidden;
+      }
     }
 
     .el-sub-menu {