Mercurial > gemma
annotate client/src/components/gauge/Gauges.vue @ 2701:e622689d73bd
client: waterlevel diagram: use endpoint
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 18 Mar 2019 15:43:03 +0100 |
parents | cc3eee8b5d71 |
children | f393fabfdd35 |
rev | line source |
---|---|
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
1 <template> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
2 <div |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
3 :class="[ |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
4 'box ui-element rounded bg-white text-nowrap', |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
5 { expanded: showGauges } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
6 ]" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
7 > |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
8 <div style="width: 18rem"> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
9 <UIBoxHeader |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
10 icon="ruler-vertical" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
11 title="Gauges" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
12 :closeCallback="close" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
13 /> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
14 <div class="box-body"> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
15 <div |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
16 class="loading d-flex justify-content-center align-items-center" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
17 v-if="loading" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
18 > |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
19 <font-awesome-icon icon="spinner" spin /> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
20 </div> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
21 <select |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
22 @change="moveToGauge" |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
23 v-model="selectedGaugeISRS" |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
24 class="form-control font-weight-bold" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
25 > |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
26 <option :value="null"> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
27 <translate>Select Gauge</translate> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
28 </option> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
29 <option |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
30 v-for="g in gauges" |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
31 :key="g.properties.isrs_code" |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
32 :value="g.properties.isrs_code" |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
33 > |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
34 {{ gaugeLabel(g) }} |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
35 </option> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
36 </select> |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
37 <div v-if="selectedGaugeISRS" class="mt-2"> |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
38 <hr class="mb-1" /> |
2701
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
39 <div class="row no-gutters mb-2"> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
40 <div class="col-6 pr-1"> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
41 <small class="text-muted"><translate>From</translate>:</small> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
42 <input |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
43 type="date" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
44 class="form-control form-control-sm small" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
45 :value="dateFrom && dateFrom.toISOString().split('T')[0]" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
46 @input="dateFrom = $event.target.valueAsDate" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
47 /> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
48 </div> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
49 <div class="col-6 pl-1"> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
50 <small class="text-muted"><translate>To</translate>:</small> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
51 <input |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
52 type="date" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
53 class="form-control form-control-sm small" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
54 :value="dateTo && dateTo.toISOString().split('T')[0]" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
55 @input="dateTo = $event.target.valueAsDate" |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
56 /> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
57 </div> |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
58 </div> |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
59 <button |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
60 @click="showWaterlevelDiagram()" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
61 class="btn btn-sm btn-info d-block w-100" |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
62 > |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
63 <translate>Show Waterlevels</translate> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
64 </button> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
65 <hr /> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
66 <button class="btn btn-sm btn-info d-block w-100 mt-2" disabled> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
67 <translate>Show Hydrological Conditions</translate> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
68 </button> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
69 </div> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
70 </div> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
71 </div> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
72 </div> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
73 </template> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
74 |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
75 <style lang="scss" scoped> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
76 .loading { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
77 background: rgba(255, 255, 255, 0.9); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
78 position: absolute; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
79 z-index: 99; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
80 top: 0; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
81 right: 0; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
82 bottom: 0; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
83 left: 0; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
84 } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
85 </style> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
86 |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
87 <script> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
88 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
89 * without warranty, see README.md and license for details. |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
90 * |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
91 * SPDX-License-Identifier: AGPL-3.0-or-later |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
92 * License-Filename: LICENSES/AGPL-3.0.txt |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
93 * |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
94 * Copyright (C) 2018 by via donau |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
95 * – Österreichische Wasserstraßen-Gesellschaft mbH |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
96 * Software engineering by Intevation GmbH |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
97 * |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
98 * Author(s): |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
99 * Markus Kottländer <markus.kottlaender@intevation.de> |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
100 */ |
2604
85f9bf4a6eba
client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents:
2598
diff
changeset
|
101 import { mapState, mapGetters } from "vuex"; |
2701
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
102 import { displayError } from "@/lib/errors.js"; |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
103 |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
104 export default { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
105 data() { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
106 return { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
107 loading: false, |
2701
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
108 dateFrom: new Date(), |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
109 dateTo: new Date() |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
110 }; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
111 }, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
112 computed: { |
2696
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
113 ...mapState("application", ["showGauges", "activeSplitscreenId"]), |
2604
85f9bf4a6eba
client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents:
2598
diff
changeset
|
114 ...mapState("gauges", ["gauges"]), |
85f9bf4a6eba
client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents:
2598
diff
changeset
|
115 ...mapGetters("gauges", ["selectedGauge"]), |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
116 selectedGaugeISRS: { |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
117 get() { |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
118 return this.$store.state.gauges.selectedGaugeISRS; |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
119 }, |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
120 set(isrs) { |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
121 this.$store.dispatch("gauges/selectedGaugeISRS", isrs); |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
122 } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
123 } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
124 }, |
2696
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
125 watch: { |
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
126 selectedGaugeISRS() { |
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
127 if (this.activeSplitscreenId === "gauge-waterlevel") { |
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
128 this.showWaterlevelDiagram(); |
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
129 } |
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
130 } |
cc3eee8b5d71
client: waterlevel diagram: update diagram immediately when selectedGauge changes
Markus Kottlaender <markus@intevation.de>
parents:
2644
diff
changeset
|
131 }, |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
132 methods: { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
133 close() { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
134 this.$store.commit("application/showGauges", false); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
135 }, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
136 moveToGauge() { |
2604
85f9bf4a6eba
client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents:
2598
diff
changeset
|
137 if (!this.selectedGauge) return; |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
138 this.$store.commit("map/moveToExtent", { |
2604
85f9bf4a6eba
client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents:
2598
diff
changeset
|
139 feature: this.selectedGauge, |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
140 zoom: 17, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
141 preventZoomOut: true |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
142 }); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
143 }, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
144 showWaterlevelDiagram() { |
2644
50cfb12a54a4
client: gauges: fixed bug with panning to gauge...
Markus Kottlaender <markus@intevation.de>
parents:
2643
diff
changeset
|
145 // for panning the map to the gauge on opening the diagram: needs to be |
50cfb12a54a4
client: gauges: fixed bug with panning to gauge...
Markus Kottlaender <markus@intevation.de>
parents:
2643
diff
changeset
|
146 // set outside of the expandCallback to not always refer to the currently |
50cfb12a54a4
client: gauges: fixed bug with panning to gauge...
Markus Kottlaender <markus@intevation.de>
parents:
2643
diff
changeset
|
147 // selectedGauge |
50cfb12a54a4
client: gauges: fixed bug with panning to gauge...
Markus Kottlaender <markus@intevation.de>
parents:
2643
diff
changeset
|
148 let coordinates = this.selectedGauge.geometry.coordinates; |
50cfb12a54a4
client: gauges: fixed bug with panning to gauge...
Markus Kottlaender <markus@intevation.de>
parents:
2643
diff
changeset
|
149 |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
150 // configure splitscreen |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
151 let splitscreenConf = { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
152 id: "gauge-waterlevel", |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
153 component: "waterlevel", |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
154 title: |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
155 this.$gettext("Waterlevel") + |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
156 ": " + |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
157 this.gaugeLabel(this.selectedGauge), |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
158 icon: "ruler-vertical", |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
159 closeCallback: () => { |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
160 this.$store.commit("gauges/selectedGaugeISRS", null); |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
161 this.$store.commit("gauges/waterlevels", []); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
162 }, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
163 expandCallback: () => { |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
164 this.$store.commit("map/moveMap", { |
2644
50cfb12a54a4
client: gauges: fixed bug with panning to gauge...
Markus Kottlaender <markus@intevation.de>
parents:
2643
diff
changeset
|
165 coordinates, |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
166 zoom: 17, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
167 preventZoomOut: true |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
168 }); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
169 } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
170 }; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
171 this.$store.commit("application/addSplitscreen", splitscreenConf); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
172 this.$store.commit("application/activeSplitscreenId", splitscreenConf.id); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
173 this.$store.commit("application/splitscreenLoading", true); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
174 this.loading = true; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
175 this.$store.commit("application/showSplitscreen", true); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
176 this.$store |
2701
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
177 .dispatch("gauges/loadWaterlevels", { |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
178 from: this.dateFrom, |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
179 to: this.toDate |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
180 }) |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
181 .catch(error => { |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
182 const { status, data } = error.response; |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
183 displayError({ |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
184 title: "Backend Error", |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
185 message: `${status}: ${data.message || data}` |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
186 }); |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
187 }) |
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
188 .finally(() => { |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
189 this.$store.commit("application/splitscreenLoading", false); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
190 this.loading = false; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
191 }); |
2643
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
192 }, |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
193 gaugeLabel(gauge) { |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
194 let details = gauge.id |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
195 .split(".")[1] |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
196 .replace(/[()]/g, "") |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
197 .split(","); |
27933e66e848
client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents:
2642
diff
changeset
|
198 return `${gauge.properties.objname} (${details[3]})`; |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
199 } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
200 }, |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
201 mounted() { |
2701
e622689d73bd
client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents:
2696
diff
changeset
|
202 this.dateFrom.setDate(this.dateFrom.getDate() - 30); |
2598
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
203 this.$store.dispatch("gauges/loadGauges"); |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
204 } |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
205 }; |
5fa1ad39e1bc
client: added missing files for Gauges dialog
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
206 </script> |