Browse Source

fix: 文本重复选中;选中注释时不能选中文本;上传文件关闭侧边栏;stamp计算图片像素点有误差;绘制ink不显示问题;

wzl 1 year ago
parent
commit
aef9673816

+ 12 - 6
packages/core/src/TextSelection.ts

@@ -102,18 +102,22 @@ export default class TextSelection {
 
   set tool (toolType: string) {
     if ((toolType === this._tool && toolType !== '')) return
-    this._tool = toolType
+    
     if (!markupType.includes(toolType) || this.toolMode === 'editor') {
       document.removeEventListener('mousedown', this.handleMouseDown)
       document.removeEventListener('touchstart', this.handleMouseDown)
       document.removeEventListener('mousemove', this.handleMouseMove)
       document.removeEventListener('touchmove', this.handleMouseMove)
+      this._tool = toolType
       return
     }
-    document.addEventListener('mousedown', this.handleMouseDown)
-    document.addEventListener('touchstart', this.handleMouseDown)
-    document.addEventListener('mousemove', this.handleMouseMove)
-    document.addEventListener('touchmove', this.handleMouseMove)
+    if (!(markupType.includes(toolType) && markupType.includes(this.tool))) {
+      document.addEventListener('mousedown', this.handleMouseDown)
+      document.addEventListener('touchstart', this.handleMouseDown)
+      document.addEventListener('mousemove', this.handleMouseMove)
+      document.addEventListener('touchmove', this.handleMouseMove)
+    }
+    this._tool = toolType
   }
 
   testPoint(event: MouseEvent) {
@@ -143,7 +147,7 @@ export default class TextSelection {
 
   async handleMouseMove(event: MouseEvent) {
     const inPage = this.testPoint(event)
-    if (!inPage) return
+    if (!inPage || document.getElementsByClassName('outline-container')[0]) return
     const { x, y } = inPage
     const point = getInitialPoint({ x, y }, this.viewport, this.scale)
 
@@ -296,5 +300,7 @@ export default class TextSelection {
     document.removeEventListener('touchmove', this.handleMouseMove)
     document.removeEventListener('mouseup', this.handleMouseUp)
     document.removeEventListener('touchend', this.handleMouseUp)
+
+    this.eventBus._off('toolChanged', this.handleTool)
   }
 }

+ 83 - 79
packages/core/src/annotation/paint/shape.js

@@ -201,92 +201,96 @@ export default class PaintShape {
       x,
       y
     }
-    if (this.initStartPoint.x !== this.initEndPoint.x && this.initStartPoint.y !== this.initEndPoint.y) {
-      if (!this.shapeEle) {
-        const shapeEle = createSvg(
-          this.checkSvgChild(this.tool),
-          {
-            'fill': 'none',
-            'stroke': this.color,
-            'stroke-width': 2 * scale,
-            'stroke-opacity': 0.8
-          }
-        )
-        if (this.tool === 'arrow') {
-          let arrowBuild = new ArrowHelper(this.initStartPoint, this.initEndPoint)
-          let arrowLength = 12 * scale
-          let arrowUi = arrowBuild.getEndArrow(30, arrowLength, false)
-          if (arrowUi) {
-            this.tail = "OpenArrow"
-            arrowUi.setAttribute('tail', '')
-            arrowUi.setAttribute("stroke", this.color)
-            arrowUi.setAttribute("stroke-width", 2 * scale)
-            arrowUi.setAttribute("fill", "none")
-            arrowUi.setAttribute("stroke-opacity", 0.8)
-            this.svgElement.append(arrowUi)
-          }
+    if (this.initStartPoint.x === this.initEndPoint.x) {
+      this.initEndPoint.x = this.initEndPoint.x + 1
+    }
+    if (this.initStartPoint.y === this.initEndPoint.y) {
+      this.initEndPoint.y = this.initEndPoint.y + 1
+    }
+    if (!this.shapeEle) {
+      const shapeEle = createSvg(
+        this.checkSvgChild(this.tool),
+        {
+          'fill': 'none',
+          'stroke': this.color,
+          'stroke-width': 2 * scale,
+          'stroke-opacity': 0.8
         }
-        this.shapeEle = shapeEle
-        this.svgElement.append(this.shapeEle)
-      } else {
-        if (event.shiftKey && (this.tool === 'circle' || this.tool === 'square')) {
-          const { initStartPoint, initEndPoint } = this
-          const distanceX = Math.abs(initEndPoint.x - initStartPoint.x)
-          const distanceY = Math.abs(initEndPoint.y - initStartPoint.y)
-          const distance = Math.min(distanceX, distanceY)
-          if (initStartPoint.x < initEndPoint.x) {
-            initEndPoint.x = initStartPoint.x + distance
-          } else {
-            initEndPoint.x = initStartPoint.x - distance
-          }
-          if (initStartPoint.y < initEndPoint.y) {
-            initEndPoint.y = initStartPoint.y + distance
-          } else {
-            initEndPoint.y = initStartPoint.y - distance
-          }
+      )
+      if (this.tool === 'arrow') {
+        let arrowBuild = new ArrowHelper(this.initStartPoint, this.initEndPoint)
+        let arrowLength = 12 * scale
+        let arrowUi = arrowBuild.getEndArrow(30, arrowLength, false)
+        if (arrowUi) {
+          this.tail = "OpenArrow"
+          arrowUi.setAttribute('tail', '')
+          arrowUi.setAttribute("stroke", this.color)
+          arrowUi.setAttribute("stroke-width", 2 * scale)
+          arrowUi.setAttribute("fill", "none")
+          arrowUi.setAttribute("stroke-opacity", 0.8)
+          this.svgElement.append(arrowUi)
         }
-        const rect = this.calculate(this.initStartPoint, this.initEndPoint)
-
-        const shapeEle = this.shapeEle
-        if (this.tool === 'circle') {
-          shapeEle.setAttribute('cx', rect.left + rect.width / 2,)
-          shapeEle.setAttribute('cy', rect.top + rect.height / 2,)
-          shapeEle.setAttribute('rx', (rect.width - 1) / 2,)
-          shapeEle.setAttribute('ry', (rect.height - 1) / 2,)
-        } else if (this.tool === 'square') {
-          shapeEle.setAttribute('x', rect.left + 1 / 2,)
-          shapeEle.setAttribute('y', rect.top - 1 / 2,)
-          shapeEle.setAttribute('width', `${Math.abs(rect.width - 1)}px`,)
-          shapeEle.setAttribute('height', `${Math.abs(rect.height - 1)}px`,)
-        } else if (this.tool === 'line' || this.tool === 'arrow') {
-          shapeEle.setAttribute('x1', this.initStartPoint.x);
-          shapeEle.setAttribute('y1', this.initStartPoint.y);
-          shapeEle.setAttribute('x2', this.initEndPoint.x);
-          shapeEle.setAttribute('y2', this.initEndPoint.y);
-
-          if (this.tool === 'arrow') {
-            let tail = this.svgElement.querySelector('[tail]')
-            if (tail) {
-              let arrowBuild = new ArrowHelper(this.initStartPoint, this.initEndPoint)
-              let arrowLength = 12 * scale
-              let arrowPoints = arrowBuild.getEndArrowPoints(30, arrowLength)
-              let points = ''
-              arrowPoints.forEach(element => {
-                if (points.length > 0) {
-                  points = points + ' '
-                }
-                points = points + `${element.x},${element.y}`
-              });
+      }
+      this.shapeEle = shapeEle
+      this.svgElement.append(this.shapeEle)
+    } else {
+      if (event.shiftKey && (this.tool === 'circle' || this.tool === 'square')) {
+        const { initStartPoint, initEndPoint } = this
+        const distanceX = Math.abs(initEndPoint.x - initStartPoint.x)
+        const distanceY = Math.abs(initEndPoint.y - initStartPoint.y)
+        const distance = Math.min(distanceX, distanceY)
+        if (initStartPoint.x < initEndPoint.x) {
+          initEndPoint.x = initStartPoint.x + distance
+        } else {
+          initEndPoint.x = initStartPoint.x - distance
+        }
+        if (initStartPoint.y < initEndPoint.y) {
+          initEndPoint.y = initStartPoint.y + distance
+        } else {
+          initEndPoint.y = initStartPoint.y - distance
+        }
+      }
+      const rect = this.calculate(this.initStartPoint, this.initEndPoint)
+
+      const shapeEle = this.shapeEle
+      if (this.tool === 'circle') {
+        shapeEle.setAttribute('cx', rect.left + rect.width / 2,)
+        shapeEle.setAttribute('cy', rect.top + rect.height / 2,)
+        shapeEle.setAttribute('rx', (rect.width - 1) / 2,)
+        shapeEle.setAttribute('ry', (rect.height - 1) / 2,)
+      } else if (this.tool === 'square') {
+        shapeEle.setAttribute('x', rect.left + 1 / 2,)
+        shapeEle.setAttribute('y', rect.top - 1 / 2,)
+        shapeEle.setAttribute('width', `${Math.abs(rect.width - 1)}px`,)
+        shapeEle.setAttribute('height', `${Math.abs(rect.height - 1)}px`,)
+      } else if (this.tool === 'line' || this.tool === 'arrow') {
+        shapeEle.setAttribute('x1', this.initStartPoint.x);
+        shapeEle.setAttribute('y1', this.initStartPoint.y);
+        shapeEle.setAttribute('x2', this.initEndPoint.x);
+        shapeEle.setAttribute('y2', this.initEndPoint.y);
+
+        if (this.tool === 'arrow') {
+          let tail = this.svgElement.querySelector('[tail]')
+          if (tail) {
+            let arrowBuild = new ArrowHelper(this.initStartPoint, this.initEndPoint)
+            let arrowLength = 12 * scale
+            let arrowPoints = arrowBuild.getEndArrowPoints(30, arrowLength)
+            let points = ''
+            arrowPoints.forEach(element => {
               if (points.length > 0) {
-                tail.setAttribute('points', points)
+                points = points + ' '
               }
+              points = points + `${element.x},${element.y}`
+            });
+            if (points.length > 0) {
+              tail.setAttribute('points', points)
             }
           }
-        } else if (this.tool === 'ink') {
-          this.path.push([x, y])
-          const d = this.getFreeDrawSvgPath()
-          shapeEle.setAttribute('d', d)
         }
+      } else if (this.tool === 'ink') {
+        this.path.push([x, y])
+        const d = this.getFreeDrawSvgPath()
+        shapeEle.setAttribute('d', d)
       }
     }
   }

+ 1 - 3
packages/core/src/annotation/stamp.js

@@ -85,8 +85,6 @@ export default class Stamp extends Base {
       this.annotation.rect = rect
     }
 
-    console.log(this.annotation)
-
     for (let key in this.annotation) {
       if ((key === 'date') && this.annotation.type === 'stamp') {
         let newName = 'textStampSecondstring'
@@ -122,7 +120,7 @@ export default class Stamp extends Base {
 
     let imgEle = null
 
-    imgEle =  document.createElement('img')
+    imgEle = document.createElement('img')
     imgEle.style.width = "100%"
     imgEle.style.height = "100%"
 

+ 2 - 2
packages/core/src/worker/compdfkit_worker.js

@@ -144,8 +144,8 @@ class CPDFWorker {
 
     messageHandler.on('GetRenderAnnot', (data) => {
       const { annotPtr, annotation, scale } = data
-      const width = parseInt((annotation.rect.right - annotation.rect.left) * scale + 1)
-      const height = parseInt((annotation.rect.bottom - annotation.rect.top) * scale + 1)
+      const width = parseInt(annotation.rect.right * scale - annotation.rect.left * scale + 1)
+      const height = parseInt(annotation.rect.bottom * scale - annotation.rect.top * scale + 1)
       let pixelNum = width * height
 
       let imageBytes = pixelNum * 4

+ 5 - 5
packages/webview/src/components/DocumentContainer/DocumentContainer.vue

@@ -97,14 +97,14 @@ async function handleUpload(evt) {
     pageMode: 0,
     scrollMode: 'Vertical',
     activeTab: 0,
-    activeLeftPanel: 'THUMBS',
-    activeLeftPanelTab: 'THUMBS',
-    activeRightPanel: 'THUMBS',
-    activeRightPanelTab: 'GENERAL',
     searchStatus: false,
-    openElements: {
+    activeElements: {
       leftPanel: false,
       rightPanel: false
+    },
+    activeElementsTab: {
+      leftPanelTab: 'THUMBS',
+      rightPanelTab: 'GENERAL'
     }
   })
   useDocument.resetSetting()