Mercurial > gemma
changeset 5506:90506606a7ef deactivate-users
Client: Distinguish deactivated users in the table
* Grey out the deactivated users and disable the corresponding buttons to mark this status of users.
| author | Fadi Abbud <fadi.abbud@intevation.de> |
|---|---|
| date | Thu, 23 Sep 2021 13:40:33 +0200 |
| parents | 2604beecbd1a |
| children | 279900b28b1b |
| files | client/src/components/usermanagement/Usermanagement.vue |
| diffstat | 1 files changed, 17 insertions(+), 2 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/usermanagement/Usermanagement.vue Wed Sep 22 18:53:19 2021 +0200 +++ b/client/src/components/usermanagement/Usermanagement.vue Thu Sep 23 13:40:33 2021 +0200 @@ -22,6 +22,7 @@ <template v-slot:row="{ item: user }"> <div class="table-cell center col-1" + :style="{ opacity: user.active ? '1' : '0.7' }" @click="selectUser(user.user)" > <font-awesome-icon @@ -30,16 +31,25 @@ class="fa-lg" /> </div> - <div class="table-cell col-4" @click="selectUser(user.user)"> + <div + class="table-cell col-4" + @click="selectUser(user.user)" + :style="{ opacity: user.active ? '1' : '0.7' }" + > {{ user.user }} </div> <div + :style="{ opacity: user.active ? '1' : '0.7' }" class="table-cell center col-1" @click="selectUser(user.user)" > {{ user.country }} </div> - <div class="table-cell col-3" @click="selectUser(user.user)"> + <div + class="table-cell col-3" + @click="selectUser(user.user)" + :style="{ opacity: user.active ? '1' : '0.7' }" + > {{ user.email }} </div> <div class="table-cell center col-1"> @@ -52,6 +62,7 @@ @change="toggleReport(user)" v-tooltip="receivesReportLabel" :width="40" + :disabled="!user.active" :height="20" /> </div> @@ -61,6 +72,8 @@ class="btn btn-xs btn-dark mr-1" v-tooltip="sendMailLabel" v-if="user.email" + :disabled="!user.active" + :style="{ cursor: user.active ? 'pointer' : 'default' }" > <font-awesome-icon icon="paper-plane" fixed-width /> </button> @@ -68,6 +81,8 @@ @click="deleteUser(user.user)" class="btn btn-xs btn-dark" v-tooltip="deleteUserLabel" + :style="{ cursor: user.active ? 'pointer' : 'default' }" + :disabled="!user.active" > <font-awesome-icon icon="trash" fixed-width /> </button>