feat(ui): implement dashboard layout and refactor pages

This commit replaces the previous simple layout with a comprehensive dashboard interface using Nuxt UI Pro components.

- Introduced a new default layout with `UDashboardSidebar` and `UDashboardPanel`.
- Refactored the main page (`index.vue`) by splitting it into `ItemManageStatistics` and `ItemManageTable` components.
- Added new computed stats for monthly growth and total images, and displayed them in new statistic cards.
- Reorganized components from `item/` to a new `itemManage/` directory.
- Added custom primary and secondary theme colors.

app/layouts/default.vue

@@ -1,29 +1,38 @@
 <template>
   <div>
-    <!-- 导航栏 -->
-    <UHeader>
-      <template #title>物品数据库</template>
+    <UDashboardGroup>
+      <UDashboardSidebar id="default" :open="sidebarOpen" collapsible resizable>
+        <template #header="{ collapsed }">
+          <div class="font-bold flex items-center">
+            <span class="ml-2" v-if="!collapsed">物品数据库</span>
+          </div>
+        </template>
 
-      <UNavigationMenu :items="items" />
-
-      <template #right>
-        <UColorModeButton />
-
-        <UTooltip text="Open on GitHub" :kbds="['meta', 'G']">
-          <UButton
-            color="neutral"
-            variant="ghost"
-            to="https://github.com/nuxt/ui"
-            target="_blank"
-            icon="i-simple-icons-github"
-            aria-label="GitHub"
+        <template #default="{ collapsed }">
+          <UDashboardSearchButton
+            :collapsed="collapsed"
+            icon="mdi:magnify"
+            class="bg-transparent ring-default"
           />
-        </UTooltip>
-      </template>
-    </UHeader>
 
-    <!-- 页面内容插槽 -->
-    <slot />
+          <UNavigationMenu
+            :collapsed="collapsed"
+            :items="items"
+            orientation="vertical"
+            tooltip
+            popover
+          />
+        </template>
+
+        <template #footer="{ collapsed }">
+          <UColorModeButton />
+        </template>
+      </UDashboardSidebar>
+
+      <UDashboardSearch :groups="groups" />
+
+      <slot />
+    </UDashboardGroup>
   </div>
 </template>
 
@@ -32,6 +41,9 @@ import type { NavigationMenuItem } from "@nuxt/ui";
 
 const route = useRoute();
 
+const sidebarOpen = ref(false);
+const groups = ref([]);
+
 const items = computed<NavigationMenuItem[]>(() => [
   {
     label: "物品管理",

app/layouts/normal.vue

@@ -0,0 +1,54 @@
+<template>
+  <div>
+    <!-- 导航栏 -->
+    <UHeader>
+      <template #title>物品数据库</template>
+
+      <UNavigationMenu :items="items" />
+
+      <template #right>
+        <UColorModeButton />
+
+        <UTooltip text="Open on GitHub" :kbds="['meta', 'G']">
+          <UButton
+            color="neutral"
+            variant="ghost"
+            to="https://github.com/nuxt/ui"
+            target="_blank"
+            icon="i-simple-icons-github"
+            aria-label="GitHub"
+          />
+        </UTooltip>
+      </template>
+    </UHeader>
+
+    <!-- 页面内容插槽 -->
+    <slot />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { NavigationMenuItem } from "@nuxt/ui";
+
+const route = useRoute();
+
+const items = computed<NavigationMenuItem[]>(() => [
+  {
+    label: "物品管理",
+    to: "/",
+    icon: "marketeq:box",
+  },
+  {
+    label: "导出配置",
+    to: "/export",
+    active: route.path.startsWith("/export"),
+    icon: "marketeq:export-2",
+  },
+  {
+    label: "历史记录",
+    to: "/history",
+    active: route.path.startsWith("/history"),
+    icon: "marketeq:chart-line-alt-1",
+  },
+]);
+</script>