Mercurial > gemma

annotate client/src/usermanagement/Users.vue @ 1123:d9e6a1f6f394 store-refactoring

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
moved all collapse flags for UI elements to store UI elements can now be expanded/collapsed via the application store
author Markus Kottlaender <markus@intevation.de>
date Tue, 06 Nov 2018 13:00:17 +0100
parents ca628dce90dd
children 2fda33d55d81
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
629
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
2 <div class="main d-flex flex-column">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
3 <div class="d-flex content flex-column">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
4 <div class="d-flex flex-row">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
5 <div :class="userlistStyle">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
6 <div class="card">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
7 <div class="card-header shadow-sm text-white bg-info mb-3">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
8 Users
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
9 </div>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
10 <div class="card-body">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
11 <table id="datatable" :class="tableStyle">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
12 <thead>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
13 <tr>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
14 <th scope="col" @click="sortBy('user')">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
15 <span>Username&nbsp;
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
16 <i v-if="sortCriterion=='user'" class="fa fa-angle-down"></i>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
17 </span>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
18 </th>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
19 <th scope="col" @click="sortBy('country')">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
20 <span>Country&nbsp;
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
21 <i v-if="sortCriterion=='country'" class="fa fa-angle-down"></i>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
22 </span>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
23 </th>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
24 <th scope="col" @click="sortBy('email')">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
25 <span>Email&nbsp;
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
26 <i v-if="sortCriterion=='email'" class="fa fa-angle-down"></i>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
27 </span>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
28 </th>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
29 <th scope="col" @click="sortBy('role')">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
30 <span>Role&nbsp;
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
31 <i v-if="sortCriterion=='role'" class="fa fa-angle-down"></i>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
32 </span>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
33 </th>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
34 <th scope="col"></th>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
35 </tr>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
36 </thead>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
37 <tbody>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
38 <tr v-for="user in users" :key="user.user" @click="selectUser(user.user)">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
39 <td>{{ user.user }}</td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
40 <td>{{ user.country }}</td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
41 <td>{{ user.email}}</td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
42 <td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
43 <i v-tooltip="user.roleLabel" :class="{
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
44 fa:true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
45 icon:true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
46 'fa-user':user.role==='waterway_user',
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
47 'fa-star':user.role=='sys_admin',
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
48 'fa-adn':user.role==='waterway_admin'}"></i>
629
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
49 </td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
50 <td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
51 <i @click="deleteUser(user.user)" class="icon fa fa-trash-o"></i>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
52 </td>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
53 </tr>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
54 </tbody>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
55 </table>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
56 </div>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
57 <div class="d-flex flex-row pagination">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
58 <i @click=" prevPage " v-if="this.currentPage!=1 " class="backwards btn btn-sm btn-light align-self-center pages fa fa-caret-left "></i> {{this.currentPage}} / {{this.pages}}
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
59 <i @click="nextPage " class="forwards btn btn-sm btn-light align-self-center pages fa fa-caret-right "></i>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
60 </div>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
61 <div class="adduser ">
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
62 <button @click="addUser " class="btn btn-info pull-right shadow-sm ">Add User</button>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
63 </div>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
64 </div>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
65 </div>
8278b2fb0c33 refac: UI refactorization
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
66 <Userdetail v-if="isUserDetailsVisible "></Userdetail>
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
67 </div>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
68 </div>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
69 </div>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
70 </template>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
71
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
72 <style lang="scss">
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
73 @import "../application/assets/tooltip.scss";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
74 .main {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
75 height: 100vh;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
76 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
77
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
78 .backwards {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
79 margin-right: 0.5rem;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
80 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
81
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
82 .forwards {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
83 margin-left: 0.5rem;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
84 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
85
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
86 .content {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
87 margin-top: $large-offset;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
88 margin-left: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
89 margin-right: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
90 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
91
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
92 .adduser {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
93 margin-right: $offset;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
94 padding-bottom: $offset;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
95 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
96
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
97 .icon {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
98 font-size: large;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
99 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
100
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
101 .userlist {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
102 margin-top: $topbarheight;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
103 margin-right: $offset;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
104 min-width: 520px;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
105 height: 100%;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
106 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
107
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
108 .pagination {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
109 margin-left: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
110 margin-right: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
111 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
112 .userlistsmall {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
113 width: 30vw;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
114 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
115
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
116 .userlistextended {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
117 width: 70vw;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
118 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
119
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
120 .table {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
121 width: 90% !important;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
122 margin: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
123 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
124
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
125 .table th,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
126 .pages {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
127 cursor: pointer;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
128 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
129
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
130 .table th,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
131 td {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
132 font-size: 0.9rem;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
133 border-top: 0px !important;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
134 text-align: left;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
135 padding: 0.5rem !important;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
136 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
137
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
138 .table td {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
139 font-size: 0.9rem;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
140 cursor: pointer;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
141 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
142
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
143 tr span {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
144 display: flex;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
145 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
146 </style>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
147
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
148 <script>
1019
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
149 /*
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
150 * This is Free Software under GNU Affero General Public License v >= 3.0
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
151 * without warranty, see README.md and license for details.
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
152 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
153 * SPDX-License-Identifier: AGPL-3.0-or-later
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
154 * License-Filename: LICENSES/AGPL-3.0.txt
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
155 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
156 * Copyright (C) 2018 by via donau
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
157 * – Österreichische Wasserstraßen-Gesellschaft mbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
158 * Software engineering by Intevation GmbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
159 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
160 * Author(s):
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
161 * Thomas Junk <thomas.junk@intevation.de>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 629
diff changeset
162 */
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
163 import Userdetail from "./Userdetail";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
164 import store from "../store";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
165 import { mapGetters } from "vuex";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
166 import { displayError } from "../application/lib/errors.js";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
167
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
168 export default {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
169 name: "userview",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
170 data() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
171 return {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
172 sortCriterion: "user",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
173 pageSize: 10,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
174 currentPage: 1
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
175 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
176 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
177 components: {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
178 Userdetail
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
179 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
180 computed: {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
181 ...mapGetters("usermanagement", ["isUserDetailsVisible"]),
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
182 ...mapGetters("application", ["sidebarCollapsed"]),
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
183 users() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
184 let users = [...this.$store.getters["usermanagement/users"]];
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
185 users.sort((a, b) => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
186 if (
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
187 a[this.sortCriterion].toLowerCase() <
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
188 b[this.sortCriterion].toLowerCase()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
189 )
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
190 return -1;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
191 if (
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
192 a[this.sortCriterion].toLowerCase() >
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
193 b[this.sortCriterion].toLowerCase()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
194 )
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
195 return 1;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
196 return 0;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
197 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
198 const start = (this.currentPage - 1) * this.pageSize;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
199 return users.slice(start, start + this.pageSize);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
200 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
201 pages() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
202 let users = [...this.$store.getters["usermanagement/users"]];
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
203 return Math.ceil(users.length / this.pageSize);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
204 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
205 tableStyle() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
206 return {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
207 table: true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
208 "table-hover": true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
209 "table-sm": this.isUserDetailsVisible,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
210 fadeIn: true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
211 animated: true
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
212 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
213 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
214 userlistStyle() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
215 return {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
216 userlist: true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
217 shadow: true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
218 userlistsmall: this.isUserDetailsVisible,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
219 userlistextended: !this.isUserDetailsVisible
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
220 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
221 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
222 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
223 methods: {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
224 tween() {},
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
225 nextPage() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
226 if (this.currentPage < this.pages) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
227 document.querySelector("#datatable").classList.add("fadeOut");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
228 setTimeout(() => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
229 document.querySelector("#datatable").classList.remove("fadeOut");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
230 this.currentPage += 1;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
231 }, 10);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
232 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
233 return;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
234 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
235 prevPage() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
236 if (this.currentPage > 0) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
237 document.querySelector("#datatable").classList.add("fadeOut");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
238 setTimeout(() => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
239 document.querySelector("#datatable").classList.remove("fadeOut");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
240 this.currentPage -= 1;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
241 }, 10);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
242 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
243 return;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
244 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
245 sortBy(criterion) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
246 this.sortCriterion = criterion;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
247 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
248 deleteUser(name) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
249 this.$store
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
250 .dispatch("usermanagement/deleteUser", { name: name })
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
251 .then(() => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
252 this.submitted = false;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
253 this.$store.dispatch("usermanagement/loadUsers").catch(error => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
254 const { status, data } = error.response;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
255 displayError({
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
256 title: "Backend Error",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
257 message: `${status}: ${data.message || data}`
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
258 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
259 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
260 })
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
261 .catch(error => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
262 const { status, data } = error.response;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
263 displayError({
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
264 title: "Backend Error",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
265 message: `${status}: ${data.message || data}`
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
266 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
267 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
268 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
269 addUser() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
270 this.$store.commit("usermanagement/clearCurrentUser");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
271 this.$store.commit("usermanagement/setUserDetailsVisible");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
272 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
273 selectUser(name) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
274 const user = this.$store.getters["usermanagement/getUserByName"](name);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
275 this.$store.commit("usermanagement/setCurrentUser", user);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
276 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
277 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
278 beforeRouteEnter(to, from, next) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
279 store
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
280 .dispatch("usermanagement/loadUsers")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
281 .then(next)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
282 .catch(error => {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
283 const { status, data } = error.response;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
284 displayError({
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
285 title: "Backend Error",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
286 message: `${status}: ${data}`
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
287 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
288 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
289 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
290 beforeRouteLeave(to, from, next) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
291 store.commit("usermanagement/clearCurrentUser");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
292 store.commit("usermanagement/setUserDetailsInvisible");
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
293 next();
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
294 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
295 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
296 </script>