Adjustable Time Strip view: column resizing

- Column resizing now shows the horizontal resize handle on the Time axis swimlane only. Handle now uses `:height` from the extended overlay lines to extend across all swimlanes.
- TODO: fix regressions in Plan/Gantt view affecting swimlane height and overflow handling.
This commit is contained in:
Charles Hacskaylo 2025-03-03 22:18:54 -08:00
parent 03473ef28f
commit 2a1782522d
3 changed files with 24 additions and 4 deletions

View File

@ -25,6 +25,8 @@
<SwimLane
v-for="timeSystemItem in timeSystems"
:key="timeSystemItem.timeSystem.key"
:canShowResizeHandle="true"
:resizeHandleHeight="height"
class="c-swimlane__time-axis"
>
<template #label>

View File

@ -56,7 +56,12 @@
@click="pressOnButton"
/>
</div>
<div class="c-swimlane__handle horizontal" @mousedown="mousedown"></div>
<div
v-if="canShowResizeHandle"
class="c-swimlane__handle horizontal"
:style="{ height: `${resizeHandleHeight}px` }"
@mousedown="mousedown"
></div>
</div>
<div
@ -118,6 +123,19 @@ export default {
return false;
}
},
canShowResizeHandle: {
type: Boolean,
default() {
return false;
}
},
resizeHandleHeight: {
type: Number,
required: false,
default() {
return 32;
}
},
spanRowsCount: {
type: Number,
default() {

View File

@ -55,6 +55,7 @@
&__handle {
$size: $handleSize;
$margin: $handleMargin;
z-index: 2;
@include resizeHandleStyle($size, $margin);
@ -69,7 +70,7 @@
&.horizontal {
// Resizes in X dimension
left: auto;
right: -1 * $handleHitSize;
right: math.floor($handleHitSize * -0.5);
width: $handleHitSize;
}
}
@ -102,8 +103,7 @@
}
.is-editing & {
// TODO: BETTER SELECTOR TO LIMIT STYLING TO TIME STRIP IN MAIN VIEW, NOT NESTED VIEWS
grid-column-gap: $handleHitSize;
//grid-column-gap: $handleHitSize;
.c-swimlane__handle {
display: block;
}