aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

去除画布打印信息

Browse Source
This commit is contained in:
李志鹏
2026-01-19 16:57:11 +08:00
parent 7ff2c2095a
commit 74b43e431b
19 changed files with 273 additions and 294 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
src/component/Canvas/CanvasEditor/managers/LayerManager.js
View File

@@ -149,7 +149,7 @@ export class LayerManager {
*/
initCommandManager() {
// 命令注册逻辑已移除，现在直接使用命令类实例化和执行
console.log("CommandManager 已初始化，使用直接命令调用模式");
// console.log("CommandManager 已初始化，使用直接命令调用模式");
}
/**
@@ -161,7 +161,7 @@ export class LayerManager {
this.layerSort = createLayerSort(this.canvas, this.layers, {
commandManager: this.commandManager,
});
console.log("图层排序工具已初始化");
// console.log("图层排序工具已初始化");
}
}
@@ -180,7 +180,7 @@ export class LayerManager {
// 更新所有对象的交互性
this.updateLayersObjectsInteractivity();
console.log(`已切换到${mode}模式`);
// console.log(`已切换到${mode}模式`);
}
setToolManager(toolManager) {
@@ -332,7 +332,7 @@ export class LayerManager {
// 私有方法：应用交互规则
async _applyInteractionRules({ isMoveing }) {
console.log("updateLayersObjectsInteractivity ===>", this.editorMode);
// console.log("updateLayersObjectsInteractivity ===>", this.editorMode);
const objects = this.canvas.getObjects();
const editorMode = this.editorMode || CanvasConfig.defaultTool;
const layers = this.layers?.value || [];
@@ -975,7 +975,7 @@ export class LayerManager {
return !layer.isFixed && !layer.isFixedOther && !layer.isBackground
})
// const normalLayers = this.layers.value.filter((l) => !l.isBackground && !l.isFixed && !l.isFixedOther);
console.log("普通图层:", normalLayers)
// console.log("普通图层:", normalLayers)
if (isChild ? parentLength <= 1 : false) {//normalLayers.length <= 1
console.warn("不能删除唯一的普通图层");
message.warning(this.t("Canvas.cannotDeleteOnlyLayer"));
@@ -1096,14 +1096,14 @@ export class LayerManager {
if (this.commandManager) {
const result = this.commandManager.execute(command);
if (result) {
console.log(`✅ 图层移动成功: ${direction}`);
// console.log(`✅ 图层移动成功: ${direction}`);
}
return result;
} else {
const result = command.execute();
if (result) {
// 更新画布渲染顺序
console.log(`✅ 图层移动成功: ${direction}`);
// console.log(`✅ 图层移动成功: ${direction}`);
}
return result;
}
@@ -1147,7 +1147,6 @@ export class LayerManager {
return acc;
}, []);
console.log("==========", allObjects)
// if (layer.fill) {
// // 如果图层有填充颜色，设置所有对象的填充颜色
// const { object } = findObjectById(this.canvas, layer.fill.id);
@@ -1845,7 +1844,7 @@ export class LayerManager {
input.select();
document.execCommand("copy");
document.body.removeChild(input);
console.log(`已复制图层：${layer.name}`);
// console.log(`已复制图层：${layer.name}`);
return this.clipboardData;
}
@@ -1870,7 +1869,7 @@ export class LayerManager {
// 检查是否是唯一的普通图层
const normalLayers = this.layers.value.filter((l) => !l.isBackground && !l.isFixed && !l.isFixedOther);
console.log("普通图层:", normalLayers)
// console.log("普通图层:", normalLayers)
if (normalLayers.length <= 1) {
console.warn("不能剪切唯一的普通图层");
return null;
@@ -1930,7 +1929,7 @@ export class LayerManager {
// 更新对象交互性
this.updateLayersObjectsInteractivity();
console.log(`已剪切图层：${layer.name}`);
// console.log(`已剪切图层：${layer.name}`);
return this.clipboardData;
}
@@ -1944,7 +1943,7 @@ export class LayerManager {
* @returns {string} 新创建的图层ID
*/
async pasteLayer(event) {
console.log("剪贴板数据:", this.clipboardData,event);
// console.log("剪贴板数据:", this.clipboardData,event);
if (!this.clipboardData) {
console.error("剪贴板中没有图层数据");
return null;
@@ -2099,7 +2098,7 @@ export class LayerManager {
// 重新初始化基本图层
this.initializeLayers();
console.log("已清空画布");
// console.log("已清空画布");
}
/**
@@ -2312,7 +2311,7 @@ export class LayerManager {
});
if (emptyLayerIds.length > 0) {
console.log(`已清理 ${emptyLayerIds.length} 个空图层`);
// console.log(`已清理 ${emptyLayerIds.length} 个空图层`);
}
return emptyLayerIds;
@@ -2344,7 +2343,7 @@ export class LayerManager {
this.canvasManager = null;
this.toolManager = null;
console.log("LayerManager 已销毁");
// console.log("LayerManager 已销毁");
}
/**
@@ -2652,13 +2651,13 @@ export class LayerManager {
// 启用红绿图模式
enableRedGreenMode() {
this.isRedGreenMode = true;
console.log("图层管理器：红绿图模式已启用");
// console.log("图层管理器：红绿图模式已启用");
}
// 禁用红绿图模式
disableRedGreenMode() {
this.isRedGreenMode = false;
console.log("图层管理器：红绿图模式已禁用");
// console.log("图层管理器：红绿图模式已禁用");
}
// 检查是否为红绿图模式
@@ -2708,14 +2707,14 @@ export class LayerManager {
: LayerSortUtils.shouldUseAsyncProcessing(objectsCount, layersCount);
if (shouldUseAsync) {
console.log(
`使用异步排序处理 ${objectsCount} 个对象, ${layersCount} 个图层`
);
// console.log(
// `使用异步排序处理 ${objectsCount} 个对象, ${layersCount} 个图层`
// );
return this.layerSort.rearrangeObjectsAsync();
} else {
console.log(
`使用同步排序处理 ${objectsCount} 个对象, ${layersCount} 个图层`
);
// console.log(
// `使用同步排序处理 ${objectsCount} 个对象, ${layersCount} 个图层`
// );
this.layerSort.rearrangeObjects();
}
}
@@ -2735,7 +2734,7 @@ export class LayerManager {
const result = this.layerSort.smartSort(targetLayerIds);
if (result) {
console.log("智能排序完成");
// console.log("智能排序完成");
// 更新对象交互性
this.updateLayersObjectsInteractivity();
}
@@ -2761,9 +2760,9 @@ export class LayerManager {
const stats = this.layerSort.optimizeLayerStructure();
if (stats.removedEmptyLayers > 0 || stats.reorderedLayers > 0) {
console.log(
`图层结构优化完成: 清理空图层 ${stats.removedEmptyLayers} 个, 重新排序 ${stats.reorderedLayers} 个图层`
);
// console.log(
// `图层结构优化完成: 清理空图层 ${stats.removedEmptyLayers} 个, 重新排序 ${stats.reorderedLayers} 个图层`
// );
// 更新对象交互性
this.updateLayersObjectsInteractivity();
}
@@ -2838,9 +2837,9 @@ export class LayerManager {
});
if (result) {
console.log(
`图层 ${layerId} - oldIndex: ${oldIndex} 已移动到位置 ${newIndex}`
);
// console.log(
// `图层 ${layerId} - oldIndex: ${oldIndex} 已移动到位置 ${newIndex}`
// );
// 更新对象交互性
// this.updateLayersObjectsInteractivity();
}
@@ -2917,9 +2916,9 @@ export class LayerManager {
const result = this.layerSort.reorderLayers(oldIndex, newIndex, layerId);
if (result) {
console.log(
`高级排序完成: 图层 ${layerId} 从位置 ${oldIndex} 移动到 ${newIndex}`
);
// console.log(
// `高级排序完成: 图层 ${layerId} 从位置 ${oldIndex} 移动到 ${newIndex}`
// );
// 更新对象交互性
this.updateLayersObjectsInteractivity();
}
@@ -2944,9 +2943,9 @@ export class LayerManager {
);
if (result) {
console.log(
`高级子图层排序完成: 图层 ${layerId} 在父图层 ${parentId} 中从位置 ${oldIndex} 移动到 ${newIndex}`
);
// console.log(
// `高级子图层排序完成: 图层 ${layerId} 在父图层 ${parentId} 中从位置 ${oldIndex} 移动到 ${newIndex}`
// );
// 重新排列画布对象
this.rearrangeCanvasObjects();
}
@@ -2971,7 +2970,7 @@ export class LayerManager {
// 重新排列画布对象
this.rearrangeCanvasObjects();
console.log("使用LayerSort工具完成图层排序");
// console.log("使用LayerSort工具完成图层排序");
}
/**
@@ -2979,7 +2978,7 @@ export class LayerManager {
* 当图层顺序发生变化后调用此方法确保画布对象顺序正确
*/
forceRebuildCanvasOrder() {
console.log("强制重建画布对象顺序");
// console.log("强制重建画布对象顺序");
if (this.layerSort) {
// 使用LayerSort的高级排序
@@ -3010,7 +3009,7 @@ export class LayerManager {
return false;
}
console.log(`开始批量重新排序 ${reorderOperations.length} 个图层`);
// console.log(`开始批量重新排序 ${reorderOperations.length} 个图层`);
let allSuccessful = true;
@@ -3042,7 +3041,7 @@ export class LayerManager {
}
if (allSuccessful) {
console.log("批量图层排序完成");
// console.log("批量图层排序完成");
} else {
console.warn("批量图层排序部分失败");
}
@@ -3079,11 +3078,11 @@ export class LayerManager {
// 执行命令
if (this.commandManager) {
const result = await this.commandManager.execute(command);
result && console.log(`✅ 成功合并组图层: ${groupLayer.name}`);
// result && console.log(`✅ 成功合并组图层: ${groupLayer.name}`);
return result;
} else {
const result = await command.execute();
result && console.log(`✅ 成功合并组图层: ${groupLayer.name}`);
// result && console.log(`✅ 成功合并组图层: ${groupLayer.name}`);
return result || [];
}
}
@@ -3132,13 +3131,13 @@ export class LayerManager {
if (this.commandManager) {
const result = await this.commandManager.execute(command);
if (result) {
console.log(`✅ 成功栅格化图层: ${targetLayer.name}`);
// console.log(`✅ 成功栅格化图层: ${targetLayer.name}`);
}
return result;
} else {
const result = await command.execute();
if (result) {
console.log(`✅ 成功栅格化图层: ${targetLayer.name}`);
// console.log(`✅ 成功栅格化图层: ${targetLayer.name}`);
}
return result;
}
@@ -3209,13 +3208,13 @@ export class LayerManager {
if (this.commandManager) {
const result = await this.commandManager.execute(command);
if (result) {
console.log(`✅ 成功导出图层: ${targetLayer.name}`);
// console.log(`✅ 成功导出图层: ${targetLayer.name}`);
}
return result;
} else {
const result = await command.execute();
if (result) {
console.log(`✅ 成功导出图层: ${targetLayer.name}`);
// console.log(`✅ 成功导出图层: ${targetLayer.name}`);
}
return result;
}
@@ -3259,7 +3258,7 @@ export class LayerManager {
// 执行命令
const result = await command.execute(false);
if (result) {
console.log(`✅ 成功导出图层: ${targetLayer.name}`);
// console.log(`✅ 成功导出图层: ${targetLayer.name}`);
}
return result;
}
@@ -3294,12 +3293,12 @@ export class LayerManager {
const isSginleObject = e.target === activeSelection?._objects?.[0];
if (e.target === activeSelection || isSginleObject) {
hasMoved = false; // 重置移动状态
console.log("🎯 开始移动组选择对象");
// console.log("🎯 开始移动组选择对象");
// 记录遮罩初始位置
console.log(
"🖼️ 记录遮罩初始位置",
`${layer.clippingMask.left || 0}, ${layer.clippingMask.top || 0}`
);
// console.log(
// "🖼️ 记录遮罩初始位置",
// `${layer.clippingMask.left || 0}, ${layer.clippingMask.top || 0}`
// );
// 记录初始位置
initialLeft = isSginleObject ? e.target.left : activeSelection.left;
initialTop = isSginleObject ? e.target.top : activeSelection.top;
@@ -3366,12 +3365,12 @@ export class LayerManager {
const isSginleObject = e.target === activeSelection?._objects?.[0];
if (isSginleObject) {
// 如果是单个对象，不处理
console.log("🚫 单个对象不处理移动完成");
// console.log("🚫 单个对象不处理移动完成");
hasMoved = false; // 重置移动状态
return;
}
if ((target === activeSelection || isSginleObject) && hasMoved) {
console.log("✅ 组选择对象移动完成");
// console.log("✅ 组选择对象移动完成");
// 计算最终移动距离
const deltaX = target.left - initialLeft;
@@ -3410,7 +3409,7 @@ export class LayerManager {
// 鼠标抬起事件处理 - 备用方案
const handleMouseUp = (e) => {
if (hasMoved && this.canvas.getActiveObject() === activeSelection) {
console.log("🖱️ 鼠标抬起 - 备用移动完成处理");
// console.log("🖱️ 鼠标抬起 - 备用移动完成处理");
handleModified(e);
}
};
@@ -3424,7 +3423,7 @@ export class LayerManager {
this.canvas.off("selection:cleared", cleanup);
this.canvas.off("selection:updated", cleanup);
console.log("🧹 清理组遮罩移动同步事件监听器");
// console.log("🧹 清理组遮罩移动同步事件监听器");
};
// 绑定事件监听器
@@ -3437,7 +3436,7 @@ export class LayerManager {
this.canvas.on("selection:cleared", cleanup);
this.canvas.on("selection:updated", cleanup);
console.log("🎨 已设置组遮罩移动同步 - 使用 object:modified 事件");
// console.log("🎨 已设置组遮罩移动同步 - 使用 object:modified 事件");
}
/**