fix
This commit is contained in:
@@ -20,6 +20,8 @@ import { SelectionManager } from "./managers/selection/SelectionManager";
|
||||
import { RedGreenModeManager } from "./managers/RedGreenModeManager";
|
||||
import texturePresetManager from "./managers/brushes/TexturePresetManager";
|
||||
import { BrushStore } from "./store/BrushStore";
|
||||
import cuowuImg from '@/assets/images/homePage/cuowu.svg'
|
||||
|
||||
|
||||
// import { MinimapManager } from "./managers/minimap/MinimapManager";
|
||||
|
||||
@@ -33,7 +35,7 @@ import LiquifyPanel from "./components/LiquifyPanel.vue"; // 引入液化编辑
|
||||
import SelectionPanel from "./components/SelectionPanel.vue"; // 引入选区面板
|
||||
import { LayerType, OperationType } from "./utils/layerHelper.js";
|
||||
import { ToolManager } from "./managers/toolManager.js";
|
||||
// import { fabric } from "fabric-with-all";
|
||||
import { fabric } from "fabric-with-all";
|
||||
import {
|
||||
uploadImageAndCreateLayer,
|
||||
loadImageUrlToLayer,
|
||||
@@ -402,6 +404,11 @@ onMounted(async () => {
|
||||
|
||||
canvasManagerLoaded.value = true;
|
||||
|
||||
// 添加删除按钮
|
||||
// if(!fabric.Object.prototype.controls.deleteControl)addRemoveBtn(removeLayer)
|
||||
addRemoveBtn(removeLayer)
|
||||
|
||||
|
||||
// 触发组件初始化事件
|
||||
nextTick(() => {
|
||||
// 确保所有依赖都已加载完成
|
||||
@@ -490,6 +497,7 @@ onBeforeUnmount(() => {
|
||||
liquifyManager = null;
|
||||
selectionManager = null;
|
||||
redGreenModeManager = null;
|
||||
// fabric.Object.prototype.controls.deleteControl = undefined;
|
||||
|
||||
// 移除window resize事件监听
|
||||
// window.removeEventListener("resize", handleWindowResize);
|
||||
@@ -604,6 +612,37 @@ function moveLayerDown(layerId) {
|
||||
layerManager.moveLayer(layerId, "down");
|
||||
}
|
||||
|
||||
function addRemoveBtn(fun){//添加删除按钮
|
||||
const deleteIcon = cuowuImg
|
||||
// 创建删除图片元素
|
||||
let deleteImg = document.createElement('img')
|
||||
deleteImg.src = deleteIcon
|
||||
function renderIcon(icon) {
|
||||
return function (ctx, left, top, styleOverride, fabricObject) {
|
||||
var size = this.cornerSize;
|
||||
ctx.save();
|
||||
ctx.translate(left, top);
|
||||
ctx.rotate(fabric.util.degreesToRadians(fabricObject.angle));
|
||||
ctx.drawImage(icon, -size/3, -size/3, size/1.5, size/1.5);
|
||||
ctx.restore();
|
||||
}
|
||||
}
|
||||
fabric.Object.prototype.controls.deleteControl = new fabric.Control({
|
||||
x: 0.5,
|
||||
y: -0.5,
|
||||
offsetY: -16,
|
||||
offsetX: 16,
|
||||
cursorStyle: 'pointer',
|
||||
mouseUpHandler:deleteFun,
|
||||
render: renderIcon(deleteImg),
|
||||
cornerSize: 24
|
||||
})
|
||||
}
|
||||
|
||||
function deleteFun(){
|
||||
removeLayer(layerManager.activeLayerId.value)
|
||||
}
|
||||
|
||||
function removeLayer(layerId) {
|
||||
// Check if this is the last layer - prevent deletion
|
||||
if (layers.value.length <= 2) {
|
||||
|
||||
@@ -141,7 +141,7 @@ const allImages = computed(() => {
|
||||
|
||||
// 计算属性:根据选择的分类过滤图片
|
||||
const filteredImages = computed(() => {
|
||||
if (selectedCategory.value === "全部") {
|
||||
if (selectedCategory.value === "All" || selectedCategory.value === "全部") {
|
||||
return allImages.value;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user