feat: Refactor code structure for improved readability and maintainability

src/components/diagramManager.ts

@@ -18,8 +18,9 @@ export interface DiagramPart {
   rotate: number;
   group: string;
   positionlock: boolean;
-  hide: boolean;
+  hidepins: boolean;
   isOn: boolean;
+  index?: number; // 显示层级，数值越大显示越靠前
 }
 
 // 连接类型定义 - 使用元组类型表示四元素数组
@@ -170,17 +171,38 @@ export function updatePartAttribute(
   };
 }
 
-// 删除组件
+// 删除组件及同组组件
 export function deletePart(data: DiagramData, partId: string): DiagramData {
+  // 首先找到要删除的组件
+  const component = data.parts.find(part => part.id === partId);
+  if (!component) return data;
+
+  // 收集需要删除的组件ID列表
+  const componentsToDelete: string[] = [partId];
+  
+  // 如果组件属于一个组，则找出所有同组的组件
+  if (component.group && component.group !== '') {
+    const groupMembers = data.parts.filter(
+      p => p.group === component.group && p.id !== partId
+    );
+    
+    // 将同组组件ID添加到删除列表
+    componentsToDelete.push(...groupMembers.map(p => p.id));
+    console.log(`删除组件 ${partId} 及其组 ${component.group} 中的 ${groupMembers.length} 个组件`);
+  }
+  
   return {
     ...data,
-    parts: data.parts.filter(part => part.id !== partId),
-    // 同时删除与此组件相关的所有连接
+    // 删除所有标记的组件
+    parts: data.parts.filter(part => !componentsToDelete.includes(part.id)),
+    // 删除与这些组件相关的所有连接
     connections: data.connections.filter(conn => {
       const [startPin, endPin] = conn;
       const startCompId = startPin.split(':')[0];
       const endCompId = endPin.split(':')[0];
-      return startCompId !== partId && endCompId !== partId;
+      
+      // 检查连接两端的组件是否在删除列表中
+      return !componentsToDelete.includes(startCompId) && !componentsToDelete.includes(endCompId);
     })
   };
 }