Mercurial > gemma
comparison client/src/components/ui/UIBoxHeader.vue @ 5509:36cbf14b878a deactivate-users
Client: Add ability to list only active users
* Adjust the "UIBoxHeader.vue" component to accept "checkbox" object which displays checkbox element in the header if it passed from the parent components.
* Filter users according to the checked value from the checkbox.
* Checkbox for hiding inactive users is only visible if there is at least one deactivated user.
| author | Fadi Abbud <fadi.abbud@intevation.de> |
|---|---|
| date | Fri, 24 Sep 2021 13:10:25 +0200 |
| parents | c36940e53788 |
| children | ba014cc5f969 |
comparison
equal
deleted
inserted
replaced
| 5508:29af073c824d | 5509:36cbf14b878a |
|---|---|
| 8 fixed-width | 8 fixed-width |
| 9 /> | 9 /> |
| 10 {{ title }} | 10 {{ title }} |
| 11 </span> | 11 </span> |
| 12 <div class="d-flex flex-row"> | 12 <div class="d-flex flex-row"> |
| 13 <span class="box-control" v-if="checkBox" style="cursor: default;"> | |
| 14 <input | |
| 15 type="checkbox" | |
| 16 style="cursor: pointer;" | |
| 17 class="align-self-center" | |
| 18 :checked="checkBox.value" | |
| 19 @change="checkBox.callback" | |
| 20 /> | |
| 21 <span class="ml-1 small"> | |
| 22 {{ checkBox.label }} | |
| 23 </span> | |
| 24 </span> | |
| 13 <span | 25 <span |
| 14 class="box-control" | 26 class="box-control" |
| 15 v-for="(action, index) in actions" | 27 v-for="(action, index) in actions" |
| 16 :key="index" | 28 :key="index" |
| 17 @click="action.callback" | 29 @click="action.callback" |
| 73 props: { | 85 props: { |
| 74 icon: String, | 86 icon: String, |
| 75 title: String, | 87 title: String, |
| 76 closeCallback: Function, | 88 closeCallback: Function, |
| 77 actions: Array, | 89 actions: Array, |
| 78 small: Boolean | 90 small: Boolean, |
| 91 checkBox: Object | |
| 79 } | 92 } |
| 80 }; | 93 }; |
| 81 </script> | 94 </script> |