Mercurial > gemma
annotate client/src/components/Search.vue @ 2753:2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Thu, 21 Mar 2019 13:03:27 +0100 |
parents | 6446bf6d2a89 |
children | 7cd708b98239 |
rev | line source |
---|---|
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
1 <template> |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
2 <div :class="searchbarContainerStyle"> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
3 <div class="input-group-prepend m-0 d-print-none"> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
4 <span @click="toggleSearchbar" :class="searchButtonStyle" for="search"> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
5 <font-awesome-icon icon="search"></font-awesome-icon> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
6 </span> |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
7 </div> |
1449 | 8 <div |
1480 | 9 :class="[ |
10 'searchgroup', | |
11 { | |
12 'searchgroup-collapsed': !showSearchbar, | |
13 big: | |
14 showContextBox && | |
1797
67340ceecc5f
feat: define sections and stretches etd
Thomas Junk <thomas.junk@intevation.de>
parents:
1670
diff
changeset
|
15 ['bottlenecks', 'staging', 'stretches'].indexOf( |
67340ceecc5f
feat: define sections and stretches etd
Thomas Junk <thomas.junk@intevation.de>
parents:
1670
diff
changeset
|
16 contextBoxContent |
67340ceecc5f
feat: define sections and stretches etd
Thomas Junk <thomas.junk@intevation.de>
parents:
1670
diff
changeset
|
17 ) !== -1 |
1480 | 18 } |
19 ]" | |
1449 | 20 > |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
21 <input |
2753
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
22 @keyup.enter="triggerEnter" |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
23 id="search" |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
24 v-model="searchQuery" |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
25 type="text" |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
26 :class="searchInputStyle" |
1480 | 27 /> |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
28 </div> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
29 <div |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
30 v-if="showSearchbar && searchResults !== null && !showContextBox" |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
31 class="searchresults border-top ui-element bg-white rounded-bottom d-print-none position-absolute" |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
32 > |
1480 | 33 <div |
34 v-for="entry of searchResults" | |
35 :key="entry.name" | |
36 class="border-top text-left" | |
37 > | |
38 <a | |
39 href="#" | |
40 @click.prevent="moveToSearchResult(entry)" | |
41 class="p-2 d-block text-nowrap" | |
42 > | |
1441
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
43 <font-awesome-icon |
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
44 icon="ship" |
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
45 v-if="entry.type === 'bottleneck'" |
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
46 class="mr-1" |
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
47 fixed-width |
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
48 /> |
1480 | 49 <font-awesome-icon |
50 icon="water" | |
51 v-if="entry.type === 'rhm'" | |
52 class="mr-1" | |
53 fixed-width | |
54 /> | |
55 <font-awesome-icon | |
56 icon="city" | |
57 v-if="entry.type === 'city'" | |
58 class="mr-1" | |
59 fixed-width | |
60 /> | |
2454
219c5b57ef5b
Added icon to gouges in search result.
Sascha Wilde <wilde@intevation.de>
parents:
2440
diff
changeset
|
61 <font-awesome-icon |
2464
bc0f1771497a
Use better suited icon for gauges in search results.
Sascha Wilde <wilde@intevation.de>
parents:
2454
diff
changeset
|
62 icon="ruler-vertical" |
2454
219c5b57ef5b
Added icon to gouges in search result.
Sascha Wilde <wilde@intevation.de>
parents:
2440
diff
changeset
|
63 v-if="entry.type === 'gauge'" |
219c5b57ef5b
Added icon to gouges in search result.
Sascha Wilde <wilde@intevation.de>
parents:
2440
diff
changeset
|
64 class="mr-1" |
219c5b57ef5b
Added icon to gouges in search result.
Sascha Wilde <wilde@intevation.de>
parents:
2440
diff
changeset
|
65 fixed-width |
219c5b57ef5b
Added icon to gouges in search result.
Sascha Wilde <wilde@intevation.de>
parents:
2440
diff
changeset
|
66 /> |
1399
8e2c9e518440
improved search style
Markus Kottlaender <markus@intevation.de>
parents:
1398
diff
changeset
|
67 {{ entry.name }} |
8e2c9e518440
improved search style
Markus Kottlaender <markus@intevation.de>
parents:
1398
diff
changeset
|
68 </a> |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
69 </div> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
70 </div> |
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
71 </div> |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
72 </template> |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
73 |
1449 | 74 <style lang="scss" scoped> |
75 .searchcontainer { | |
76 opacity: 0.96; | |
77 } | |
78 | |
79 .searchcontainer .searchbar { | |
80 border-top-left-radius: 0 !important; | |
81 border-bottom-left-radius: 0 !important; | |
82 } | |
83 | |
84 .searchgroup { | |
85 margin-left: -3px; | |
2440
999bb511ef67
staging: layout logs
Thomas Junk <thomas.junk@intevation.de>
parents:
2286
diff
changeset
|
86 width: 630px; |
1449 | 87 overflow: hidden; |
88 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
89 |
1449 | 90 .searchgroup-collapsed { |
91 width: 0; | |
92 } | |
1286
ac6edfb83cf1
improved contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1282
diff
changeset
|
93 |
1449 | 94 .searchbar { |
95 height: 2rem !important; | |
96 box-shadow: none !important; | |
97 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
98 |
1449 | 99 .searchbar.rounded-top-right { |
100 border-radius: 0 !important; | |
101 border-top-right-radius: 0.25rem !important; | |
102 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
103 |
1449 | 104 .searchlabel.rounded-top-left { |
105 border-radius: 0 !important; | |
106 border-top-left-radius: 0.25rem !important; | |
107 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
108 |
1449 | 109 .input-group-text { |
110 height: 2rem; | |
111 width: 2rem; | |
112 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
113 |
1449 | 114 .input-group-prepend svg path { |
115 fill: #666; | |
116 } | |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
117 |
1449 | 118 .searchresults { |
119 box-shadow: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.2); | |
120 top: 2rem; | |
121 left: 0; | |
122 right: 0; | |
123 max-height: 24rem; | |
124 overflow: auto; | |
125 } | |
126 | |
127 .searchresults > div:first-child { | |
128 border-top: 0 !important; | |
129 } | |
130 | |
131 .searchresults a { | |
132 text-decoration: none; | |
133 } | |
134 | |
135 .searchresults a:hover { | |
136 background: #f8f8f8; | |
137 } | |
2283
1169f18a0f11
make room for searchbar
Thomas Junk <thomas.junk@intevation.de>
parents:
2136
diff
changeset
|
138 |
1169f18a0f11
make room for searchbar
Thomas Junk <thomas.junk@intevation.de>
parents:
2136
diff
changeset
|
139 .smallbox { |
1169f18a0f11
make room for searchbar
Thomas Junk <thomas.junk@intevation.de>
parents:
2136
diff
changeset
|
140 width: 2rem; |
1169f18a0f11
make room for searchbar
Thomas Junk <thomas.junk@intevation.de>
parents:
2136
diff
changeset
|
141 } |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
142 </style> |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
143 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
144 <script> |
1362
ca33ad696594
remove the first empyty lines
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1361
diff
changeset
|
145 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
146 * without warranty, see README.md and license for details. |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
147 * |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
148 * SPDX-License-Identifier: AGPL-3.0-or-later |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
149 * License-Filename: LICENSES/AGPL-3.0.txt |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
150 * |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
151 * Copyright (C) 2018 by via donau |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
152 * – Österreichische Wasserstraßen-Gesellschaft mbH |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
153 * Software engineering by Intevation GmbH |
1361
ea3a89a1813a
remove trailing whitespace, add headers for Makefile, add the missed authors
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1299
diff
changeset
|
154 * |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
155 * Author(s): |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
156 * Markus Kottländer <markus.kottlaender@intevation.de> |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
157 */ |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
158 import debounce from "lodash.debounce"; |
2753
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
159 import { mapState, mapGetters } from "vuex"; |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
160 |
1613
f2d24dceecc7
refac: cleanup import paths
Thomas Junk <thomas.junk@intevation.de>
parents:
1558
diff
changeset
|
161 import { displayError } from "@/lib/errors.js"; |
f2d24dceecc7
refac: cleanup import paths
Thomas Junk <thomas.junk@intevation.de>
parents:
1558
diff
changeset
|
162 import { HTTP } from "@/lib/http"; |
2753
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
163 import { format } from "date-fns"; |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
164 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
165 const setFocus = () => document.querySelector("#search").focus(); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
166 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
167 export default { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
168 name: "search", |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
169 data() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
170 return { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
171 searchQueryIsDirty: false, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
172 searchResults: null, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
173 isSearching: false |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
174 }; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
175 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
176 computed: { |
1282
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
177 ...mapState("application", [ |
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
178 "showSearchbar", |
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
179 "showContextBox", |
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
180 "contextBoxContent" |
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
181 ]), |
2753
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
182 ...mapState("imports", ["startDate", "endDate"]), |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
183 ...mapGetters("imports", ["filters"]), |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
184 searchQuery: { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
185 get() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
186 return this.$store.state.application.searchQuery; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
187 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
188 set(value) { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
189 this.$store.commit("application/searchQuery", value); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
190 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
191 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
192 searchIndicator: function() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
193 if (this.isSearching) { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
194 return "⟳"; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
195 } else if (this.searchQueryIsDirty) { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
196 return ""; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
197 } else { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
198 return "✓"; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
199 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
200 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
201 searchbarContainerStyle() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
202 return [ |
1282
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
203 "input-group searchcontainer shadow-xs", |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
204 { |
1282
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
205 "d-flex": this.contextBoxContent !== "imports", |
2283
1169f18a0f11
make room for searchbar
Thomas Junk <thomas.junk@intevation.de>
parents:
2136
diff
changeset
|
206 "d-none": this.contextBoxContent === "imports" && this.showContextBox, |
1169f18a0f11
make room for searchbar
Thomas Junk <thomas.junk@intevation.de>
parents:
2136
diff
changeset
|
207 smallbox: !this.showSearchbar |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
208 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
209 ]; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
210 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
211 searchInputStyle() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
212 return [ |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
213 "form-control ui-element search searchbar d-print-none border-0", |
1282
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
214 { "rounded-top-right": this.showContextBox || this.searchResults } |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
215 ]; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
216 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
217 searchButtonStyle() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
218 return [ |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
219 "ui-element input-group-text p-0 d-flex border-0 justify-content-center searchlabel bg-white d-print-none", |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
220 { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
221 rounded: !this.showSearchbar, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
222 "rounded-left": this.showSearchbar, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
223 "rounded-top-left": |
1282
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
224 this.showSearchbar && (this.showContextBox || this.searchResults) |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
225 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
226 ]; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
227 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
228 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
229 watch: { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
230 searchQuery: function() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
231 this.searchQueryIsDirty = true; |
2750
6446bf6d2a89
search: use global search only in global context
Thomas Junk <thomas.junk@intevation.de>
parents:
2464
diff
changeset
|
232 if (!this.showContextBox) this.triggerSearch(); |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
233 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
234 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
235 methods: { |
2753
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
236 loadLogs() { |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
237 this.$store |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
238 .dispatch("imports/getImports", { |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
239 filter: this.filters, |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
240 from: format(this.startDate, "YYYY-MM-DDTHH:mm:ss.SSS"), |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
241 to: format(this.endDate, "YYYY-MM-DDTHH:mm:ss.SSS"), |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
242 query: this.searchQuery |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
243 }) |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
244 .then(() => {}) |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
245 .catch(error => { |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
246 const { status, data } = error.response; |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
247 displayError({ |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
248 title: this.$gettext("Backend Error"), |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
249 message: `${status}: ${data.message || data}` |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
250 }); |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
251 }); |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
252 }, |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
253 triggerEnter() { |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
254 if (this.showContextBox && this.contextBoxContent === "importoverview") { |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
255 this.loadLogs(); |
2aa1620ffd9e
search: in context of importoverview pressing enter triggers a request for and updated dataset
Thomas Junk <thomas.junk@intevation.de>
parents:
2750
diff
changeset
|
256 } |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
257 if (!this.searchResults || this.searchResults.length != 1) return; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
258 this.moveToSearchResult(this.searchResults[0]); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
259 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
260 triggerSearch: debounce(function() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
261 this.doSearch(); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
262 }, 500), |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
263 doSearch() { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
264 this.isCalculating = true; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
265 this.searchResults = null; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
266 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
267 if (this.searchQuery == "") { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
268 return; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
269 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
270 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
271 HTTP.post( |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
272 "/search", |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
273 { string: this.searchQuery }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
274 { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
275 headers: { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
276 "X-Gemma-Auth": localStorage.getItem("token"), |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
277 "Content-type": "text/xml; charset=UTF-8" |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
278 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
279 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
280 ) |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
281 .then(response => { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
282 this.searchResults = response.data; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
283 }) |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
284 .catch(error => { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
285 const { status, data } = error.response; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
286 displayError({ |
1441
a4554e942954
Client: add a set of marked translations
Fadi Abbud <fadi.abbud@intevation.de>
parents:
1425
diff
changeset
|
287 title: this.$gettext("Backend Error"), |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
288 message: `${status}: ${data.message || data}` |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
289 }); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
290 }); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
291 |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
292 this.isCalculating = false; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
293 this.searchQueryIsDirty = false; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
294 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
295 moveToSearchResult(resultEntry) { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
296 if (resultEntry.geom.type == "Point") { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
297 let zoom = 11; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
298 if (resultEntry.type === "bottleneck") zoom = 17; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
299 if (resultEntry.type === "rhm") zoom = 15; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
300 if (resultEntry.type === "city") zoom = 13; |
2454
219c5b57ef5b
Added icon to gouges in search result.
Sascha Wilde <wilde@intevation.de>
parents:
2440
diff
changeset
|
301 if (resultEntry.type === "gauge") zoom = 15; |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
302 this.$store.commit("map/moveMap", { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
303 coordinates: resultEntry.geom.coordinates, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
304 zoom, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
305 preventZoomOut: true |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
306 }); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
307 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
308 // this.searchQuery = ""; // clear search query again |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
309 this.toggleSearchbar(); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
310 }, |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
311 toggleSearchbar() { |
1282
a7dd8a3356fc
fixed contextBox animations
Markus Kottlaender <markus@intevation.de>
parents:
1272
diff
changeset
|
312 if (!this.showContextBox) { |
1272
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
313 if (!this.showSearchbar) { |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
314 setTimeout(setFocus, 300); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
315 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
316 this.$store.commit("application/showSearchbar", !this.showSearchbar); |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
317 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
318 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
319 } |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
320 }; |
bc55ffaeb639
cleaned up client/src directory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
321 </script> |