Fixed draggable rows
parent
5b52ee6df1
commit
b36f1d8b0f
|
@ -29,7 +29,8 @@
|
|||
@column-resizestart="onColumnResizeStart($event)" @checkbox-change="toggleRowsWithCheckbox($event)" />
|
||||
<DTTableBody :value="dataToRender" :columns="columns" :empty="empty" :dataKey="dataKey" :selection="selection" :selectionKeys="d_selectionKeys" :selectionMode="selectionMode"
|
||||
:rowGroupMode="rowGroupMode" :groupRowsBy="groupRowsBy" :expandableRowGroups="expandableRowGroups" :rowClass="rowClass" :editMode="editMode" :compareSelectionBy="compareSelectionBy"
|
||||
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowGroups="expandedRowGroups"
|
||||
:expandedRowIcon="expandedRowIcon" :collapsedRowIcon="collapsedRowIcon" :expandedRows="expandedRows" :expandedRowKeys="d_expandedRowKeys" :expandedRowGroups="expandedRowGroups"
|
||||
:editingRows="editingRows" :editingRowKeys="d_editingRowKeys"
|
||||
@rowgroup-toggle="toggleRowGroup" @row-click="onRowClick($event)" @row-touchend="onRowTouchEnd" @row-keydown="onRowKeyDown"
|
||||
@row-mousedown="onRowMouseDown" @row-dragstart="onRowDragStart($event)" @row-dragover="onRowDragOver($event)" @row-dragleave="onRowDragLeave($event)" @row-dragend="onRowDragEnd($event)" @row-drop="onRowDrop($event)"
|
||||
@row-toggle="toggleRow($event)" @radio-change="toggleRowWithRadio($event)" @checkbox-change="toggleRowWithCheckbox($event)"
|
||||
|
@ -1090,14 +1091,14 @@ export default {
|
|||
},
|
||||
onRowDragStart(e) {
|
||||
const event = e.originalEvent;
|
||||
const index = e.rowIndex;
|
||||
const index = e.index;
|
||||
this.rowDragging = true;
|
||||
this.draggedRowIndex = index;
|
||||
event.dataTransfer.setData('text', 'b'); // For firefox
|
||||
},
|
||||
onRowDragOver(e) {
|
||||
const event = e.originalEvent;
|
||||
const index = e.rowIndex;
|
||||
const index = e.index;
|
||||
|
||||
if (this.rowDragging && this.draggedRowIndex !== index) {
|
||||
let rowElement = event.currentTarget;
|
||||
|
|
|
@ -16,10 +16,10 @@
|
|||
@mousedown="onRowMouseDown($event)" @dragstart="onRowDragStart($event, index)" @dragover="onRowDragOver($event,index)" @dragleave="onRowDragLeave($event)" @dragend="onRowDragEnd($event)" @drop="onRowDrop($event)">
|
||||
<template v-for="(col,i) of columns">
|
||||
<DTBodyCell v-if="shouldRenderBodyCell(value, col, index)" :key="col.columnKey||col.field||i" :rowData="rowData" :column="col" :index="index" :selected="isSelected(rowData)"
|
||||
:rowTogglerIcon="col.expander ? rowTogglerIcon(rowData): null" @row-toggle="onRowToggle($event)"
|
||||
@radio-change="onRadioChange($event)" @checkbox-change="onCheckboxChange($event)"
|
||||
:rowTogglerIcon="col.expander ? rowTogglerIcon(rowData): null"
|
||||
:rowspan="rowGroupMode === 'rowspan' ? calculateRowGroupSize(value, col, index) : null"
|
||||
:editMode="editMode" :editing="editMode === 'row' && isRowEditing(rowData)"
|
||||
@radio-change="onRadioChange($event)" @checkbox-change="onCheckboxChange($event)" @row-toggle="onRowToggle($event)"
|
||||
@cell-edit-init="onCellEditInit($event)" @cell-edit-complete="onCellEditComplete($event)" @cell-edit-cancel="onCellEditCancel($event)"
|
||||
@row-edit-init="onRowEditInit($event)" @row-edit-save="onRowEditSave($event)" @row-edit-cancel="onRowEditCancel($event)"/>
|
||||
</template>
|
||||
|
@ -93,6 +93,10 @@ export default {
|
|||
type: Array,
|
||||
default: null
|
||||
},
|
||||
expandedRowKeys: {
|
||||
type: null,
|
||||
default: null
|
||||
},
|
||||
selection: {
|
||||
type: [Array,Object],
|
||||
default: null
|
||||
|
@ -116,6 +120,14 @@ export default {
|
|||
compareSelectionBy: {
|
||||
type: String,
|
||||
default: 'deepEquals'
|
||||
},
|
||||
editingRows: {
|
||||
type: Array,
|
||||
default: null
|
||||
},
|
||||
editingRowKeys: {
|
||||
type: null,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
@ -238,7 +250,7 @@ export default {
|
|||
isRowEditing(rowData) {
|
||||
if (rowData && this.editingRows) {
|
||||
if (this.dataKey)
|
||||
return this.d_editingRowKeys ? this.d_editingRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
|
||||
return this.editingRowKeys ? this.editingRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
|
||||
else
|
||||
return this.findIndex(rowData, this.editingRows) > -1;
|
||||
}
|
||||
|
@ -248,7 +260,7 @@ export default {
|
|||
isRowExpanded(rowData) {
|
||||
if (rowData && this.expandedRows) {
|
||||
if (this.dataKey)
|
||||
return this.d_expandedRowKeys ? this.d_expandedRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
|
||||
return this.expandedRowKeys ? this.expandedRowKeys[ObjectUtils.resolveFieldData(rowData, this.dataKey)] !== undefined : false;
|
||||
else
|
||||
return this.findIndex(rowData, this.expandedRows) > -1;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue