Merge pull request #1 from shishirraven/patch-3

Added sizeInPixel for resize and resized events
rexhent · Jul 7, 2024 · be9267c · be9267c
2 parents dfcb806 + 80e3f22
commit be9267c
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/src/components/splitpanes/splitpanes.vue b/src/components/splitpanes/splitpanes.vue
@@ -93,13 +93,16 @@ export default {
         event.preventDefault()
         this.touch.dragging = true
         this.calculatePanesSize(this.getCurrentMouseDrag(event))
-        this.$emit('resize', this.panes.map(pane => ({ min: pane.min, max: pane.max, size: pane.size })))
+        var containerSize = this.container[this.horizontal ? 'clientHeight' : 'clientWidth']
+        this.$emit('resize', this.panes.map(pane => ({ min: pane.min, max: pane.max, size: pane.size, sizeInPixel: (containerSize/100)*pane.size })))
+     
       }
     },
 
     onMouseUp () {
       if (this.touch.dragging) {
-        this.$emit('resized', this.panes.map(pane => ({ min: pane.min, max: pane.max, size: pane.size })))
+         var containerSize = this.container[this.horizontal ? 'clientHeight' : 'clientWidth']
+         this.$emit('resized', this.panes.map(pane => ({ min: pane.min, max: pane.max, size: pane.size, sizeInPixel: (containerSize/100)*pane.size })))
       }
       this.touch.mouseDown = false
       // Keep dragging flag until click event is finished (click happens immediately after mouseup)