# HG changeset patch
# User Markus Kottlaender <markus@intevation.de>
# Date 1554135953 -7200
# Node ID 3473f3b72e21963d234cab8328fa74e0c16cbddb
# Parent  6538ee93df7239b7d95defa2ba01fe68a883c64e
client: importsoverview: filters: made code more compact

diff -r 6538ee93df72 -r 3473f3b72e21 client/src/components/importoverview/Filters.vue
--- a/client/src/components/importoverview/Filters.vue	Mon Apr 01 18:03:43 2019 +0200
+++ b/client/src/components/importoverview/Filters.vue	Mon Apr 01 18:25:53 2019 +0200
@@ -1,18 +1,33 @@
 <template>
   <div>
-    <button @click="setFilter('pending')" :class="pendingStyle">
+    <button
+      @click="setFilter('pending')"
+      :class="'mr-1 btn btn-xs btn-' + (this.pending ? 'secondary' : 'light')"
+    >
       <translate>pending</translate>
     </button>
-    <button @click="setFilter('failed')" :class="failedStyle">
+    <button
+      @click="setFilter('failed')"
+      :class="'mr-1 btn btn-xs btn-' + (this.failed ? 'secondary' : 'light')"
+    >
       <translate>failed</translate>
     </button>
-    <button @click="setFilter('accepted')" :class="acceptedStyle">
+    <button
+      @click="setFilter('accepted')"
+      :class="'mr-1 btn btn-xs btn-' + (this.accepted ? 'secondary' : 'light')"
+    >
       <translate>accepted</translate>
     </button>
-    <button @click="setFilter('declined')" :class="declinedStyle">
+    <button
+      @click="setFilter('declined')"
+      :class="'mr-1 btn btn-xs btn-' + (this.declined ? 'secondary' : 'light')"
+    >
       <translate>declined</translate>
     </button>
-    <button @click="setFilter('warning')" :class="warningStyle">
+    <button
+      @click="setFilter('warning')"
+      :class="'btn btn-xs btn-' + (this.warning ? 'secondary' : 'light')"
+    >
       <translate>warning</translate>
     </button>
   </div>
@@ -49,53 +64,7 @@
       "accepted",
       "warning",
       "declined"
-    ]),
-    pendingStyle() {
-      return {
-        btn: true,
-        "btn-xs": true,
-        "btn-light": !this.pending,
-        "btn-secondary": this.pending
-      };
-    },
-    failedStyle() {
-      return {
-        "ml-2": true,
-        btn: true,
-        "btn-xs": true,
-        "btn-light": !this.failed,
-        "btn-secondary": this.failed
-      };
-    },
-    declinedStyle() {
-      return {
-        "ml-2": true,
-        btn: true,
-        "btn-xs": true,
-        "btn-light": !this.declined,
-        "btn-secondary": this.declined
-      };
-    },
-    acceptedStyle() {
-      return {
-        "ml-2": true,
-        btn: true,
-        "btn-xs": true,
-        "btn-light": !this.accepted,
-        "btn-secondary": this.accepted
-      };
-    },
-    warningStyle() {
-      return {
-        "ml-2": true,
-        btn: true,
-        "btn-xs": true,
-        "btn-light": !this.warning,
-        "btn-secondary": this.warning
-      };
-    }
+    ])
   }
 };
 </script>
-
-<style lang="scss" scoped></style>