|
3 | 3 | <div |
4 | 4 | v-for="(step, idx) in visibleSteps()" |
5 | 5 | :key="idx" |
6 | | - :class="['step-container', step.status, enabledQualifier(step.enabled)]" |
| 6 | + :class="['step-container', step.name, step.status, enabledQualifier(step.enabled)]" |
7 | 7 | > |
8 | 8 | <div |
9 | 9 | :class="['step-header']" |
|
43 | 43 | v-else-if="step.status!=='inactive' && step.name==='DD'" |
44 | 44 | :step-id="step.id" |
45 | 45 | :status="step.status" |
46 | | - @input="changeStepSelected" |
| 46 | + @change="changeStepSelected" |
47 | 47 | /> |
48 | 48 | <AttributionDetailsStep |
49 | 49 | v-else-if="step.status!=='inactive' && step.name==='AD'" |
@@ -258,26 +258,18 @@ export default { |
258 | 258 | this.$set(this.steps, previousStep, { ...this.steps[previousStep], status: 'current' }) |
259 | 259 | this.currentStepId = previousStep |
260 | 260 | }, |
261 | | - handleFinish() { |
262 | | - // TODO: write the method |
263 | | - }, |
264 | 261 | setActiveStep(clickedStepId) { |
265 | 262 | /** |
266 | 263 | * Handles a click on Step header |
267 | 264 | */ |
268 | 265 | if (!this.steps[clickedStepId].enabled) return |
269 | 266 | if (this.steps[clickedStepId].status === 'inactive') return |
270 | | - if (clickedStepId > this.currentStepId) { |
271 | | - for (let i = this.currentStepId; i < clickedStepId; i++) { |
272 | | - this.$set(this.steps, i, { ...this.steps[i], status: 'previous' }) |
273 | | - } |
274 | | - this.$set(this.steps, clickedStepId, { ...this.steps[clickedStepId], status: 'current' }) |
275 | | - } else { |
276 | | - for (let i = this.currentStepId; i > clickedStepId; i--) { |
277 | | - this.$set(this.steps, i, { ...this.steps[i], status: 'inactive' }) |
278 | | - } |
279 | | - this.$set(this.steps, clickedStepId, { ...this.steps[clickedStepId], status: 'current' }) |
| 267 | + // only steps before the current one are clickable |
| 268 | + if (clickedStepId >= this.currentStepId) return |
| 269 | + for (let i = this.currentStepId; i > clickedStepId; i--) { |
| 270 | + this.$set(this.steps, i, { ...this.steps[i], status: 'inactive' }) |
280 | 271 | } |
| 272 | + this.$set(this.steps, clickedStepId, { ...this.steps[clickedStepId], status: 'current' }) |
281 | 273 | this.currentStepId = clickedStepId |
282 | 274 | }, |
283 | 275 | setStepsVisible(stepsToSetVisible) { |
|
0 commit comments