Mercurial > gemma

annotate client/src/components/Userdetail.vue @ 376:e42f42eb9353

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
refactor: Userdetails refactored to card model Primitive user editing etd.
author Thomas Junk <thomas.junk@intevation.de>
date Fri, 10 Aug 2018 13:15:32 +0200
parents 112527683ee9
children 0a9aaf21f69f
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
2 <div class="userdetails card shadow" style="width: 35rem;">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
3 <div class="card" style="width: 35rem;">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
4 <div class="card-header text-white bg-info mb-3">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
5 {{ currentUser.user }}
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
6 </div>
362
2c58906649be refactor: user detail view refactored to accordion
Thomas Junk <thomas.junk@intevation.de>
parents: 356
diff changeset
7 <div class="card-body">
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
8 <form @submit.prevent="save">
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
9 <div class="form-group">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
10 <label for="country">Country</label>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
11 <select v-model="currentUser.country">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
12 <option disabled value="">Please select one</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
13 <option>AT</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
14 <option>RO</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
15 <option>BG</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
16 </select>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
17 </div>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
18 <div class="form-group">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
19 <label for="email">Email address</label>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
20 <input type="email" class="form-control" id="email" aria-describedby="emailHelp" v-model="currentUser.email">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
21 </div>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
22 <div class="form-group">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
23 <label for="role">Role</label>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
24 <select v-model="currentUser.role">
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
25 <option disabled value="">Please select one</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
26 <option value="sys_admin">Sysadmin</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
27 <option value="waterway_admin">Waterway Admin</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
28 <option value="waterway_user">Waterway User</option>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
29 </select>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
30 </div>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
31 <button type="submit" class="btn btn-primary">Submit</button>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
32 </form>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
33 </div>
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
34 </div>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
35 </div>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
36 </template>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
37
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
38 <style lang="scss">
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
39 @import "../assets/application.scss";
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
40
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
41 .userdetails {
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
42 margin-top: 20px;
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
43 width: 50vw;
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
44 }
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
45
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
46 .shadow {
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
47 box-shadow: $basic-shadow-light !important;
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
48 }
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
49 </style>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
50 <script>
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
51 import app from "../main";
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
52
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
53 export default {
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
54 name: "userdetail",
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
55 data() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
56 return {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
57 currentUser: {},
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
58 path: null
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
59 };
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
60 },
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
61 watch: {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
62 user() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
63 this.currentUser = { ...this.user };
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
64 this.path = this.user.name;
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
65 }
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
66 },
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
67 computed: {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
68 user() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
69 return this.$store.getters["usermanagement/currentUser"];
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
70 }
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
71 },
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
72 methods: {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
73 save() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
74 this.$store
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
75 .dispatch("usermanagement/saveCurrentUser", {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
76 path: this.user.user,
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
77 user: this.currentUser
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
78 })
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
79 .then(() => {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
80 this.$store.commit("usermanagement/clearCurrentUser");
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
81 this.$store.dispatch("usermanagement/loadUsers").catch(error => {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
82 const { status, data } = error.response;
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
83 app.$toast.error({
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
84 title: "Backend Error",
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
85 message: `${status}: ${data}`
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
86 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
87 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
88 })
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
89 .catch(error => {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
90 const { status, data } = error.response;
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
91 app.$toast.error({
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
92 title: "Error while saving user",
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
93 message: `${status}: ${data}`
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
94 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
95 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
96 }
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
97 }
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
98 };
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
99 </script>