Mercurial > gemma

annotate client/src/components/Userdetail.vue @ 413:a9440a4826aa

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
refactor: display errormessages refactored to own lib
author Thomas Junk <thomas.junk@intevation.de>
date Wed, 15 Aug 2018 17:13:28 +0200
parents d428db60fad1
children 9869bc03155e
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>
379
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
2 <div class="userdetails shadow">
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
3 <div class="card">
375
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">
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
5 {{ currentUser.user }}
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
6 <span @click="closeDetailview" class="pull-right"><i class="fa fa-close"></i></span>
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
7 </div>
362
2c58906649be refactor: user detail view refactored to accordion
Thomas Junk <thomas.junk@intevation.de>
parents: 356
diff changeset
8 <div class="card-body">
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
9 <form @submit.prevent="save">
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
10 <div class="formfields">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
11 <div v-if="currentUser.isNew" class="form-group row">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
12 <label for="user">Username</label>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
13 <input type="user" class="form-control form-control-sm" id="user" aria-describedby="userHelp" v-model="currentUser.user">
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
14 <div v-show="errors.user" class="text-danger"><small><i class="fa fa-warning"></i> {{ errors.user }}</small></div>
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
15 </div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
16 <div class="form-group row">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
17 <label for="country">Country</label>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
18 <select class="form-control form-control-sm" v-on:change="validateCountry" v-model="currentUser.country">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
19 <option disabled value="">Please select one</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
20 <option>AT</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
21 <option>RO</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
22 <option>BG</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
23 </select>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
24 <div v-show="errors.country" class="text-danger"><small><i class="fa fa-warning"></i> {{ errors.country }}</small></div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
25 </div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
26 <div class="form-group row">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
27 <label for="email">Email address</label>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
28 <input type="email" v-on:change="validateEmailaddress" class="form-control form-control-sm" id="email" aria-describedby="emailHelp" v-model="currentUser.email">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
29 <div v-show="errors.email" class="text-danger"><small><i class="fa fa-warning"></i> {{ errors.email }}</small></div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
30 </div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
31 <div class="form-group row">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
32 <label for="role">Role</label>
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
33 <select class="form-control form-control-sm" v-on:change="validateRole" v-model="currentUser.role">
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
34 <option disabled value="">Please select one</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
35 <option value="sys_admin">Sysadmin</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
36 <option value="waterway_admin">Waterway Admin</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
37 <option value="waterway_user">Waterway User</option>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
38 </select>
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
39 <div v-show="errors.role" class="text-danger"><small><i class="fa fa-warning"></i> {{ errors.role }}</small></div>
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
40 </div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
41 <div class="form-group row">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
42 <label for="password">Password</label>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
43 <input type="password" v-on:change="validatePassword" class="form-control form-control-sm" id="password" aria-describedby="passwordHelp" v-model="password">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
44 <div v-show="errors.password" class="text-danger"><small><i class="fa fa-warning"></i> {{ errors.password }}</small></div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
45 </div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
46 <div class="form-group row">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
47 <label for="passwordre">Retype Password</label>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
48 <input type="password" v-on:change="validatePassword" class="form-control form-control-sm" id="passwordre" aria-describedby="passwordreHelp" v-model="passwordre">
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
49 <div v-show="errors.passwordre" class="text-danger"><small><i class="fa fa-warning"></i> {{ errors.passwordre }}</small></div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
50 </div>
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
51 </div>
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
52 <div>
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
53 <button type="submit" :disabled="submitted" class="btn btn-info pull-right">Submit</button>
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
54 </div>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
55 </form>
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
56 </div>
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
57 </div>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
58 </div>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
59 </template>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
60
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
61 <style lang="scss">
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
62 @import "../assets/application.scss";
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
63
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
64 .formfields {
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
65 width: 10vw;
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
66 }
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
67
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
68 .userdetails {
379
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
69 margin-top: $large-offset;
400
cb233a5a2ecd fix: Fixed country validation on submit
Thomas Junk <thomas.junk@intevation.de>
parents: 397
diff changeset
70 width: 48vw;
379
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
71 margin-right: auto;
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
72 height: 100%;
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
73 }
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
74
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
75 form {
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
76 margin-left: $offset;
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
77 font-size: 0.9rem;
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
78 }
375
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
79
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
80 .shadow {
112527683ee9 Backed out changeset 2c58906649be
Thomas Junk <thomas.junk@intevation.de>
parents: 374
diff changeset
81 box-shadow: $basic-shadow-light !important;
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
82 }
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
83 </style>
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
84 <script>
413
a9440a4826aa refactor: display errormessages refactored to own lib
Thomas Junk <thomas.junk@intevation.de>
parents: 411
diff changeset
85 import { displayError } from "../lib/errors.js";
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
86
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
87 const emptyErrormessages = () => {
397
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
88 return {
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
89 email: "",
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
90 country: "",
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
91 role: "",
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
92 password: "",
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
93 passwordre: ""
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
94 };
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
95 };
b5555bf6d45c fix: Clear errors on user switch
Thomas Junk <thomas.junk@intevation.de>
parents: 392
diff changeset
96
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
97 const isEmailValid = email => {
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
98 /* cf. types.go */
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
99 // eslint-disable-next-line
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
100 return /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9]))\.){3}(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9])|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/.test(
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
101 email
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
102 );
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
103 };
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
104
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
105 const violatedPasswordRules = password => {
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
106 return (
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
107 // rules according to issue 70
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
108 password.length < 7 ||
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
109 /\W/.test(password) == false ||
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
110 /\d/.test(password) == false
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
111 );
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
112 };
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
113
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
114 export default {
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
115 name: "userdetail",
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
116 data() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
117 return {
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
118 password: "",
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
119 passwordre: "",
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
120 currentUser: {},
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
121 path: null,
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
122 submitted: false,
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
123 errors: {
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
124 email: "",
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
125 country: "",
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
126 role: "",
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
127 password: "",
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
128 passwordre: ""
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
129 }
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
130 };
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
131 },
379
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
132 mounted() {
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
133 this.currentUser = { ...this.user };
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
134 this.path = this.user.name;
0a9aaf21f69f feat: usermanagement
Thomas Junk <thomas.junk@intevation.de>
parents: 376
diff changeset
135 },
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
136 watch: {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
137 user() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
138 this.currentUser = { ...this.user };
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
139 this.path = this.user.name;
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
140 this.clearPassword();
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
141 this.clearErrors();
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
142 }
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
143 },
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
144 computed: {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
145 user() {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
146 return this.$store.getters["usermanagement/currentUser"];
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
147 },
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
148 isFormValid() {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
149 return (
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
150 isEmailValid(this.currentUser.email) &&
400
cb233a5a2ecd fix: Fixed country validation on submit
Thomas Junk <thomas.junk@intevation.de>
parents: 397
diff changeset
151 this.currentUser.country &&
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
152 this.password === this.passwordre &&
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
153 (this.password === "" || !violatedPasswordRules(this.password))
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
154 );
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
155 }
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
156 },
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
157 methods: {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
158 clearErrors() {
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
159 this.errors = emptyErrormessages();
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
160 },
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
161 clearPassword() {
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
162 this.password = "";
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
163 this.passwordre = "";
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
164 },
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
165 closeDetailview() {
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
166 this.$store.commit("usermanagement/clearCurrentUser");
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
167 this.$store.commit("usermanagement/setUserDetailsInvisible");
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
168 },
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
169 validateCountry() {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
170 this.errors.country = this.currentUser.country
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
171 ? ""
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
172 : "Please choose a country";
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
173 },
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
174 validateRole() {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
175 this.errors.role = this.currentUser.role ? "" : "Please choose a role";
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
176 },
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
177 validatePassword() {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
178 this.errors.passwordre =
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
179 this.password === this.passwordre ? "" : "Passwords do not match!";
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
180 this.errors.password =
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
181 this.password === "" || !violatedPasswordRules(this.password)
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
182 ? ""
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
183 : "Password should at least be 8 char long including 1 digit and 1 special char like $";
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
184 },
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
185 validateEmailaddress() {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
186 this.errors.email = isEmailValid(this.currentUser.email)
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
187 ? ""
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
188 : "invalid email";
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
189 },
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
190 validate() {
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
191 this.validateCountry();
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
192 this.validateRole();
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
193 this.validatePassword();
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
194 this.validateEmailaddress();
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
195 },
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
196 save() {
411
d428db60fad1 refactor: Refactoring validation
Thomas Junk <thomas.junk@intevation.de>
parents: 406
diff changeset
197 this.validate();
392
c57b952c60be feat: Improved user input validation
Thomas Junk <thomas.junk@intevation.de>
parents: 389
diff changeset
198 if (!this.isFormValid) return;
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
199 if (this.password) this.currentUser.password = this.password;
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
200 this.submitted = true;
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
201 this.$store
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
202 .dispatch("usermanagement/saveCurrentUser", {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
203 path: this.user.user,
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
204 user: this.currentUser
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
205 })
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
206 .then(() => {
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
207 this.submitted = false;
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
208 this.$store.dispatch("usermanagement/loadUsers").catch(error => {
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
209 const { status, data } = error.response;
413
a9440a4826aa refactor: display errormessages refactored to own lib
Thomas Junk <thomas.junk@intevation.de>
parents: 411
diff changeset
210 displayError({
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
211 title: "Backend Error",
406
40e7ab3df32c feat: Basic CRUD for usermanagement etd
Thomas Junk <thomas.junk@intevation.de>
parents: 401
diff changeset
212 message: `${status}: ${data.message}`
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
213 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
214 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
215 })
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
216 .catch(error => {
389
e7d5383bc358 feat: Primitive validation and error messages
Thomas Junk <thomas.junk@intevation.de>
parents: 379
diff changeset
217 this.submitted = false;
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
218 const { status, data } = error.response;
413
a9440a4826aa refactor: display errormessages refactored to own lib
Thomas Junk <thomas.junk@intevation.de>
parents: 411
diff changeset
219 displayError({
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
220 title: "Error while saving user",
406
40e7ab3df32c feat: Basic CRUD for usermanagement etd
Thomas Junk <thomas.junk@intevation.de>
parents: 401
diff changeset
221 message: `${status}: ${data.message}`
376
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
222 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
223 });
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
224 }
e42f42eb9353 refactor: Userdetails refactored to card model
Thomas Junk <thomas.junk@intevation.de>
parents: 375
diff changeset
225 }
356
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
226 };
dc8052b60485 feat: User detail card added
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
227 </script>