Autofocus new filter and display proper error messages
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
parent
e7ad044826
commit
8ec66d1e95
|
@ -72,7 +72,7 @@ export default {
|
||||||
currentOption: null,
|
currentOption: null,
|
||||||
currentOperator: null,
|
currentOperator: null,
|
||||||
options: [],
|
options: [],
|
||||||
valid: true,
|
valid: false,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -107,6 +107,11 @@ export default {
|
||||||
this.options = Object.values(this.checks)
|
this.options = Object.values(this.checks)
|
||||||
this.currentOption = this.checks[this.check.class]
|
this.currentOption = this.checks[this.check.class]
|
||||||
this.currentOperator = this.operators.find((operator) => operator.operator === this.check.operator)
|
this.currentOperator = this.operators.find((operator) => operator.operator === this.check.operator)
|
||||||
|
|
||||||
|
if (this.check.class === null) {
|
||||||
|
this.$nextTick(() => this.$refs.checkSelector.$el.focus())
|
||||||
|
}
|
||||||
|
this.check.invalid = !this.validate()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
showDelete() {
|
showDelete() {
|
||||||
|
|
|
@ -30,8 +30,7 @@
|
||||||
@input="updateOperation" />
|
@input="updateOperation" />
|
||||||
</Operation>
|
</Operation>
|
||||||
<div class="buttons">
|
<div class="buttons">
|
||||||
<button v-tooltip="ruleStatus.tooltip"
|
<button class="status-button icon"
|
||||||
class="status-button icon"
|
|
||||||
:class="ruleStatus.class"
|
:class="ruleStatus.class"
|
||||||
@click="saveRule">
|
@click="saveRule">
|
||||||
{{ ruleStatus.title }}
|
{{ ruleStatus.title }}
|
||||||
|
@ -43,6 +42,7 @@
|
||||||
{{ t('workflowengine', 'Delete') }}
|
{{ t('workflowengine', 'Delete') }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
<p v-if="error" class="error-message">{{ error }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -84,7 +84,7 @@ export default {
|
||||||
return this.$store.getters.getOperationForRule(this.rule)
|
return this.$store.getters.getOperationForRule(this.rule)
|
||||||
},
|
},
|
||||||
ruleStatus() {
|
ruleStatus() {
|
||||||
if (this.error || !this.rule.valid || this.rule.checks.some((check) => check.invalid === true)) {
|
if (this.error || !this.rule.valid || this.rule.checks.length === 0 || this.rule.checks.some((check) => check.invalid === true)) {
|
||||||
return {
|
return {
|
||||||
title: t('workflowengine', 'The configuration is invalid'),
|
title: t('workflowengine', 'The configuration is invalid'),
|
||||||
class: 'icon-close-white invalid',
|
class: 'icon-close-white invalid',
|
||||||
|
@ -174,12 +174,19 @@ export default {
|
||||||
|
|
||||||
.buttons {
|
.buttons {
|
||||||
display: block;
|
display: block;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
float: right;
|
float: right;
|
||||||
height: 34px;
|
height: 34px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.error-message {
|
||||||
|
float: right;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
.status-button {
|
.status-button {
|
||||||
transition: 0.5s ease all;
|
transition: 0.5s ease all;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -98,7 +98,9 @@ const store = new Vuex.Store({
|
||||||
entity: entity ? entity.id : rule.fixedEntity,
|
entity: entity ? entity.id : rule.fixedEntity,
|
||||||
events,
|
events,
|
||||||
name: '', // unused in the new ui, there for legacy reasons
|
name: '', // unused in the new ui, there for legacy reasons
|
||||||
checks: [],
|
checks: [
|
||||||
|
{ class: null, operator: null, value: '' }
|
||||||
|
],
|
||||||
operation: rule.operation || '',
|
operation: rule.operation || '',
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue