Jelajahi Sumber

fix: 重新渲染页面时不重新加载editPage

wzl 7 bulan lalu
induk
melakukan
8f38387a54

+ 40 - 22
packages/core/src/editor/content_container.js

@@ -14,16 +14,16 @@ export class ContentContainer {
     this.viewport = options.viewport
     this.scale = options.scale
     this.$t = options.$t
-    this.undoList = options.undoList
-    this.redoList = options.redoList
+    this.historyManager = options.historyManager
 
-    this._cancelled = false
     this.destroyed = false
     this.rendered = false
     this.frameEditorList = []
     this.tool = this.pageViewer.tool || ''
     this.color = this.pageViewer.color || ''
     this._selectedFrameIndex = -1
+    this.undoList = this.historyManager.undoList
+    this.redoList = this.historyManager.redoList
 
     this.onHandleTool = this.handleTool.bind(this)
     this.onKeydown = this.handleKeyDown.bind(this)
@@ -31,14 +31,34 @@ export class ContentContainer {
   }
 
   async init() {
+    this.undoList.length = 0
+    this.redoList.length = 0
+    this.eventBus.dispatch('changeOperateList', {
+      undoListLength: this.undoList.length,
+      redoListLength: this.redoList.length
+    })
+
     const { editPagePtr } = await this.messageHandler.sendWithPromise('InitEditPage', {
       pagePtr: this.pagePtr
     })
     this.editPagePtr = editPagePtr
+
+    const result = await this.messageHandler.sendWithPromise('BeginEdit', {
+      editPagePtr: this.editPagePtr,
+      type: 1 | 2
+    })
+    if (result && result.code) {
+      console.log(result.message)
+      alert(result.message)
+      return false
+    }
+
+    document.addEventListener('keydown', this.onKeydown)
+    this.render()
   }
 
   async render () {
-    if (this._cancelled || this.contentContainer) {
+    if (this.contentContainer) {
       return;
     }
 
@@ -46,24 +66,11 @@ export class ContentContainer {
     contentContainer.className = 'contentContainer'
     this.contentContainer = contentContainer
     this.pageDiv.append(this.contentContainer)
-
-    await this.init()
     
     this.eventBus._on('toolChanged', this.onHandleTool)
     this.eventBus._on('pagechanging', this.onPageChanging)
-    document.addEventListener('keydown', this.onKeydown)
-
-    const result = await this.messageHandler.sendWithPromise('BeginEdit', {
-      editPagePtr: this.editPagePtr,
-      type: 1 | 2
-    })
-
-    if (result && result.code) {
-      console.log(result.message)
-      alert(result.message)
-      return false
-    }
 
+    this.frameEditorList.length = 0
     const editAreaCount = await this.messageHandler.sendWithPromise('GetEditAreaCount', this.editPagePtr)
     
     for (let i = 0; i < editAreaCount; i++) {
@@ -143,8 +150,21 @@ export class ContentContainer {
   }
   
   cancel () {
-    this._cancelled = true
-    this.destroy()
+    if (this.destroyed || !this.rendered) return
+
+    this.contentContainer?.remove()
+    this.contentContainer = null
+
+    if (this.textManager) {
+      this.textManager.tool = ''
+      this.textManager.reset()
+    }
+    if (this.imageManager) {
+      this.imageManager.tool = ''
+      this.imageManager.reset()
+    }
+
+    this.eventBus._off('toolChanged', this.onHandleTool)
   }
 
   destroy () {
@@ -163,8 +183,6 @@ export class ContentContainer {
     }
 
     this.destroyed = true
-    this.undoList.length = 0
-    this.redoList.length = 0
 
     this.eventBus._off('toolChanged', this.onHandleTool)
     document.removeEventListener('keydown', this.onKeydown)

+ 1 - 4
packages/core/src/editor/image_editor.js

@@ -59,7 +59,6 @@ export class ImageEditor {
     this.newStart = null
     this.newEnd = null
     this.needUndoRec = false // 执行操作后,需要添加撤销记录
-    this.replaced = false
 
     this.mousedown = isMobileDevice ? 'touchstart' : 'mousedown'
     this.mouseup = isMobileDevice ? 'touchend' : 'mouseup'
@@ -1085,7 +1084,6 @@ export class ImageEditor {
           this.eventBus.dispatch('contentPropertyChange', { type: 'image', opacity: this.opacity * 100 })
 
           this.needUndoRec = true
-          this.replaced = true
           this.saveEdit()
         })
         .catch((error) => {
@@ -1470,8 +1468,7 @@ export class ImageEditor {
       editPagePtr: this.editPagePtr,
       editAreaIndex: this.editAreaIndex,
       editAreaPtr: this.editAreaPtr,
-      pageIndex: this.pageViewer.pageIndex,
-      replacedImage: this.replaced
+      pageIndex: this.pageViewer.pageIndex
     })
   }
 

+ 6 - 0
packages/core/src/history_manager.js

@@ -0,0 +1,6 @@
+export class HistoryManager {
+  constructor() {
+    this.undoList = []
+    this.redoList = []
+  }
+}

+ 13 - 20
packages/core/src/pdf_page_view.js

@@ -167,8 +167,7 @@ class PDFPageView {
     this.eventBus._on('search', this.handleSearch.bind(this))
 
     this.mode = null
-    this.undoList = []
-    this.redoList = []
+    this.historyManager = options.historyManager
 
     container?.style.setProperty(
       "--scale-factor",
@@ -280,7 +279,7 @@ class PDFPageView {
     this.toolMode = mode
     if (this.contentContainer) {
       if (mode === 'editor') {
-        await this.contentContainer.render()
+        await this.contentContainer.init()
       } else {
         this.contentContainer.destroy()
       }
@@ -571,11 +570,10 @@ class PDFPageView {
               pagePtr: this.pagesPtr[this.pageIndex].pagePtr,
               messageHandler: this.messageHandler,
               $t: this.$t,
-              undoList: this.undoList,
-              redoList: this.redoList
+              historyManager: this.historyManager
             })
-          }
-          if (this.mode === 'editor') {
+            this.mode === 'editor' && this.contentContainer.init()
+          } else if (this.mode === 'editor') {
             await this.contentContainer.render()
           }
 
@@ -981,7 +979,7 @@ class PDFPageView {
     }
     if (this.contentContainer) {
       this.contentContainer.cancel();
-      this.contentContainer = null;
+      this.contentContainer = null
     }
 
     if (this.textSelection) {
@@ -1092,11 +1090,9 @@ class PDFPageView {
         pagePtr: this.pagesPtr[this.pageIndex].pagePtr,
         messageHandler: this.messageHandler,
         $t: this.$t,
-        undoList: this.undoList,
-        redoList: this.redoList
+        historyManager: this.historyManager
       })
-
-      await this.contentContainer.render()
+      await this.contentContainer.init()
     }
 
     this.contentContainer.addTextEditor(data)
@@ -1119,11 +1115,9 @@ class PDFPageView {
         pagePtr: this.pagesPtr[this.pageIndex].pagePtr,
         messageHandler: this.messageHandler,
         $t: this.$t,
-        undoList: this.undoList,
-        redoList: this.redoList
+        historyManager: this.historyManager
       })
-
-      await this.contentContainer.render()
+      await this.contentContainer.init()
     }
 
     return this.contentContainer.frameEditorList
@@ -1258,11 +1252,10 @@ class PDFPageView {
               pagePtr: this.pagesPtr[this.pageIndex].pagePtr,
               messageHandler: this.messageHandler,
               $t: this.$t,
-              undoList: this.undoList,
-              redoList: this.redoList
+              historyManager: this.historyManager
             })
-          }
-          if (this.mode === 'editor') {
+            this.mode === 'editor' && this.contentContainer.init()
+          } else if (this.mode === 'editor') {
             await this.contentContainer.render()
           }
 

+ 3 - 1
packages/core/src/pdf_viewer.js

@@ -37,6 +37,7 @@ import {
 } from "./ui_utils.js";
 
 import { PDFPageView } from "./pdf_page_view.js";
+import { HistoryManager } from "./history_manager.js";
 
 const DEFAULT_CACHE_SIZE = 3;
 const ENABLE_PERMISSIONS_CLASS = "enablePermissions";
@@ -652,7 +653,8 @@ class PDFViewer {
             l10n: this.l10n,
             $t: this.$t,
             doc: this.doc,
-            messageHandler: this.messageHandler
+            messageHandler: this.messageHandler,
+            historyManager: new HistoryManager({ pageIndex: pageNum - 1,  }),
           });
           this._pages.push(pageView);
         }