fix

src/tool/canvasGeneralCopy.js

@@ -9,6 +9,8 @@ import {
 	JSSetRemoveImage,
  } from "@/tool/canvasDrawingCopy";
 import { getMousePosition } from "@/tool/mdEvent";
+import { getMinioUrl } from "@/tool/util";
+
 import { file } from "jszip";
 class MyCanvas {
 	constructor(id) {
@@ -303,7 +305,7 @@ class MyCanvas {
 		JSchangeType(MyCanvas?.[this.id],'init')
 		// await this.createBg()
 		await this.createLayer({str:'init',img:img,noErasable:data?.noErasable || false})//创建图层并且使用
-		if(img){
+		if(img && editGroupImg){
 			this.dashed.isDetail = true
 			await this.createLayer({editImg:editGroupImg,noErasable:data?.noErasable || false})//创建图层并且使用
 		}
@@ -317,7 +319,7 @@ class MyCanvas {
 		let scale
 		if(this.canvasWH.width>this.canvasWH.height)scale = this.canvasDomParent.offsetWidth / this.canvasWH.width
 		if(this.canvasWH.width<this.canvasWH.height)scale = this.canvasDomParent.offsetHeight / this.canvasWH.height
-		if(this.canvasWH.width == this.canvasWH.height)scale = this.canvasDomParent.offsetHeight / this.canvasWH.height
+		if(this.canvasWH.width == this.canvasWH.height)scale = this.canvasDomParent.offsetWidth / this.canvasWH.width
 		let x = this.canvasWH.width / 2
 		let y = this.canvasWH.height / 2
 		if(str == 'updata'){
@@ -1116,18 +1118,21 @@ class MyCanvas {
 		}
 		img.set({
 			custom:{
-				type:'upImgFiles'
-			}
+				type:'upImgFiles',
+				// minioUrl:getMinioUrl(imgData.url)
+			},
 		})
-		await this.createLayer({})
+		if(this.dashed.isDetail)await this.createLayer({})
 		this.setCanvasImage(img,position,"upImgFiles",imgData)
 	}
 	createImage(imgData){
 		return new Promise((resolve, reject) => {
+			console.log(imgData)
 			fabric.Image.fromURL(imgData.minioUrl,(img) => {
 				img.set({
-					hasControls: true
+					hasControls: true,
 				})
+				img.minioUrl=getMinioUrl(imgData.minioUrl || imgData.imgUrl)
 				resolve(img)
 			},{ crossOrigin: "Anonymous" })
 		})
@@ -1175,17 +1180,12 @@ class MyCanvas {
 		return imgWidth
 	}
 	async setCanvasImage(img,position,key,data){
-		let minioUrl = ''//表示收藏或者generate
 		let imgUrl = data.imgUrl
 		if (key == "likeDesignCollectionList") {
 			imgUrl = data.designOutfitUrl;
 		}
+		console.log(img.width , img.height,img);
 		let imgWidth = await this.setImageWidth(key,img); 
-		if(imgUrl?.split('?')){
-			let url = imgUrl.split('?')[0]
-			var match = url.match(/:(\d+)\/(.*)/);
-			minioUrl = match[2]
-		}
 		let proportion = img.height / img.width; //计算图形宽高比例
 		let scaleWH = imgWidth / img.width; //计算放到画布上缩小倍率
 		let scale = {
@@ -1195,7 +1195,6 @@ class MyCanvas {
 		img.set({
 			left:position.left - img.width*scale.X/2,
 			top:position.top - img.height*scale.Y / 2,
-			minioUrl,
 			scaleX:scale.X,
 			scaleY:scale.Y,
 		});
@@ -1432,6 +1431,7 @@ class MyCanvas {
 				custom:{
 					layerId:id,
 					isSelectable:true,
+					type:str,
 				},
 				// erasable:false,
 				selectable:false,
@@ -1462,13 +1462,25 @@ class MyCanvas {
 				group.moveTo(group.custom.selectLayerIndex)
 				if(image){
 					let img = await this.createImage({minioUrl:image})
+					const scaleX = group.width / img.width; // 横向比例
+					const scaleY = group.height / img.height; // 纵向比例
+					// 选择较大的比例来保持完整图片显示，避免裁剪
+					const scale = Math.min(scaleX, scaleY);
+					const patternTransform = [
+						scale, 0, 
+						0, scale, 
+						(group.width - img.width * scale) / 2, 
+						(group.height - img.height * scale) / 2
+					  ];
 					rect.set({
 						fill: new fabric.Pattern({
 							source: img.getElement(),  // 传入图片元素
 							repeat: 'no-repeat',        // 设置图片不重复
-							patternTransform: [group.width / img.width, 0, 0, group.height / img.height, 0, 0]
+							patternTransform: patternTransform
+							// patternTransform: [group.width / img.width, 0, 0, group.height / img.height, 0, 0]
 						}),
 					})
+					rect.minioUrl = getMinioUrl(image)
 				}
 				group.add(rect)
 				group.clone((cloned)=>{
@@ -1519,6 +1531,19 @@ class MyCanvas {
 			height: MyCanvas?.[this.id].height
 		}))
 	}
+	showBg(boolen){
+		let Bg = MyCanvas?.[this.id].getObjects().filter(obj => obj.custom.type == 'init')?.[0];
+		// MyCanvas?.[this.id].getObjects().forEach((item)=>{
+		// 	console.log(item)
+		// })
+		Bg.set({visible:boolen})
+		// if(Bg.visible){
+		// 	Bg.set({visible:false})
+		// }else{
+		// 	Bg.set({visible:true})
+		// }
+		MyCanvas?.[this.id].renderAll() // 刷新画布，改变group的visible属性，必须通过刷新画布，才能应用新属性值
+	}
 	async addPartImg(file,str,data){
 		// let {erasable} = data
 
@@ -1576,7 +1601,8 @@ class MyCanvas {
 				}
 				options.target.clipPath = cloned
 			})
-		}else if(options.target.type == 'image' && options.target.custom?.type != 'pencil'){
+		}else if(options.target.type == 'image' && options.target.custom?.type != 'pencil' && this.dashed.isDetail ){
+			console.log(123321)
 			let scale = 1
 			if(options.target?.custom?.type == 'print')scale = 2
 			options.target.set({
@@ -2074,8 +2100,6 @@ class MyCanvas {
 			// this.setClone(this._clipboard,clonedObj)
 			MyCanvas?.[this.id].discardActiveObject() // 取消选择
 			clonedObj.set({
-				left: clonedObj.left,
-				top: clonedObj.top,
 				selectable: true
 			})
 			if (clonedObj.type === 'activeSelection') {
@@ -2108,7 +2132,7 @@ class MyCanvas {
 	//撤回反撤回
 	//设置画布监听修改添加事件，用来做撤回功能
 	updateCanvasState(str){
-		let canvasData = MyCanvas?.[this.id].toJSON(['custom','selectable','minioUrl','perPixelTargetFind','subTargetCheck','evented']);
+		let canvasData = MyCanvas?.[this.id].toJSON(['custom','selectable','MINIOURL','perPixelTargetFind','subTargetCheck','evented']);
 		if(canvasData.clipPath){
 			canvasData.clipPath.left = 0
 			canvasData.clipPath.top = 0
@@ -2153,6 +2177,15 @@ class MyCanvas {
 			},MyCanvas?.[this.id].renderAll.bind(MyCanvas?.[this.id]),
 		)
 	}
+	setLoadFromJSON(data,fun){
+		MyCanvas?.[this.id].loadFromJSON(data.canvas, fun);
+		if(data.groupList.length == 0){
+			console.log(this.layer)
+		}else{
+			this.layer.list = data.groupList
+			this.layer.selectLayer.id = data.groupList[0].id
+		}
+	}
 	temporarilyExport(data){
 		let scaleXY = {
 			scaleX:data?.scaleX?data?.scaleX:1,
@@ -2190,7 +2223,7 @@ class MyCanvas {
 	//导出除了底图
 	async detailSubmit(){
 		return await new Promise(async (resolve, reject) => {
-			let list = MyCanvas?.[this.id].getObjects().filter(obj => this.isAddToLayer(obj) && !obj.custom.dashed && obj.type);
+			let list = MyCanvas?.[this.id].getObjects().filter(obj => this.isAddToLayer(obj) && !obj.custom.dashed && obj.type && obj.erasable);
 			let layerBg = list.filter(obj => obj.custom.isSelectable)[0]
 			let scaleXY = {
 				scaleX:layerBg?.scaleX?layerBg?.scaleX:1,