1

app/src/store/useLayoutStore.ts

@@ -1,6 +1,7 @@
 import { defineStore, acceptHMRUpdate } from 'pinia';
 
 type IconSize = '1x1' | '1x2' | '2x1' | '2x2' | '2x4';
+const DEFAULT_GROUP_ID = 'home';
 
 // 模拟数据（来自截图参考）
 interface Icon {
@@ -11,6 +12,7 @@ interface Icon {
   img?: string; // 可选：用于图片图标（如徽标）
   text?: string; // 可选：用于文字图标
   bgColor?: string; // 可选：纯色背景
+  groupId?: string;
 }
 
 interface DragState {
@@ -47,10 +49,33 @@ const defaultIcons: Icon[] = [
   { id: '16', name: '书签管理', url: '#', bgColor: '#f1c40f' },
 ];
 
+const defaultGroupById: Record<string, string> = {
+  '1': 'product',
+  '2': 'product',
+  '3': 'home',
+  '4': 'product',
+  '5': 'fun',
+  '6': 'home',
+  '7': 'fun',
+  '8': 'fun',
+  '9': 'ai',
+  '10': 'fun',
+  '11': 'design',
+  '12': 'design',
+  '13': 'ai',
+  '14': 'code',
+  '15': 'home',
+  '16': 'home',
+};
+
 const savedIcons = localStorage.getItem('itab_icons');
 
 const normalizeIcons = (icons: Icon[]): Icon[] =>
-  icons.map(icon => ({ ...icon, size: icon.size ?? '1x1' }));
+  icons.map(icon => ({
+    ...icon,
+    size: icon.size ?? '1x1',
+    groupId: icon.groupId ?? defaultGroupById[icon.id] ?? DEFAULT_GROUP_ID,
+  }));
 
 const loadIcons = (): Icon[] => {
   if (!savedIcons) return normalizeIcons(defaultIcons);
@@ -77,7 +102,7 @@ export const useLayoutStore = defineStore('layout', {
   actions: {
     addIcon(icon: Omit<Icon, 'id'>) {
       const nextId = `custom-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`;
-      this.icons.push({ ...icon, id: nextId });
+      this.icons.push({ ...icon, id: nextId, groupId: icon.groupId ?? DEFAULT_GROUP_ID });
       localStorage.setItem('itab_icons', JSON.stringify(this.icons));
     },
     updateIcon(iconId: string, updates: Partial<Omit<Icon, 'id'>>) {