First version of multicheck selection
gitea/salix/pipeline/head There was a failure building this commit Details

This commit is contained in:
Joan Sanchez 2020-09-01 15:13:33 +02:00
parent ecb98dfac5
commit 6a065091de
2 changed files with 40 additions and 4 deletions

View File

@ -1,5 +1,5 @@
<vn-check <vn-check
ng-model="$ctrl.checked" ng-model="$ctrl.checked"
intermediate="$ctrl.isIntermediate" indeterminate="$ctrl.isIndeterminate"
translate-attr="{title: 'Check all'}"> translate-attr="{title: 'Check all'}">
</vn-check> </vn-check>

View File

@ -15,6 +15,19 @@ export default class MultiCheck extends FormInput {
this._checked = false; this._checked = false;
this.checkField = 'checked'; this.checkField = 'checked';
this.isIntermediate = false; this.isIntermediate = false;
this.mayusEnabled = false;
this.window.addEventListener('keydown', event => {
if (event.key === 'Shift')
this.mayusEnabled = true;
});
this.window.addEventListener('keyup', event => {
if (event.key === 'Shift')
this.mayusEnabled = false;
});
this.window.addEventListener('selectstart', event => {
if (this.mayusEnabled)
event.preventDefault();
});
} }
/** /**
@ -28,7 +41,7 @@ export default class MultiCheck extends FormInput {
/** /**
* Sets the array model instance * Sets the array model instance
* Changes intermediate property for * Changes indeterminate property for
* the check component * the check component
* *
* @param {ArrayModel} value - Array model instance * @param {ArrayModel} value - Array model instance
@ -37,8 +50,17 @@ export default class MultiCheck extends FormInput {
this._model = value; this._model = value;
if (value) { if (value) {
value.on('rowChange', () => { value.on('rowChange', row => {
this.isIntermediate = !this.areAllUnchecked() && !this.areAllChecked(); this.isIndeterminate = !this.areAllUnchecked() && !this.areAllChecked();
if (this.mayusEnabled) {
this.currentSelection = row.obj.$orgIndex;
if (this.lastSelection != undefined && this.currentSelection != undefined)
this.setSelection(row.value, this.lastSelection, this.currentSelection);
}
this.lastSelection = row.obj.$orgIndex;
if (this.areAllChecked()) if (this.areAllChecked())
this._checked = true; this._checked = true;
@ -52,6 +74,20 @@ export default class MultiCheck extends FormInput {
} }
} }
setSelection(value, from, to) {
let start = from;
let end = to;
if (from > to) {
start = to;
end = from;
}
const data = this.model.data;
for (let i = start; i <= end; i++)
data[i].checked = value;
}
/** /**
* Gets current check state * Gets current check state
*/ */