fix

src/component/HomePage/createSlogan.vue

@@ -107,7 +107,7 @@ export default defineComponent({
 		let canvasWH = ref(0);
 		let textData = reactive({
 			fill:'#000000',
-			fontSize:'35',
+			fontSize:'51',
 			fontFamily:'Arial',
 			textAlign:'left',
 			overline: false,
@@ -144,21 +144,26 @@ export default defineComponent({
 			nextTick(()=>{
 				let canvasBox = document.querySelector(".clearSlogan_modal .exportCanvasBox_center");
 				let height = canvasBox.offsetHeight;
+				textData.fontSize = (height/10*1.9).toFixed(0)
 				canvasBox.style.width = height+'px'
 				canvasWH.value = height
 				scale = exportWH/canvasWH.value
-				var canvasDom = document.createElement("canvas");
 				let oldCanvasDom = canvasBox.querySelector('.canvas-container')
-				if(oldCanvasDom)oldCanvasDom.remove()
-				canvasBox.appendChild(canvasDom);
-				canvas = new fabric.Canvas(canvasDom, {
-					backgroundColor: "#e6e6e6",
-					width: canvasWH.value,
-					height: canvasWH.value,
-					isDrawingMode: false, // 开启绘图模式
-				});
-				canvas.on('object:moving',canvasMoving)
-				setTextFun('请输入一段话吧~')
+				// if(oldCanvasDom)oldCanvasDom.remove()
+				if(!oldCanvasDom){
+					var canvasDom = document.createElement("canvas");
+					canvasBox.appendChild(canvasDom);
+					canvas = new fabric.Canvas(canvasDom, {
+						backgroundColor: "#e6e6e6",
+						width: canvasWH.value,
+						height: canvasWH.value,
+						isDrawingMode: false, // 开启绘图模式
+					});
+					canvas.on('object:moving',canvasMoving)
+					
+					setTextFun('请输入\n一段话吧~')
+				}
+				
 				if(!fabric.Object.prototype.controls.deleteControl){
 					JSSetRemoveImage(deleteObj)
 				}else{
@@ -171,6 +176,14 @@ export default defineComponent({
 			})
         }
 		let selectTextbox = ref(null)
+		let oldClickedObject = null
+		let clickObjChanged = (options)=>{
+			console.log(options);
+			console.log(oldClickedObject);
+			// var changedObject = options.target;
+			setBtnPosition(oldClickedObject)
+
+		}
 		let setTextBtn = (e) =>{//点击判断是否点击到文字
 			var clickedObject = e.target;
 			if (clickedObject instanceof fabric.IText){
@@ -183,6 +196,9 @@ export default defineComponent({
 				textData.linethrough = clickedObject.linethrough
 				textData.underline = clickedObject.underline
 				setBtnPosition(clickedObject)
+				clickedObject.on('changed',clickObjChanged);
+				if(oldClickedObject)oldClickedObject.off('changed',clickObjChanged);
+				oldClickedObject = clickedObject
 			}else{
 				selectTextbox.value = null
 				textBtnShow.value = false
@@ -206,6 +222,23 @@ export default defineComponent({
 		let messageShow = false
 		let canvasMoving = (options)=>{
 			let obj = options.target
+			let left,top
+			let canvasWidth = canvas.getWidth()
+			let canvasHeight = canvas.getHeight()
+			if(obj.left < 0){
+				left = obj.left<0?0:obj.left
+			}else{
+				left = obj.left + obj.width*obj.scaleX>canvasWidth?canvasWidth -  obj.width*obj.scaleX:obj.left
+			}
+			if(obj.top < 0){
+				top = obj.top<0?0:obj.top
+			}else{
+				top = obj.top + obj.height*obj.scaleY>canvasHeight?canvasHeight -  obj.height*obj.scaleY:obj.top
+			}
+			obj.set({
+				left,
+				top
+			})
 			isCanvasMoving(obj)
 		}
 		let isCanvasMoving = (obj)=>{
@@ -240,7 +273,6 @@ export default defineComponent({
 			textbox = new fabric.IText(str, {
 				fontSize: 20,
 				textAlign:'center'
-				
 				// fill:canvasPencilColor.value,
 			})
 			textbox.set(textData)
@@ -364,6 +396,12 @@ export default defineComponent({
 		flex-direction: column;
 		// height: calc(512px / 2);
 		margin: 0 auto;
+		.modal_title_text{
+			padding-bottom: calc(2rem* 1.2);
+			background: #fff;
+			z-index: 4;
+			margin-bottom: 0;
+		}
 		.clearSlogan_center_item{
 			// position: relative;
 			background: #fff;
@@ -391,14 +429,6 @@ export default defineComponent({
 					-webkit-appearance: none;
 					margin: 0;
 				}
-				>select{
-					height: 2.5rem;
-					border: 0.2rem solid #c4c4c4 !important;
-					border-radius: 4px; /* 设置圆角半径 */
-				}
-				>select:focus-visible{
-					border: 0.2rem solid #c4c4c4;
-				}
 				div{
 					padding: 0 1rem;
 					font-weight: 600;
@@ -442,7 +472,7 @@ export default defineComponent({
 			flex: 1;
 			position: relative;
 			margin: 0 auto;
-			overflow: hidden;
+			// overflow: hidden;
 			// overflow: scroll;
 			.canvas-container{
 				margin: 0 auto;