Mercurial > gemma

comparison client/src/components/importschedule/importtypes/Distancemarksvirtual.vue @ 1996:fda5c78fb7d3 importschedulerefac

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
moved components
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 24 Jan 2019 13:43:36 +0100
parents client/src/components/importschedule/Distancemarksvirtual.vue@29f02d0043a9
children 5af57aa2b8fc
comparison
equal deleted inserted replaced
1992:29f02d0043a9 1996:fda5c78fb7d3
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">
9 <input
10 @keyup="urlChanged"
11 class="form-control"
12 type="url"
13 :value="url"
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">
29 <input
30 @keyup="usernameChanged"
31 class="form-control"
32 type="text"
33 :value="username"
34 />
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">
49 <input
50 @keyup="passwordChanged"
51 class="form-control"
52 :type="showPassword"
53 :value="password"
54 />
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>
77 export default {
78 name: "distancemarksvirtual",
79 props: ["url", "username", "password"],
80 data() {
81 return {
82 passwordVisible: false
83 };
84 },
85 computed: {
86 showPassword() {
87 if (this.passwordVisible) return "text";
88 return "password";
89 }
90 },
91 methods: {
92 urlChanged(e) {
93 this.$emit("urlChanged", e.target.value);
94 },
95 usernameChanged(e) {
96 this.$emit("usernameChanged", e.target.value);
97 },
98 passwordChanged(e) {
99 this.$emit("passwordChanged", e.target.value);
100 }
101 }
102 };
103 </script>
104
105 <style></style>