Mercurial > gemma

annotate client/src/usermanagement/Passwordfield.vue @ 1033:fd7059f7cbdc

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
added UI for PDF export (with static PDFs)
author Markus Kottlaender <markus@intevation.de>
date Wed, 24 Oct 2018 15:35:50 +0200
parents ca628dce90dd
children
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>
1019
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
2 <div>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
3 <label for="password">{{this.label}}</label>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
4 <div class="d-flex d-row">
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
5 <input :type="isPasswordVisible" @change="fieldChanged" class="form-control" :placeholder='placeholder' :required="required">
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
6 <span class="input-group-text" @click="showPassword"><i :class="eyeIcon"></i></span>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
7 </div>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
8 <div v-show="passworderrors" class="text-danger"><small><i class="fa fa-warning"></i> {{ this.passworderrors}}</small></div>
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
9 </div>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
10 </template>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
11
616
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
12 <style>
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
13 /* FIXME does not work here, unclear why, so added to Login.vue
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
14 input[type="password"]::-ms-reveal {
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
15 display: none;
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
16 } */
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
17 </style>
51dc26b0f066 client: avoid extra password reveal button for IE/Edge
Bernhard Reiter <bernhard@intevation.de>
parents: 585
diff changeset
18
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
19 <script>
1019
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
20 /*
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
21 * This is Free Software under GNU Affero General Public License v >= 3.0
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
22 * without warranty, see README.md and license for details.
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
23 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
24 * SPDX-License-Identifier: AGPL-3.0-or-later
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
25 * License-Filename: LICENSES/AGPL-3.0.txt
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
26 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
27 * Copyright (C) 2018 by via donau
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
28 * – Österreichische Wasserstraßen-Gesellschaft mbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
29 * Software engineering by Intevation GmbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
30 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
31 * Author(s):
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
32 * Thomas Junk <thomas.junk@intevation.de>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 616
diff changeset
33 */
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
34 export default {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
35 name: "passwordfield",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
36 props: ["model", "placeholder", "label", "passworderrors", "required"],
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
37 data() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
38 return {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
39 password: "",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
40 readablePassword: false
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
41 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
42 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
43 methods: {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
44 showPassword() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
45 this.readablePassword = !this.readablePassword;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
46 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
47 fieldChanged(e) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
48 this.$emit("fieldchange", e.target.value);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
49 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
50 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
51 computed: {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
52 isPasswordVisible() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
53 return this.readablePassword ? "text" : "password";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
54 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
55 eyeIcon() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
56 return {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
57 fa: true,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
58 "fa-eye": !this.readablePassword,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
59 "fa-eye-slash": this.readablePassword
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
60 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
61 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
62 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
63 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
64 </script>