From 608e2ce6204404e6532ab22c13103601fe210666 Mon Sep 17 00:00:00 2001
From: wxd <1627315083@qq.com>
Date: Sun, 13 Oct 2024 15:43:27 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3=E5=85=83=E7=B4=A0=E9=87=8D?=
 =?UTF-8?q?=E5=BD=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/style/style.css                  |  4 +++
 src/assets/style/style.less                 |  7 ++--
 src/component/HomePage/scaleImage.vue       |  2 +-
 src/component/modules/generalMiniCanvas.vue | 36 +++++++++------------
 4 files changed, 25 insertions(+), 24 deletions(-)

diff --git a/src/assets/style/style.css b/src/assets/style/style.css
index 00042789..49cff822 100644
--- a/src/assets/style/style.css
+++ b/src/assets/style/style.css
@@ -959,6 +959,10 @@ li {
 .sketchboard_upload_modal .switch_type_list.showEvents * {
   pointer-events: auto;
 }
+.ant-modal-wrap {
+  height: 100vh;
+  overflow: hidden;
+}
 .ant-btn:hover,
 .ant-btn:focus,
 .ant-btn:active,
diff --git a/src/assets/style/style.less b/src/assets/style/style.less
index 5bb2c654..847e88eb 100644
--- a/src/assets/style/style.less
+++ b/src/assets/style/style.less
@@ -1066,9 +1066,10 @@ input:focus{
 	}
 }
 
-// .ant-modal-wrap{
-// 	z-index: 10001 ;
-// }
+.ant-modal-wrap{
+	height: 100vh;
+	overflow: hidden;
+}
 // .driver-overlay-animated{
 // 	z-index: 10002 !important;
 // }
diff --git a/src/component/HomePage/scaleImage.vue b/src/component/HomePage/scaleImage.vue
index 7aae316d..34fc81a2 100644
--- a/src/component/HomePage/scaleImage.vue
+++ b/src/component/HomePage/scaleImage.vue
@@ -536,7 +536,7 @@ export default defineComponent({
 		justify-content: center;
 		align-items: center;
 		width: 100%;
-		top: 105%;
+		top: 100%;
 		left: 0;
 		position: absolute;
 		.nav_left,.nav_right{
diff --git a/src/component/modules/generalMiniCanvas.vue b/src/component/modules/generalMiniCanvas.vue
index 48931a28..e2d1fcd0 100644
--- a/src/component/modules/generalMiniCanvas.vue
+++ b/src/component/modules/generalMiniCanvas.vue
@@ -14,7 +14,7 @@
 					<span>{{ $t('exportModel.density') }}</span>
 					<input type="range" @change="routesChange('density')" min="1" max="100" v-model="canvasPencilWidth.density">
 				</div>
-				<div class="generalMiniCanvas_input_item" v-show="(canvasState != 'move' && canvasState != 'liquidation')">
+				<div class="generalMiniCanvas_input_item" v-show=" canvasState == 'pencil'">
 					<span>{{ $t('exportModel.Color') }}</span>
 					<input type="color" @input="setPencilColor" v-model="canvasPencilColor">
 				</div>
@@ -451,31 +451,26 @@ export default defineComponent({
 		let liquefactionData = ref(null)
 		let liquefaction = ref(null)
 		let submitLiquefaction = (rv)=>{
-			const originalWidth = liquefactionData.value.width // 保存原始宽度
-			const originalHeight = liquefactionData.value.height; // 保存原始高度
-			liquefactionData.value.setSrc(rv, function(img) {
-				let wScale = 1
-				let hScale = 1
-				if(img.width>img.height){
-					hScale = img.height/img.width
-					exportWH = img.width
-				}else{
-					wScale = img.width/img.height
-					exportWH = img.height
-				}
+			// const originalWidth = liquefactionData.value.width // 保存原始宽度
+			// const originalHeight = liquefactionData.value.height; // 保存原始高度
+			fabric.Image.fromURL(rv, function(img) {
+				// 设置背景图对象的宽度和高度与 canvas 相同
 				img.scaleToWidth(canvas.width);
 				img.scaleToHeight(canvas.height);
 				img.set({
 					scaleX: canvas.width / img.width,
 					scaleY: canvas.height / img.height
 				});
-				// img.set({
-				// 	scaleX: 1,
-				// 	scaleY: 1
-				// });
-			
-				canvas.renderAll();
-			});
+				// 将背景图添加到 canvas 的底层
+				canvas.setBackgroundImage(img, canvas.renderAll.bind(canvas));
+				if(!fabric.Object.prototype.controls.deleteControl){
+					JSSetRemoveImage(deleteObj)
+				}else{
+					fabric.Object.prototype.controls.deleteControl.mouseUpHandler = deleteObj
+				}
+				setPencilWidth()
+				updateCanvasState()
+			},{ crossOrigin: "Anonymous" });
 		}
 		let setLiquefaction =async ()=>{
 			// const activeObjects = canvas.backgroundImage // 获取选中的对象
@@ -561,6 +556,7 @@ export default defineComponent({
 		flex-direction: row;
 		align-items: center;
 		margin-left: 7rem;
+		height: 6rem;
 		.generalMiniCanvas_input_item{
 			display: flex;
 			margin-right: 3rem;