变形

src/view/case/photos/canvas-photo-editor.js

@@ -203,6 +203,7 @@ export class CanvasPhotoEditor {
 
   // --- 核心：拖拽仅改坐标，不重绘 ---
   async handleMouseDown(e) {
+    this.isDragging = true
     console.log('handleMouseDown', e.button, this.tempArrow)
     if (e.button === 2 && this.indexing) { // 右键
       //结束标引
@@ -276,12 +277,7 @@ export class CanvasPhotoEditor {
         pageIndex: -1,
       }
     }
-    if(oldPageIndex == pageIndex && pageIndex == this.selectedPageIndex && pageIndex == this.selectedPageItem.pageIndex && pageIndex != -1 && this.selectedPageItem.index == -1){
-      if(this.indexingLineList.length){
-        await this.checkIndexing('修改页面排序将会清除所有标引是否继续？')
-        this.drawAllPages()
-        return
-      }
+    if(this.isDragging && oldPageIndex == pageIndex && pageIndex == this.selectedPageIndex && pageIndex == this.selectedPageItem.pageIndex && pageIndex != -1 && this.selectedPageItem.index == -1){
       this.dragPageData.start = { x: mouseX, y: mouseY }
       this.dragPageData.drawing = true;
       this.dragPageData.index = pageIndex;
@@ -290,7 +286,6 @@ export class CanvasPhotoEditor {
       this.drawAllPages()
       return
     }
-    this.isDragging = true
     this.dragStartX = e.clientX
     this.dragStartY = e.clientY
     this.lastDrawOffsetX = this.drawOffsetX
@@ -317,6 +312,7 @@ export class CanvasPhotoEditor {
       this.dragPageData.end = { x: mouseX, y: mouseY }
       let newEndIndex = endIndex<-1?-1:endIndex>this.pages.length-1?this.pages.length:endIndex
       if(newEndIndex != this.dragPageData.movedIndex){
+        await handleClearLine()
         this.dragPageData.movedIndex = newEndIndex
         this.drawAllPages()
       }
@@ -328,46 +324,22 @@ export class CanvasPhotoEditor {
     const deltaY = e.clientY - this.dragStartY
     this.drawOffsetX = this.lastDrawOffsetX + deltaX
     this.drawOffsetY = this.lastDrawOffsetY + deltaY
-    // const mouseX = (e.clientX - rect.left - this.drawOffsetX) / this.scale
-    // const mouseY = (e.clientY - rect.top - this.drawOffsetY) / this.scale
-    // ==========================================
-    // // 🔥 页面拖拽排序：移动时交换顺序
-    // // ==========================================
-    // if (this.isPageDragging && this.selectedPageIndex !== -1) {
-    //   const deltaY = e.clientY - this.dragPageStartY
-
-    //   // 向下拖 → 向后交换
-    //   if (deltaY > 80 && this.selectedPageIndex < this.pages.length - 1) {
-    //     const newPages = [...this.pages]
-    //     const temp = newPages[this.selectedPageIndex]
-    //     newPages[this.selectedPageIndex] = newPages[this.selectedPageIndex + 1]
-    //     newPages[this.selectedPageIndex + 1] = temp
-    //     this.pages = newPages
-    //     this.selectedPageIndex += 1
-    //     this.dragPageStartY = e.clientY
-    //     this.dragPageMoved = true
-    //     return
-    //   }
-
-    //   // 向上拖 → 向前交换
-    //   if (deltaY < -80 && this.selectedPageIndex > 0) {
-    //     const newPages = [...this.pages]
-    //     const temp = newPages[this.selectedPageIndex]
-    //     newPages[this.selectedPageIndex] = newPages[this.selectedPageIndex - 1]
-    //     newPages[this.selectedPageIndex - 1] = temp
-    //     this.pages = newPages
-    //     this.selectedPageIndex -= 1
-    //     this.dragPageStartY = e.clientY
-    //     this.dragPageMoved = true
-    //     return
-    //   }
-    // }
     if(this.indexing && this.indexingNum == 1){
       // 绘制中途轨迹
     }
     // 【关键】通过Canvas临时绘制偏移效果（替代重绘），避免拖拽时画面静止
     this.drawAllPages()
   }
+   handleClearLine(){
+    throttle(async ()=>{
+      if(this.indexingLineList.length){
+        await this.checkIndexing('修改页面排序将会清除所有标引是否继续？')
+        this.drawAllPages()
+        return
+      }
+    }, 2000)
+
+  }
 
   async handleMouseUp(e) {
     this.isDragging = false
@@ -1068,7 +1040,7 @@ export class CanvasPhotoEditor {
       // 重新计算绘制参数（确保使用最新状态）
       const scaleX = layout.width / img.width;
       const scaleY = layout.height / img.height;
-      const coverScale = Math.max(scaleX, scaleY);
+      const coverScale = Math.min(scaleX, scaleY);
       const scaledWidth = img.width * coverScale;
       const scaledHeight = img.height * coverScale;
       const offsetXInLayout = (layout.width - scaledWidth) / 2;
@@ -1537,11 +1509,15 @@ export class CanvasPhotoEditor {
                 ctx.rect(coord.x, coord.y, coord.width, coord.height);
                 ctx.clip();
 
-                const s = Math.max(coord.width / img.width, coord.height / img.height);
-                const w = img.width * s;
+                const s = Math.min(coord.width / img.width, coord.height / img.height);
+                let w = img.width * s;
                 const h = img.height * s;
-                const x = coord.x + (coord.width - w) / 2;
+                let x = coord.x + (coord.width - w) / 2;
                 const y = coord.y + (coord.height - h) / 2;
+                if(paperType == 'four'){
+                  w = w / (724/840)
+                  x = x * (724/840)
+                }
                 ctx.drawImage(img, x, y, w, h);
 
                 ctx.restore();
@@ -1740,7 +1716,7 @@ exportPagesAsImages(paperType = "a4", name, fileType = 'pdf') {
               ctx.rect(coord.x, coord.y, coord.width, coord.height);
               ctx.clip();
 
-              const s = Math.max(coord.width / img.width, coord.height / img.height);
+              const s = Math.min(coord.width / img.width, coord.height / img.height);
               const w = img.width * s;
               const h = img.height * s;
               const x = coord.x + (coord.width - w) / 2;