...
 
Commits (2)
......@@ -75,7 +75,7 @@
@dragstart="event => {handleCellDragStart(event, annotation)}",
@dragend="event => {handleCellDragEnd(event, annotation)}",
@contextmenu="handleCellContextMenu",
:style="getAnnotationStyle(annotation)",
:style="getCellStyle(annotation)",
:class="getAnnotationClasses(annotation._uuid, 'cell-item')",
:key="`cell-${index}`")
......@@ -125,12 +125,12 @@
//----------------------------------------------------------------------------------------------- temporary cell
//------------------------------------------------------------------------------------------------------ desktop
template(v-for="(tmpCell, index) in tmpObjects")
.cell-item.cell-item-tmp(:style="getAnnotationStyle(tmpCell)", :key="`cell-tmp-${index}`")
.cell-item.cell-item-tmp(:style="getCellStyle(tmpCell)", :key="`cell-tmp-${index}`")
cell(:cell="tmpCell")
//------------------------------------------------------------------------------------------------------- mobile
template(v-if="mobileTempCell.show && cachedNewCell")
.cell-item.cell-item-tmp-mobile(:style="mobileTempCellStyle(mobileTempCell)")
.cell-item.cell-item-tmp-mobile(:style="getCellStyle(mobileTempCell)")
//------------------------------------------------------------------------------------------------------ handler
//--------------------------------------------------------------------------------------------------------- move
......@@ -174,7 +174,7 @@
// ---------------------------------------------------------------------------------------------------------------
template(v-else)
.cell-item(:style="getAnnotationStyle({x:0,y:0,width:1,height:1})", key="cell-grid-resizer")
.cell-item(:style="getCellStyle({x:0,y:0,width:1,height:1})", key="cell-grid-resizer")
div.cell-item-resize-handle(
draggable="true",
@dragstart="event => {handleGridResizerDragStart(event)}",
......@@ -1046,21 +1046,29 @@
}
}
},
mobileTempCellStyle (obj) {
return {
'grid-column-start': obj.x,
'grid-column-end': `span ${obj.width}`,
'grid-row-start': obj.y,
'grid-row-end': `span ${obj.height}`
getCellStyle (obj) {
let x, y, w, h
// ----- existing cell
if (obj.id) {
const parsed = obj.target.selector.parse()
x = parsed.xywh[0]
y = parsed.xywh[1]
w = parsed.xywh[2]
h = parsed.xywh[3]
}
// ----- temp cell
else {
x = obj.x
y = obj.y
w = obj.width
h = obj.height
}
},
getAnnotationStyle (annotation) {
const parsed = annotation.target.selector.parse()
return {
'grid-column-start': parsed.xywh[0],
'grid-column-end': `span ${parsed.xywh[2]}`,
'grid-row-start': parsed.xywh[1],
'grid-row-end': `span ${parsed.xywh[3]}`
'grid-column-start': x,
'grid-column-end': `span ${w}`,
'grid-row-start': y,
'grid-row-end': `span ${h}`
}
},
getAnnotationClasses (uuid, which) {
......