annotate client/src/components/systemconfiguration/MorphologyClassbreaks.vue @ 3606:a8190a570b71

client: configuration: prepared morphology classbreaks UI
author Markus Kottlaender <markus@intevation.de>
date Wed, 05 Jun 2019 12:02:23 +0200
parents
children 81473293cd9a
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
3606
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
1 <template>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
2 <div class="d-flex flex-column pb-4 border-bottom">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
3 <h5 class="py-2 px-3 mb-2 m-0">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
4 <translate>Bottleneck Morphology Classbreaks</translate>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
5 </h5>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
6 <div class="px-3">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
7 <h6 class="font-weight-bold"><translate>Sounding Result</translate></h6>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
8 <div class="d-flex flex-wrap">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
9 <div
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
10 class="input-group mb-3 mr-2 classbreak"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
11 v-for="(value, i) in classbreaks"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
12 :key="i"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
13 >
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
14 <select class="form-control form-control-sm">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
15 <option>&lt;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
16 <option>&le;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
17 <option>&gt;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
18 <option>&ge;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
19 </select>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
20 <input
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
21 v-model="classbreaks[i]"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
22 type="number"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
23 min="0"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
24 step="0.1"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
25 class="form-control form-control-sm"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
26 />
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
27 <div class="input-group-append">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
28 <button
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
29 class="btn btn-sm btn-danger"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
30 type="button"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
31 @click="classbreaks.splice(i, 1)"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
32 >
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
33 <font-awesome-icon icon="trash" />
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
34 </button>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
35 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
36 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
37 <button
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
38 class="btn btn-sm btn-success mb-3"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
39 @click="classbreaks.unshift(classbreaks.length ? classbreaks[0] : 1)"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
40 >
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
41 <font-awesome-icon icon="plus" />
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
42 </button>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
43 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
44 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
45 <div class="px-3">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
46 <h6 class="font-weight-bold">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
47 <translate>Sounding Result Comparison</translate>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
48 </h6>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
49 <div class="d-flex flex-wrap">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
50 <div
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
51 class="input-group mb-3 mr-2 classbreak"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
52 v-for="(value, i) in compareClassbreaks"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
53 :key="i"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
54 >
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
55 <select class="form-control form-control-sm">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
56 <option>&lt;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
57 <option>&le;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
58 <option>&gt;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
59 <option>&ge;</option>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
60 </select>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
61 <input
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
62 v-model="compareClassbreaks[i]"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
63 type="number"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
64 step="0.1"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
65 class="form-control form-control-sm"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
66 />
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
67 <div class="input-group-append">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
68 <button
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
69 class="btn btn-sm btn-danger"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
70 type="button"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
71 @click="classbreaks.splice(i, 1)"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
72 >
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
73 <font-awesome-icon icon="trash" />
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
74 </button>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
75 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
76 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
77 <button
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
78 class="btn btn-sm btn-success mb-3"
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
79 @click="
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
80 compareClassbreaks.unshift(
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
81 compareClassbreaks.length ? compareClassbreaks[0] : 1
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
82 )
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
83 "
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
84 >
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
85 <font-awesome-icon icon="plus" />
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
86 </button>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
87 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
88 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
89 <div class="mt-4 px-3">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
90 <a @click.prevent="submit" class="btn btn-info btn-sm text-white">
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
91 <translate>Send</translate>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
92 </a>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
93 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
94 </div>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
95 </template>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
96
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
97 <style lang="sass" scoped>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
98 .classbreak
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
99 width: 130px
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
100 input
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
101 width: 30px
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
102 </style>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
103
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
104 <script>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
105 /* This is Free Software under GNU Affero General Public License v >= 3.0
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
106 * without warranty, see README.md and license for details.
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
107 *
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
108 * SPDX-License-Identifier: AGPL-3.0-or-later
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
109 * License-Filename: LICENSES/AGPL-3.0.txt
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
110 *
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
111 * Copyright (C) 2018 by via donau
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
112 * – Österreichische Wasserstraßen-Gesellschaft mbH
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
113 * Software engineering by Intevation GmbH
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
114 *
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
115 * Author(s):
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
116 * Markus Kottländer <markus@intevation.de>
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
117 */
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
118
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
119 export default {
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
120 data() {
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
121 return {
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
122 classbreaks: [],
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
123 compareClassbreaks: []
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
124 };
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
125 },
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
126 methods: {
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
127 submit() {}
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
128 }
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
129 };
a8190a570b71 client: configuration: prepared morphology classbreaks UI
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
130 </script>