液化

src/component/HomePage/ExportModel.vue

@@ -179,7 +179,7 @@
 								<input type="file" @change="uploadImage">
 							</label>
 							<i class="icon iconfont" @click="setOperation('text')" :class="{active:operation == 'text'}">T</i>
-						<i @click="setLiquefaction()">液化</i>
+						<i class="icon iconfont icon-IC-yehua" @click="setLiquefaction()"></i>
 					</div>
 					<!-- <div class="exportCanvasBox_left_tool exportCanvasBox_left_item" :class="{'closeNav' :closeNav.tool}">
 						<div class="exportCanvasBox_left_tool_item">
@@ -506,7 +506,7 @@ export default defineComponent({
 					canvas.loadFromJSON(oldExportCanvas, () => {});
 					isShowMark.value = false
 				}else{
-					nextTick(async ()=>{
+					await nextTick(async ()=>{
 						for (const item of arr) {
 							for (const key in allBoardData.value) {
 								if (item == key) {
@@ -588,50 +588,16 @@ export default defineComponent({
 															} else {
 																position = sketchGroupingItem[sketchXyIndex.minIndex];
 															}
+														
 														}
-														setCanvasImage(img,key,position.x,position.y,allItem)//设置图片
-														position.height = img.height * scaleWH + margin;
-														if (key == "sketchboardFiles") {
-															if (sketchGroupingItem.length <3) {
-																sketchGroupingItem.push(JSON.parse(JSON.stringify(position)));
-															}
-															if (sketchGroupingItem.length >2) {
-																let sketchXyIndex = {
-																	maxIndex: 0,
-																	maxNum: 0,
-																	minNum: 999999,
-																	minIndex: 0,
-																};
-																sketchGroupingItem.forEach(
-																	(sketchItem,sketchIndex) => {
-																		if (sketchItem.y + sketchItem.height < sketchXyIndex.minNum) {
-																			sketchXyIndex.minNum = sketchItem.y + sketchItem.height
-																			sketchXyIndex.minIndex = sketchIndex;
-																		}
-																		if (sketchItem.y + sketchItem.height > sketchXyIndex.maxNum) {
-																			sketchXyIndex.maxNum = sketchItem.y + sketchItem.height
-																			sketchXyIndex.maxIndex = sketchIndex;
-																		}
-																	}
-																);
-																sketchGroupingItem[sketchXyIndex.minIndex].y = sketchXyIndex.minNum
-																// sketchGroupingItem[sketchXyIndex.maxIndex].y = sketchXyIndex.maxNum
-																if (allBoardData.value[key].length == allItemIndex + 1) {
-																	maxHeight = sketchXyIndex.maxNum
-																} else {
-																	position = sketchGroupingItem[sketchXyIndex.minIndex];
-																}
-															}
-														}
-														if(key == "sketchboardFiles" && sketchGroupingItem.length >2){
+													}
+													if(key == "sketchboardFiles" && sketchGroupingItem.length >2){
 														}else{
 															position.x += img.width * scaleWH + margin;
 														}
-														let str = `${img.width} + ${scaleWH}`
 														img.lock_rotation = true;
 														oldKey = key;
 														resolve()
-													}
 													canvas.add(img);
 													
 												},{ crossOrigin: "Anonymous" });
@@ -1984,43 +1950,31 @@ export default defineComponent({
 		}
 
 		//液化
+		//当前选择的液化对象
+		let liquefactionData = ref(null)
 		let liquefaction = ref(null)
 		let submitLiquefaction = (rv)=>{
-
+			const originalWidth = liquefactionData.width * liquefactionData.scaleX; // 保存原始宽度
+			const originalHeight = liquefactionData.height * liquefactionData.scaleY; // 保存原始高度
+			console.log(liquefactionData);
+			liquefactionData.setSrc(rv, function() {
+				liquefactionData.scaleToWidth(originalWidth);
+				liquefactionData.scaleToHeight(originalHeight);
+				delete liquefactionData.minioUrl
+				canvas.renderAll();
+				updateCanvasState()
+			});
 		}
 		let setLiquefaction = ()=>{
-			const selectedObject = canvas.getActiveObjects();
-			if (selectedObject.length > 0) {
-				// 创建一个新的画布用于生成图片
-				const tempCanvas = new fabric.Canvas();
-				tempCanvas.setDimensions({
-				width: selectedObject.width,
-				height: selectedObject.height,
-				});
-				let cloneCount = 0;
-				selectedObject.forEach((obj) => {
-                    obj.clone((clonedObject) => {
-                        tempCanvas.add(clonedObject);
-                        clonedObject.set({ left: obj.left, top: obj.top }); // 设置位置
-                        cloneCount++;
-
-                        // 当所有对象都克隆完成后生成图片
-                        if (cloneCount === selectedObject.length) {
-                            const dataURL = tempCanvas.toDataURL();
-							console.log(dataURL);
-                            console.log('Image URL:', dataURL);
-                            // 可以根据需要使用 dataURL，例如显示在 img 标签中
-                        }
-                    });
-                });
-
-				// 生成图片的地址
-				
+			const activeObjects = canvas.getActiveObjects(); // 获取选中的对象
+			if (activeObjects.length === 1 && activeObjects[0].type === 'image') {
+				liquefactionData = activeObjects[0]
+				liquefaction.value.init(activeObjects[0])
 			} else {
 				console.log('No object selected.');
+				message.info(useI18.t('exportModel.jsContent6'))
 				return null;
 			}
-			// liquefaction.value.init()
 		}
         onMounted(() => {
 			let arr = [