feat:painter double click continuous use

src/editor/core/command/Command.ts

@@ -1,7 +1,7 @@
 import { IElement } from '../..'
 import { EditorMode } from '../../dataset/enum/Editor'
 import { RowFlex } from '../../dataset/enum/Row'
-import { IDrawImagePayload } from '../../interface/Draw'
+import { IDrawImagePayload, IPainterOptions } from '../../interface/Draw'
 import { IEditorResult } from '../../interface/Editor'
 import { IWatermark } from '../../interface/Watermark'
 import { CommandAdapt } from './CommandAdapt'
@@ -155,8 +155,8 @@ export class Command {
     return Command.redo()
   }
 
-  public executePainter() {
-    return Command.painter()
+  public executePainter(options: IPainterOptions) {
+    return Command.painter(options)
   }
 
   public executeApplyPainterStyle() {

src/editor/core/command/CommandAdapt.ts

@@ -6,7 +6,7 @@ import { EditorContext, EditorMode } from '../../dataset/enum/Editor'
 import { ElementType } from '../../dataset/enum/Element'
 import { ElementStyleKey } from '../../dataset/enum/ElementStyle'
 import { RowFlex } from '../../dataset/enum/Row'
-import { IDrawImagePayload } from '../../interface/Draw'
+import { IDrawImagePayload, IPainterOptions } from '../../interface/Draw'
 import { IEditorOption, IEditorResult } from '../../interface/Editor'
 import { IElement, IElementStyle } from '../../interface/Element'
 import { IColgroup } from '../../interface/table/Colgroup'
@@ -126,7 +126,7 @@ export class CommandAdapt {
     this.historyManager.redo()
   }
 
-  public painter() {
+  public painter(options: IPainterOptions) {
     const isReadonly = this.draw.isReadonly()
     if (isReadonly) return
     const selection = this.range.getSelection()
@@ -141,7 +141,7 @@ export class CommandAdapt {
         }
       })
     })
-    this.draw.setPainterStyle(painterStyle)
+    this.draw.setPainterStyle(painterStyle, options)
   }
 
   public applyPainterStyle() {

src/editor/core/draw/Draw.ts

@@ -1,7 +1,7 @@
 import { version } from '../../../../package.json'
 import { ZERO } from '../../dataset/constant/Common'
 import { RowFlex } from '../../dataset/enum/Row'
-import { IDrawOption, IDrawRowPayload, IDrawRowResult } from '../../interface/Draw'
+import { IDrawOption, IDrawRowPayload, IDrawRowResult, IPainterOptions } from '../../interface/Draw'
 import { IEditorOption, IEditorResult } from '../../interface/Editor'
 import { IElement, IElementMetrics, IElementPosition, IElementFillRect, IElementStyle } from '../../interface/Element'
 import { IRow, IRowElement } from '../../interface/Row'
@@ -81,6 +81,7 @@ export class Draw {
 
   private rowList: IRow[]
   private painterStyle: IElementStyle | null
+  private painterOptions: IPainterOptions | null
   private searchKeyword: string | null
   private visiblePageNoList: number[]
   private intersectionPageNo: number
@@ -138,6 +139,7 @@ export class Draw {
 
     this.rowList = []
     this.painterStyle = null
+    this.painterOptions = null
     this.searchKeyword = null
     this.visiblePageNoList = []
     this.intersectionPageNo = 0
@@ -327,8 +329,13 @@ export class Draw {
     return this.painterStyle && Object.keys(this.painterStyle).length ? this.painterStyle : null
   }
 
-  public setPainterStyle(payload: IElementStyle | null) {
+  public getPainterOptions(): IPainterOptions | null {
+    return this.painterOptions
+  }
+
+  public setPainterStyle(payload: IElementStyle | null, options?: IPainterOptions) {
     this.painterStyle = payload
+    this.painterOptions = options || null
     if (this.getPainterStyle()) {
       this.pageList.forEach(c => c.style.cursor = 'copy')
     }

src/editor/core/event/CanvasEvent.ts

@@ -74,10 +74,14 @@ export class CanvasEvent {
     }
   }
 
-  public applyPainterStyle() {
+  public clearPainterStyle() {
     this.pageList.forEach(p => {
       p.style.cursor = 'text'
     })
+    this.draw.setPainterStyle(null)
+  }
+
+  public applyPainterStyle() {
     const painterStyle = this.draw.getPainterStyle()
     if (!painterStyle) return
     const selection = this.range.getSelection()
@@ -89,8 +93,12 @@ export class CanvasEvent {
         s[key] = painterStyle[key] as any
       })
     })
-    this.draw.setPainterStyle(null)
     this.draw.render({ isSetCursor: false })
+    // 清除格式刷
+    const painterOptions = this.draw.getPainterOptions()
+    if (!painterOptions || !painterOptions.isDblclick) {
+      this.clearPainterStyle()
+    }
   }
 
   public mousemove(evt: MouseEvent) {
@@ -435,6 +443,8 @@ export class CanvasEvent {
         this.listener.saved(this.draw.getValue())
       }
       evt.preventDefault()
+    } else if (evt.key === KeyMap.ESC) {
+      this.clearPainterStyle()
     }
   }
 

src/editor/dataset/enum/Keymap.ts

@@ -6,6 +6,7 @@ export enum KeyMap {
   Right = 'ArrowRight',
   Up = 'ArrowUp',
   Down = 'ArrowDown',
+  ESC = 'Escape',
   A = 'a',
   C = 'c',
   S = 's',

src/editor/interface/Draw.ts

@@ -35,4 +35,8 @@ export interface IDrawRowResult {
   x: number;
   y: number;
   index: number;
+}
+
+export interface IPainterOptions {
+  isDblclick: boolean;
 }

src/main.ts

@@ -30,7 +30,15 @@ window.onload = function () {
   const painterDom = document.querySelector<HTMLDivElement>('.menu-item__painter')!
   painterDom.onclick = function () {
     console.log('painter')
-    instance.command.executePainter()
+    instance.command.executePainter({
+      isDblclick: false
+    })
+  }
+  painterDom.ondblclick = function () {
+    console.log('painter')
+    instance.command.executePainter({
+      isDblclick: true
+    })
   }
 
   document.querySelector<HTMLDivElement>('.menu-item__format')!.onclick = function () {