Mercurial > gemma
comparison client/src/components/importoverview/Filters.vue @ 2883:3473f3b72e21
client: importsoverview: filters: made code more compact
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 01 Apr 2019 18:25:53 +0200 |
parents | c40540889b53 |
children |
comparison
equal
deleted
inserted
replaced
2882:6538ee93df72 | 2883:3473f3b72e21 |
---|---|
1 <template> | 1 <template> |
2 <div> | 2 <div> |
3 <button @click="setFilter('pending')" :class="pendingStyle"> | 3 <button |
4 @click="setFilter('pending')" | |
5 :class="'mr-1 btn btn-xs btn-' + (this.pending ? 'secondary' : 'light')" | |
6 > | |
4 <translate>pending</translate> | 7 <translate>pending</translate> |
5 </button> | 8 </button> |
6 <button @click="setFilter('failed')" :class="failedStyle"> | 9 <button |
10 @click="setFilter('failed')" | |
11 :class="'mr-1 btn btn-xs btn-' + (this.failed ? 'secondary' : 'light')" | |
12 > | |
7 <translate>failed</translate> | 13 <translate>failed</translate> |
8 </button> | 14 </button> |
9 <button @click="setFilter('accepted')" :class="acceptedStyle"> | 15 <button |
16 @click="setFilter('accepted')" | |
17 :class="'mr-1 btn btn-xs btn-' + (this.accepted ? 'secondary' : 'light')" | |
18 > | |
10 <translate>accepted</translate> | 19 <translate>accepted</translate> |
11 </button> | 20 </button> |
12 <button @click="setFilter('declined')" :class="declinedStyle"> | 21 <button |
22 @click="setFilter('declined')" | |
23 :class="'mr-1 btn btn-xs btn-' + (this.declined ? 'secondary' : 'light')" | |
24 > | |
13 <translate>declined</translate> | 25 <translate>declined</translate> |
14 </button> | 26 </button> |
15 <button @click="setFilter('warning')" :class="warningStyle"> | 27 <button |
28 @click="setFilter('warning')" | |
29 :class="'btn btn-xs btn-' + (this.warning ? 'secondary' : 'light')" | |
30 > | |
16 <translate>warning</translate> | 31 <translate>warning</translate> |
17 </button> | 32 </button> |
18 </div> | 33 </div> |
19 </template> | 34 </template> |
20 | 35 |
47 "pending", | 62 "pending", |
48 "failed", | 63 "failed", |
49 "accepted", | 64 "accepted", |
50 "warning", | 65 "warning", |
51 "declined" | 66 "declined" |
52 ]), | 67 ]) |
53 pendingStyle() { | |
54 return { | |
55 btn: true, | |
56 "btn-xs": true, | |
57 "btn-light": !this.pending, | |
58 "btn-secondary": this.pending | |
59 }; | |
60 }, | |
61 failedStyle() { | |
62 return { | |
63 "ml-2": true, | |
64 btn: true, | |
65 "btn-xs": true, | |
66 "btn-light": !this.failed, | |
67 "btn-secondary": this.failed | |
68 }; | |
69 }, | |
70 declinedStyle() { | |
71 return { | |
72 "ml-2": true, | |
73 btn: true, | |
74 "btn-xs": true, | |
75 "btn-light": !this.declined, | |
76 "btn-secondary": this.declined | |
77 }; | |
78 }, | |
79 acceptedStyle() { | |
80 return { | |
81 "ml-2": true, | |
82 btn: true, | |
83 "btn-xs": true, | |
84 "btn-light": !this.accepted, | |
85 "btn-secondary": this.accepted | |
86 }; | |
87 }, | |
88 warningStyle() { | |
89 return { | |
90 "ml-2": true, | |
91 btn: true, | |
92 "btn-xs": true, | |
93 "btn-light": !this.warning, | |
94 "btn-secondary": this.warning | |
95 }; | |
96 } | |
97 } | 68 } |
98 }; | 69 }; |
99 </script> | 70 </script> |
100 | |
101 <style lang="scss" scoped></style> |