feat(admin-ui): add RuoYi layout menu primitives

2026-08-26 20:46:05 +08:00
1 parent 0b106a3dd2
commit 3c8c6490fd
@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import type { LayoutIconName } from "@/lib/menu-display";
+
+withDefaults(defineProps<{
+  name: LayoutIconName;
+  size?: number | string;
+  title?: string;
+}>(), {
+  size: 24,
+});
+</script>
+
+<template>
+  <svg
+    :width="size"
+    :height="size"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="1.8"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    focusable="false"
+    :aria-hidden="title ? undefined : true"
+    :aria-label="title"
+    role="img"
+  >
+    <title v-if="title">{{ title }}</title>
+    <path v-if="name === 'Menu'" d="M4 6h16M4 12h16M4 18h16" />
+    <path v-else-if="name === 'Grid'" d="M4 4h6v6H4zM14 4h6v6h-6zM4 14h6v6H4zM14 14h6v6h-6z" />
+    <path v-else-if="name === 'Route'" d="M5 5h.01M5 19h.01M19 5h.01M7 5h5a3 3 0 0 1 3 3v8a3 3 0 0 0 3 3h1M5 7v10" />
+    <path v-else-if="name === 'User'" d="M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8ZM4 21a8 8 0 0 1 16 0" />
+    <path v-else-if="name === 'Collection'" d="M4 5h16v14H4zM8 5v14M8 9h12M8 14h12" />
+    <path v-else-if="name === 'Setting'" d="m12 3 1.2 2.4 2.6.4.9 2.5 2.2 1.5-.9 2.5.9 2.5-2.2 1.5-.9 2.5-2.6.4L12 21l-1.2-2.4-2.6-.4-.9-2.5-2.2-1.5.9-2.5-.9-2.5 2.2-1.5.9-2.5 2.6-.4zM12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
+    <path v-else-if="name === 'Search'" d="m20 20-4.5-4.5M10.5 17a6.5 6.5 0 1 1 0-13 6.5 6.5 0 0 1 0 13Z" />
+    <path v-else-if="name === 'FullScreen'" d="M8 4H4v4M16 4h4v4M20 16v4h-4M4 16v4h4" />
+    <path v-else-if="name === 'Moon'" d="M20 15.5A8.5 8.5 0 0 1 8.5 4 8.5 8.5 0 1 0 20 15.5Z" />
+    <path v-else-if="name === 'Sunny'" d="M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6 7 7M17 17l1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Z" />
+    <path v-else-if="name === 'Refresh'" d="M20 11a8 8 0 0 0-14.8-3L3 11M3 5v6h6M4 13a8 8 0 0 0 14.8 3L21 13M21 19v-6h-6" />
+    <path v-else-if="name === 'Close'" d="m6 6 12 12M18 6 6 18" />
+    <path v-else-if="name === 'More'" d="M5 12h.01M12 12h.01M19 12h.01" stroke-width="3" />
+    <path v-else-if="name === 'Back'" d="m15 18-6-6 6-6M9 12h10" />
+    <path v-else-if="name === 'Right'" d="m9 6 6 6-6 6M5 12h10" />
+    <path v-else-if="name === 'Chevron'" d="m8 9 4 4 4-4" />
+  </svg>
+</template>