# HG changeset patch
# User Sascha L. Teichmann <sascha.teichmann@intevation.de>
# Date 1543326971 -3600
# Node ID 46440355dd7c06a14689faf8efd7a4addb7d54aa
# Parent  8d59457a5651777ade3edb0b15a99099d9ee2c01# Parent  cbd04809ee50d327f83ff13e812bcdfb5602622b
Merged.

diff -r 8d59457a5651 -r 46440355dd7c client/src/components/admin/Importqueue.vue
--- a/client/src/components/admin/Importqueue.vue	Tue Nov 27 14:55:48 2018 +0100
+++ b/client/src/components/admin/Importqueue.vue	Tue Nov 27 14:56:11 2018 +0100
@@ -14,6 +14,7 @@
                   </span>
                 </div>
                 <input
+                  v-model="searchQuery"
                   type="text"
                   class="form-control"
                   placeholder
@@ -25,6 +26,8 @@
                 <button @click="setFilter('successful')" :class="successfulStyle">Successful</button>
                 <button @click="setFilter('failed')" :class="failedStyle">Failed</button>
                 <button @click="setFilter('pending')" :class="pendingStyle">Pending</button>
+                <button @click="setFilter('rejected')" :class="rejectedStyle">Rejected</button>
+                <button @click="setFilter('accepted')" :class="acceptedStyle">Accepted</button>
               </div>
             </div>
             <table class="table">
@@ -37,7 +40,7 @@
                 </tr>
               </thead>
               <tbody>
-                <tr v-for="job in imports" :key="job.id">
+                <tr v-for="job in filteredImports" :key="job.id">
                   <td>{{job.enqueued}}</td>
                   <td>{{job.kind}}</td>
                   <td>{{job.user}}</td>
@@ -73,26 +76,65 @@
   name: "importqueue",
   data() {
     return {
+      searchQuery: "",
       successful: false,
       failed: false,
-      pending: false
+      pending: false,
+      rejected: false,
+      accepted: false
     };
   },
   methods: {
     setFilter(name) {
       this[name] = !this[name];
-      const allSet = this.successful && this.failed && this.pending;
+      const allSet =
+        this.successful &&
+        this.failed &&
+        this.pending &&
+        this.accepted &&
+        this.rejected;
       if (allSet) {
-        this.all = false;
         this.successful = false;
         this.failed = false;
         this.pending = false;
+        this.accepted = false;
+        this.rejected = false;
       }
     }
   },
   computed: {
     ...mapState("imports", ["imports"]),
     ...mapState("application", ["showSidebar"]),
+    filteredImports() {
+      const filtered = this.imports
+        .filter(element => {
+          if (!this.searchQuery) return true;
+          return [(element.kind, element.user, element.enqueued)].some(x => {
+            return x.toLowerCase().includes(this.searchQuery.toLowerCase());
+          });
+        })
+        .filter(y => {
+          if (
+            !this.successful &&
+            !this.failed &&
+            !this.pending &&
+            !this.accepted &&
+            !this.rejected
+          )
+            return true;
+          let filterCriteria = [];
+          if (this.successful) filterCriteria.push("successful");
+          if (this.failed) filterCriteria.push("failed");
+          if (this.pending) filterCriteria.push("pending");
+          if (this.accepted) filterCriteria.push("accepted");
+          if (this.rejected) filterCriteria.push("rejected");
+          const result = filterCriteria.map(selectedState => {
+            return y.state === selectedState;
+          });
+          return result.every(x => x);
+        });
+      return filtered;
+    },
     spacerStyle() {
       return [
         "spacer ml-3",
@@ -122,6 +164,20 @@
         "btn-light": !this.failed,
         "btn-dark": this.failed
       };
+    },
+    rejectedStyle() {
+      return {
+        btn: true,
+        "btn-light": !this.rejected,
+        "btn-dark": this.rejected
+      };
+    },
+    acceptedStyle() {
+      return {
+        btn: true,
+        "btn-light": !this.accepted,
+        "btn-dark": this.accepted
+      };
     }
   },
   mounted() {