1992
|
1 <template>
|
|
2 <div>
|
|
3 <div class="d-flex flex-row">
|
|
4 <div class="flex-column mt-3 mr-3 w-100">
|
|
5 <div class="flex-row text-left">
|
|
6 <small class="text-muted"> <translate>URL</translate> </small>
|
|
7 </div>
|
|
8 <div class="w-100">
|
1996
|
9 <input
|
|
10 @keyup="urlChanged"
|
|
11 class="form-control"
|
|
12 type="url"
|
|
13 :value="url"
|
1992
|
14 />
|
|
15 </div>
|
|
16 </div>
|
|
17 </div>
|
|
18 <div v-if="!url" class="d-flex flex-row">
|
|
19 <small
|
|
20 ><translate class="text-danger">Please enter a URL</translate></small
|
|
21 >
|
|
22 </div>
|
|
23 <div class="d-flex flex-row">
|
|
24 <div class="flex-column mt-3 mr-3 w-50">
|
|
25 <div class="flex-row text-left">
|
|
26 <small class="text-muted"> <translate>Username</translate> </small>
|
|
27 </div>
|
|
28 <div class="w-100">
|
1996
|
29 <input
|
|
30 @keyup="usernameChanged"
|
|
31 class="form-control"
|
|
32 type="text"
|
|
33 :value="username"
|
|
34 />
|
1992
|
35 </div>
|
|
36 <div v-if="!username" class="d-flex flex-row">
|
|
37 <small
|
|
38 ><translate class="text-danger"
|
|
39 >Please enter a Username</translate
|
|
40 ></small
|
|
41 >
|
|
42 </div>
|
|
43 </div>
|
|
44 <div class="flex-column mt-3 w-50">
|
|
45 <div class="flex-row text-left">
|
|
46 <small class="text-muted"> <translate>Password</translate> </small>
|
|
47 </div>
|
|
48 <div class="w-100 d-flex flex-row">
|
1996
|
49 <input
|
|
50 @keyup="passwordChanged"
|
|
51 class="form-control"
|
|
52 :type="showPassword"
|
|
53 :value="password"
|
|
54 />
|
1992
|
55 <span
|
|
56 class="input-group-text ml-2"
|
|
57 @click="passwordVisible = !passwordVisible"
|
|
58 >
|
|
59 <font-awesome-icon
|
|
60 :icon="passwordVisible ? 'eye-slash' : 'eye'"
|
|
61 ></font-awesome-icon>
|
|
62 </span>
|
|
63 </div>
|
|
64 <div v-if="!password" class="d-flex flex-row">
|
|
65 <small
|
|
66 ><translate class="text-danger"
|
|
67 >Please enter a Password</translate
|
|
68 ></small
|
|
69 >
|
|
70 </div>
|
|
71 </div>
|
|
72 </div>
|
|
73 </div>
|
|
74 </template>
|
|
75
|
|
76 <script>
|
2069
|
77 /* This is Free Software under GNU Affero General Public License v >= 3.0
|
|
78 * without warranty, see README.md and license for details.
|
|
79 *
|
|
80 * SPDX-License-Identifier: AGPL-3.0-or-later
|
|
81 * License-Filename: LICENSES/AGPL-3.0.txt
|
|
82 *
|
|
83 * Copyright (C) 2018 by via donau
|
|
84 * – Österreichische Wasserstraßen-Gesellschaft mbH
|
|
85 * Software engineering by Intevation GmbH
|
|
86 *
|
|
87 * Author(s):
|
|
88 * Thomas Junk <thomas.junk@intevation.de>
|
|
89 */
|
1992
|
90 export default {
|
1996
|
91 name: "distancemarksvirtual",
|
|
92 props: ["url", "username", "password"],
|
|
93 data() {
|
|
94 return {
|
|
95 passwordVisible: false
|
|
96 };
|
|
97 },
|
|
98 computed: {
|
|
99 showPassword() {
|
|
100 if (this.passwordVisible) return "text";
|
|
101 return "password";
|
|
102 }
|
|
103 },
|
|
104 methods: {
|
|
105 urlChanged(e) {
|
|
106 this.$emit("urlChanged", e.target.value);
|
|
107 },
|
|
108 usernameChanged(e) {
|
|
109 this.$emit("usernameChanged", e.target.value);
|
|
110 },
|
|
111 passwordChanged(e) {
|
|
112 this.$emit("passwordChanged", e.target.value);
|
|
113 }
|
|
114 }
|
1992
|
115 };
|
|
116 </script>
|
|
117
|
|
118 <style></style>
|