From 8ec66d1e954d84900f3f1bdd5cd958aef5abd3eb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net>
Date: Mon, 23 Dec 2019 12:22:22 +0100
Subject: [PATCH] Autofocus new filter and display proper error messages
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
apps/workflowengine/src/components/Check.vue | 7 ++++++-
apps/workflowengine/src/components/Rule.vue | 13 ++++++++++---
apps/workflowengine/src/store.js | 4 +++-
3 files changed, 19 insertions(+), 5 deletions(-)
diff --git a/apps/workflowengine/src/components/Check.vue b/apps/workflowengine/src/components/Check.vue
index 96d686341fe..e447fbeb4bd 100644
--- a/apps/workflowengine/src/components/Check.vue
+++ b/apps/workflowengine/src/components/Check.vue
@@ -72,7 +72,7 @@ export default {
currentOption: null,
currentOperator: null,
options: [],
- valid: true,
+ valid: false,
}
},
computed: {
@@ -107,6 +107,11 @@ export default {
this.options = Object.values(this.checks)
this.currentOption = this.checks[this.check.class]
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: {
showDelete() {
diff --git a/apps/workflowengine/src/components/Rule.vue b/apps/workflowengine/src/components/Rule.vue
index bdcd4bfc0f0..5285005f53b 100644
--- a/apps/workflowengine/src/components/Rule.vue
+++ b/apps/workflowengine/src/components/Rule.vue
@@ -30,8 +30,7 @@
@input="updateOperation" />
</Operation>
<div class="buttons">
- <button v-tooltip="ruleStatus.tooltip"
- class="status-button icon"
+ <button class="status-button icon"
:class="ruleStatus.class"
@click="saveRule">
{{ ruleStatus.title }}
@@ -43,6 +42,7 @@
{{ t('workflowengine', 'Delete') }}
</button>
</div>
+ <p v-if="error" class="error-message">{{ error }}</p>
</div>
</div>
</template>
@@ -84,7 +84,7 @@ export default {
return this.$store.getters.getOperationForRule(this.rule)
},
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 {
title: t('workflowengine', 'The configuration is invalid'),
class: 'icon-close-white invalid',
@@ -174,12 +174,19 @@ export default {
.buttons {
display: block;
+ overflow: hidden;
+
button {
float: right;
height: 34px;
}
}
+ .error-message {
+ float: right;
+ margin-right: 10px;
+ }
+
.status-button {
transition: 0.5s ease all;
display: block;
diff --git a/apps/workflowengine/src/store.js b/apps/workflowengine/src/store.js
index 70b8b550053..a8be467193d 100644
--- a/apps/workflowengine/src/store.js
+++ b/apps/workflowengine/src/store.js
@@ -98,7 +98,9 @@ const store = new Vuex.Store({
entity: entity ? entity.id : rule.fixedEntity,
events,
name: '', // unused in the new ui, there for legacy reasons
- checks: [],
+ checks: [
+ { class: null, operator: null, value: '' }
+ ],
operation: rule.operation || '',
})
},
--
GitLab