diff --git a/src/component/Canvas/OverallCanvas/index.vue b/src/component/Canvas/OverallCanvas/index.vue index 1e7e0d80..be1a788f 100644 --- a/src/component/Canvas/OverallCanvas/index.vue +++ b/src/component/Canvas/OverallCanvas/index.vue @@ -145,7 +145,7 @@ const onDeleteItem = (object) => { const list = [{ token: object.token, action: ACTIONS.DELETE }]; emit("change-canvas", list); - canvas.remove(object); + DeleteItemByToken(object.token); canvas.renderAll(); }; const urlToCanvas = (url) => { @@ -177,11 +177,12 @@ canvas.renderAll(); }; const addObject = async (item) => { + const token = item.token; const cwidth = canvas.width; const cheight = canvas.height; let pattern = await setFill(item); let rect = new fabric.Rect({ - token: item.token, + token: token, width: cwidth, height: cheight, fill: pattern, @@ -200,8 +201,11 @@ let scaleX = ((cwidth / image.width) * item.scale[0]) / 5; let scaleY = ((cheight / image.height) * item.scale[1]) / 5; let scale = cwidth > cheight ? scaleX : scaleY; - let offsetX = item.location[0] * cwidth / props.width - (image.width * scale) / 2; - let offsetY = item.location[1] * cheight / props.height - (image.height * scale) / 2; + let offsetX = + (item.location[0] * cwidth) / props.width - (image.width * scale) / 2; + let offsetY = + (item.location[1] * cheight) / props.height - + (image.height * scale) / 2; let angle = item.angle; let gapX = item.object.gapX; let gapY = item.object.gapY; @@ -298,9 +302,9 @@ list.value = list_; canvas.renderAll(); } else if (item.action === ACTIONS.DELETE) { - list.value = list.value.filter((v) => v.token !== item.token); - if (object) canvas.remove(object); + DeleteItemByToken(item.token); } else if (item.action === ACTIONS.ADD) { + DeleteItemByToken(item.token); list.value.push(item.data); await addObject(item.data); } @@ -309,6 +313,12 @@ }; taskQueue.addTask(async () => await cd(list_)); }; + /** 删除 */ + const DeleteItemByToken = (token) => { + list.value = list.value.filter((v) => v.token !== token); + const objects = canvas.getObjects().filter((o) => o.token === token); + objects.forEach((o) => canvas.remove(o)); + }; defineExpose({ updataList, }); diff --git a/src/component/Detail/canvas/index.vue b/src/component/Detail/canvas/index.vue index de6484e6..917a53de 100644 --- a/src/component/Detail/canvas/index.vue +++ b/src/component/Detail/canvas/index.vue @@ -185,7 +185,6 @@ export default defineComponent({ width:props.sketchSize.width, height:props.sketchSize.height, }).then((rv)=>{ - console.log(rv,'================',props.sketchSize) if(oldSelectDetail?.partialDesign)oldSelectDetail.partialDesign.partialDesignBase64 = rv })