salix/front/core/components/step-control/step-control.js

86 lines
1.8 KiB
JavaScript

import ngModule from '../../module';
import './style.scss';
export default class StepControl {
constructor($state) {
this.$state = $state;
}
set steps(steps) {
if (!steps) return;
this._steps = steps;
if (this.currentStepIndex > 0)
this.$state.go(this._steps[0].state);
}
set currentState(state) {
if (!this.onStepChange)
return this.$state.go(state);
let change = this.onStepChange({state});
if (typeof change === 'object' && change.then) {
return change.then(isAllowed => {
if (isAllowed)
this.$state.go(state);
});
}
if (change)
this.$state.go(state);
}
get totalSteps() {
return this._steps.length;
}
get currentState() {
return this.$state.current.name;
}
get currentStepIndex() {
for (let i = 0; i < this._steps.length; i++) {
if (this._steps[i].state == this.$state.current.name)
return i;
}
}
onPreviousClick() {
let state = this._steps[this.currentStepIndex - 1].state;
this.currentState = state;
}
onNextClick() {
let state = this._steps[this.currentStepIndex + 1].state;
this.currentState = state;
}
canMovePrevious() {
return this.currentStepIndex > 0;
}
canFinalize() {
return this.currentStepIndex === this.totalSteps - 1;
}
canMoveNext() {
return this.currentStepIndex < this.totalSteps - 1;
}
}
StepControl.$inject = ['$state'];
ngModule.component('vnStepControl', {
template: require('./step-control.html'),
controller: StepControl,
bindings: {
steps: '<',
onStepChange: '&?',
onStepEnd: '&?'
}
});