合并画布代码

src/component/Canvas/CanvasEditor/utils/layerHelper.js

@@ -13,6 +13,7 @@ export const LayerType = {
   VIDEO: "video", // 视频图层 (预留)
   AUDIO: "audio", // 音频图层 (预留)
   FIXED: "fixed", // 固定图层 - 位于背景图层之上，普通图层之下
+  BACKGROUND: "background", // 背景图层 - 位于固定图层之、普通图层之下
 };
 
 /**
@@ -461,3 +462,161 @@ export function cloneLayer(layer) {
 
   return clonedLayer;
 }
+
+/**
+ * 递归查找图层（包括子图层）
+ * @param {Array} layers 图层数组
+ * @param {string} layerId 要查找的图层ID
+ * @param {Object} parent 父图层（可选，用于内部递归）
+ * @returns {Object|null} 包含layer和parent的对象，如果未找到返回null
+ */
+export function findLayerRecursively(layers, layerId, parent = null) {
+  if (!layers || !Array.isArray(layers) || !layerId) {
+    return null;
+  }
+
+  // 在当前图层列表中查找
+  for (const layer of layers) {
+    if (layer && layer.id === layerId) {
+      return { layer, parent };
+    }
+
+    // 如果是组图层，递归查找子图层
+    if (
+      layer &&
+      (layer.type === "group" ||
+        layer.type === LayerType.GROUP ||
+        (layer.children && Array.isArray(layer.children)))
+    ) {
+      const result = findInChildLayers(layer.children, layerId, layer);
+      if (result) {
+        return result;
+      }
+    }
+  }
+
+  return null;
+}
+
+/**
+ * 在子图层中递归查找
+ * @param {Array} children 子图层数组
+ * @param {string} layerId 要查找的图层ID
+ * @param {Object} parent 父图层
+ * @returns {Object|null} 包含layer和parent的对象，如果未找到返回null
+ */
+export function findInChildLayers(children, layerId, parent) {
+  if (!children || !Array.isArray(children) || !layerId) {
+    return null;
+  }
+
+  for (const child of children) {
+    if (child && child.id === layerId) {
+      return { layer: child, parent };
+    }
+
+    // 如果子图层也是组，继续递归查找
+    if (
+      child &&
+      (child.type === "group" || child.type === LayerType.GROUP) &&
+      child.children &&
+      Array.isArray(child.children)
+    ) {
+      const result = findInChildLayers(child.children, layerId, child);
+      if (result) {
+        return result;
+      }
+    }
+  }
+
+  return null;
+}
+
+/**
+ * 简单查找图层（仅在顶级图层中查找，不递归子图层）
+ * @param {Array} layers 图层数组
+ * @param {string} layerId 要查找的图层ID
+ * @returns {Object|null} 找到的图层对象，如果未找到返回null
+ */
+export function findLayer(layers, layerId) {
+  if (!layers || !Array.isArray(layers) || !layerId) {
+    return null;
+  }
+
+  return layers.find((layer) => layer && layer.id === layerId) || null;
+}
+
+/**
+ * 根据图层名称查找图层
+ * @param {Array} layers 图层数组
+ * @param {string} layerName 要查找的图层名称
+ * @param {boolean} recursive 是否递归查找子图层，默认false
+ * @returns {Object|null} 找到的图层对象，如果未找到返回null
+ */
+export function findLayerByName(layers, layerName, recursive = false) {
+  if (!layers || !Array.isArray(layers) || !layerName) {
+    return null;
+  }
+
+  for (const layer of layers) {
+    if (layer && layer.name === layerName) {
+      return layer;
+    }
+
+    // 如果需要递归查找且是组图层
+    if (
+      recursive &&
+      layer &&
+      (layer.type === "group" ||
+        layer.type === LayerType.GROUP ||
+        (layer.children && Array.isArray(layer.children)))
+    ) {
+      const found = findLayerByName(layer.children, layerName, true);
+      if (found) {
+        return found;
+      }
+    }
+  }
+
+  return null;
+}
+
+/**
+ * 获取图层的完整路径（包含父图层信息）
+ * @param {Array} layers 图层数组
+ * @param {string} layerId 要查找的图层ID
+ * @returns {Array} 图层路径数组，从根图层到目标图层
+ */
+export function getLayerPath(layers, layerId) {
+  if (!layers || !Array.isArray(layers) || !layerId) {
+    return [];
+  }
+
+  function findPath(currentLayers, targetId, currentPath = []) {
+    for (const layer of currentLayers) {
+      if (!layer) continue;
+
+      const newPath = [...currentPath, layer];
+
+      if (layer.id === targetId) {
+        return newPath;
+      }
+
+      // 如果是组图层，递归查找
+      if (
+        layer.type === "group" ||
+        layer.type === LayerType.GROUP ||
+        (layer.children && Array.isArray(layer.children))
+      ) {
+        const foundPath = findPath(layer.children, targetId, newPath);
+        if (foundPath.length > 0) {
+          return foundPath;
+        }
+      }
+    }
+
+    return [];
+  }
+
+  return findPath(layers, layerId);
+}