Merge branch 'filter-processes-name' into 'master'

filter processes by name or uuid

Closes #881

See merge request !1159

vue/Process/List.vue

@@ -54,14 +54,32 @@
             </select>
           </span>
         </p>
-        <p class="control is-expanded">
-          <input
-            type="text"
-            class="input"
-            placeholder="Search by UUID"
-            v-model="filters.id"
-          />
-        </p>
+        <div class="field has-addons">
+          <p class="control">
+            <span class="select">
+              <select v-model="filterField">
+                <option value="name">Name</option>
+                <option value="id">UUID</option>
+              </select>
+            </span>
+          </p>
+          <p class="control is-expanded">
+            <input
+              v-if="filterField === 'name'"
+              type="text"
+              class="input"
+              placeholder="Filter processes by name"
+              v-model="filters.name"
+            />
+            <input
+              v-else
+              type="text"
+              class="input"
+              placeholder="Filter processes by UUID"
+              v-model="filters.id"
+            />
+          </p>
+        </div>
       </div>
     </form>
 
@@ -116,9 +134,11 @@ export default {
       state: '',
       mode: '',
       id: '',
+      name: '',
       with_workflow: '',
       created: ''
     },
+    filterField: 'name',
     loading: false,
     modes: PROCESS_MODES,
     states: PROCESS_STATES
@@ -137,6 +157,8 @@ export default {
     updateFilters () {
       this.filters.page = 1
       if (this.filters.mode === 'template') this.filters.with_workflow = ''
+      if (this.filterField === 'name') this.filters.id = ''
+      if (this.filterField === 'id') this.filters.name = ''
       this.$router.push({
         name: this.$route.name,
         query: removeEmptyStrings(this.filters)
@@ -167,3 +189,19 @@ export default {
   }
 }
 </script>
+
+<style lang="sass" scoped>
+.field.has-addons {
+  width: 100%;
+  > .control {
+    > .select {
+      > select {
+        height: 100%
+      }
+    }
+    > .input {
+      height: 100%
+    }
+  }
+}
+</style>