feat(admin-ui): implement RuoYi sidebar shell

WonderQ-Admin-UI-Vue/src/components/layout/SidebarItem.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import LayoutIcon from "@/components/layout/LayoutIcon.vue";
+import { getMenuIconName } from "@/lib/menu-display";
+import type { NavigationType } from "@/lib/layout-settings";
+import type { AdminMenu } from "@/types";
+
+type SidebarMenu = AdminMenu & { isVisible?: boolean };
+
+withDefaults(defineProps<{
+  menu: SidebarMenu;
+  basePath?: string;
+  collapsed?: boolean;
+  navigationType?: NavigationType;
+}>(), {
+  basePath: "",
+  collapsed: false,
+  navigationType: "left",
+});
+</script>
+
+<template>
+  <el-sub-menu
+    v-if="menu.type === 'directory'"
+    :index="menu.path || menu.id"
+    :aria-label="menu.name"
+    :class="['sidebar-item', `sidebar-item--${navigationType}`]"
+  >
+    <template #title>
+      <el-tooltip :content="menu.name" :disabled="!collapsed" placement="right">
+        <span class="sidebar-item__content">
+          <LayoutIcon :name="getMenuIconName(menu)" :title="collapsed ? menu.name : undefined" size="18" />
+          <span v-if="!collapsed" class="sidebar-item__label">{{ menu.name }}</span>
+        </span>
+      </el-tooltip>
+    </template>
+    <SidebarItem
+      v-for="child in menu.children || []"
+      :key="child.id"
+      :menu="child"
+      :base-path="basePath"
+      :collapsed="collapsed"
+      :navigation-type="navigationType"
+    />
+  </el-sub-menu>
+
+  <el-menu-item
+    v-else-if="menu.type === 'page' && menu.path"
+    :index="menu.path"
+    :aria-label="menu.name"
+    :class="['sidebar-item', `sidebar-item--${navigationType}`]"
+  >
+    <el-tooltip :content="menu.name" :disabled="!collapsed" placement="right">
+      <span class="sidebar-item__content">
+        <LayoutIcon :name="getMenuIconName(menu)" :title="collapsed ? menu.name : undefined" size="18" />
+        <span v-if="!collapsed" class="sidebar-item__label">{{ menu.name }}</span>
+      </span>
+    </el-tooltip>
+  </el-menu-item>
+</template>