archive/pillar
0
0
Fork 0
Code Issues 42 Pull Requests Projects Releases Wiki Activity

Silence warning about changing prop value

Browse Source
This commit is contained in:
Tobias Johansson 2019-04-04 10:18:24 +02:00
parent 1b42d114ad
commit fe2f350013
2 changed files with 17 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/scripts/js/es6/common/vuecomponents/init.js
View File

@ -28,7 +28,6 @@ let mixins = {
let table = { let table = {
PillarTable, PillarTable,
TableState,
columns: { columns: {
ColumnBase, ColumnBase,
Created, Created,

51
src/scripts/js/es6/common/vuecomponents/table/Table.js
View File

@ -5,24 +5,6 @@ import './rows/filter/RowFilter'
import {UnitOfWorkTracker} from '../mixins/UnitOfWorkTracker' import {UnitOfWorkTracker} from '../mixins/UnitOfWorkTracker'
import {RowFilter} from './rows/filter/RowFilter' import {RowFilter} from './rows/filter/RowFilter'
/**
* Table State
*
* Used to restore a table to a given state.
*/
class TableState {
constructor(selectedIds) {
this.selectedIds = selectedIds || [];
}
/**
* Apply state to row
* @param {RowBase} rowObject
*/
applyRowState(rowObject) {
rowObject.isSelected = this.selectedIds.includes(rowObject.getId());
}
}
class ComponentState { class ComponentState {
/** /**
@ -116,6 +98,7 @@ let PillarTable = Vue.component('pillar-table-base', {
}, },
data: function() { data: function() {
return { return {
currentlySelectedIds: [],
columns: [], columns: [],
visibleColumns: [], visibleColumns: [],
visibleRowObjects: [], visibleRowObjects: [],
@ -161,6 +144,9 @@ let PillarTable = Vue.component('pillar-table-base', {
}, },
watch: { watch: {
selectedIds(newValue) { selectedIds(newValue) {
this.currentlySelectedIds = newValue;
},
currentlySelectedIds(newValue) {
this.rowAndChildObjects.forEach(item => { this.rowAndChildObjects.forEach(item => {
item.isSelected = newValue.includes(item.getId()); item.isSelected = newValue.includes(item.getId());
}); });
@ -188,8 +174,6 @@ let PillarTable = Vue.component('pillar-table-base', {
} }
}, },
created() { created() {
let tableState = new TableState(this.selectedIds);
this.unitOfWork( this.unitOfWork(
Promise.all([ Promise.all([
this.columnFactory.thenGetColumns(), this.columnFactory.thenGetColumns(),
@ -200,12 +184,11 @@ let PillarTable = Vue.component('pillar-table-base', {
return this.rowsSource.thenInit(); return this.rowsSource.thenInit();
}) })
.then(() => { .then(() => {
let currentlySelectedIds = this.selectedItems.map(it => it._id); if (this.currentlySelectedIds.length === 0) {
if (currentlySelectedIds.length > 0) { this.currentlySelectedIds = this.selectedIds;
} else {
// User has clicked on a row while we inited the rows. Keep that selection! // User has clicked on a row while we inited the rows. Keep that selection!
tableState.selectedIds = currentlySelectedIds;
} }
this.rowAndChildObjects.forEach(tableState.applyRowState.bind(tableState));
this.isInitialized = true; this.isInitialized = true;
}) })
.catch((err) => {toastr.error(pillar.utils.messageFromError(err), 'Loading table failed')}) .catch((err) => {toastr.error(pillar.utils.messageFromError(err), 'Loading table failed')})
@ -234,24 +217,24 @@ let PillarTable = Vue.component('pillar-table-base', {
if(!this.canChangeSelectionCB()) return; if(!this.canChangeSelectionCB()) return;
if(this.isMultiToggleClick(clickEvent) && this.canMultiSelect) { if(this.isMultiToggleClick(clickEvent) && this.canMultiSelect) {
let slectedIdsWithoutClicked = this.selectedIds.filter(id => id !== itemId); let slectedIdsWithoutClicked = this.currentlySelectedIds.filter(id => id !== itemId);
if (slectedIdsWithoutClicked.length < this.selectedIds.length) { if (slectedIdsWithoutClicked.length < this.currentlySelectedIds.length) {
this.selectedIds = slectedIdsWithoutClicked; this.currentlySelectedIds = slectedIdsWithoutClicked;
} else { } else {
this.selectedIds = [itemId, ...this.selectedIds]; this.currentlySelectedIds = [itemId, ...this.currentlySelectedIds];
} }
} else if(this.isSelectBetweenClick(clickEvent) && this.canMultiSelect) { } else if(this.isSelectBetweenClick(clickEvent) && this.canMultiSelect) {
if (this.selectedIds.length > 0) { if (this.currentlySelectedIds.length > 0) {
let betweenA = this.selectedIds[this.selectedIds.length -1]; let betweenA = this.currentlySelectedIds[this.currentlySelectedIds.length -1];
let betweenB = itemId; let betweenB = itemId;
this.selectedIds = this.rowsBetween(betweenA, betweenB).map(it => it.getId()); this.currentlySelectedIds = this.rowsBetween(betweenA, betweenB).map(it => it.getId());
} else { } else {
this.selectedIds = [itemId]; this.currentlySelectedIds = [itemId];
} }
} }
else { else {
this.selectedIds = [itemId]; this.currentlySelectedIds = [itemId];
} }
}, },
isSelectBetweenClick(clickEvent) { isSelectBetweenClick(clickEvent) {
@ -287,4 +270,4 @@ let PillarTable = Vue.component('pillar-table-base', {
} }
}); });
export { PillarTable, TableState } export { PillarTable }