Mercurial > gemma
annotate client/src/identify/Identify.vue @ 1251:d1903250390b
splitted mophtool into two components
one shows the survey results and the other the info bar when a bottleneck is selected (and no profile is shown)
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Wed, 21 Nov 2018 12:10:12 +0100 |
parents | 104d41ea7c15 |
children | da51fd6a72a0 |
rev | line source |
---|---|
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
1 <template> |
1249
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
2 <div :class="['box ui-element rounded bg-white mb-auto text-nowrap', { expanded: showIdentify }]"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
3 <div style="width: 20rem"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
4 <h5 class="mb-0 py-2 border-bottom"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
5 <i class="fa fa-info"></i> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
6 Identified |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
7 </h5> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
8 <div class="d-flex flex-column features p-3 flex-grow-1 text-left"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
9 <div v-if="currentMeasurement"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
10 <b> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
11 {{ currentMeasurement.quantity }} |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
12 ({{ currentMeasurement.unitSymbol }}): |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
13 </b><br> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
14 <small>{{ currentMeasurement.value }}</small> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
15 </div> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
16 <div v-for="(feature, i) of identifiedFeatures" :key="feature.getId()" > |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
17 <div v-if="feature.getId()" :class="{ 'mt-2': i }"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
18 <b>{{ feature.getId().replace(/[.][^.]*$/,"") /* cut away everything from the last . to the end */}}:</b> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
19 <small |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
20 v-for="(value, key) in prepareProperties(feature)" |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
21 :key="key" |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
22 > |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
23 <div v-if="value">{{key}}:{{value}}</div> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
24 </small> |
1247
c14353e2cdb9
repositioning of buttons (issue225)
Markus Kottlaender <markus@intevation.de>
parents:
1217
diff
changeset
|
25 </div> |
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
26 </div> |
1249
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
27 <div v-if="!currentMeasurement && !identifiedFeatures.length" class="text-muted small text-center my-auto"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
28 No features identified. |
806
5ef542130865
client: add info section
Bernhard Reiter <bernhard@intevation.de>
parents:
798
diff
changeset
|
29 </div> |
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
30 </div> |
1249
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
31 <div class="versioninfo border-top p-3 text-left"> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
32 gemma |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
33 <a href="https://hg.intevation.de/gemma/file/tip">source-code</a> |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
34 {{ versionStr }} |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
35 <br>Some data © |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
36 <a href="https://www.openstreetmap.org/copyright">OpenSteetMap</a>contributors |
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
37 </div> |
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
38 </div> |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
39 </div> |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
40 </template> |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
41 |
1167
1ae93a0438df
fixed topbar button styles
Markus Kottlaender <markus@intevation.de>
parents:
1139
diff
changeset
|
42 <style lang="sass" scoped> |
1ae93a0438df
fixed topbar button styles
Markus Kottlaender <markus@intevation.de>
parents:
1139
diff
changeset
|
43 .features |
1249
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
44 max-height: 19rem |
1167
1ae93a0438df
fixed topbar button styles
Markus Kottlaender <markus@intevation.de>
parents:
1139
diff
changeset
|
45 overflow-y: auto |
1ae93a0438df
fixed topbar button styles
Markus Kottlaender <markus@intevation.de>
parents:
1139
diff
changeset
|
46 |
1ae93a0438df
fixed topbar button styles
Markus Kottlaender <markus@intevation.de>
parents:
1139
diff
changeset
|
47 .versioninfo |
1ae93a0438df
fixed topbar button styles
Markus Kottlaender <markus@intevation.de>
parents:
1139
diff
changeset
|
48 font-size: 60% |
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
49 </style> |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
50 |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
51 <script> |
1063
7ec2133c6404
client: add area measurement. simpify code
Bernhard Reiter <bernhard@intevation.de>
parents:
1019
diff
changeset
|
52 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
53 * without warranty, see README.md and license for details. |
1063
7ec2133c6404
client: add area measurement. simpify code
Bernhard Reiter <bernhard@intevation.de>
parents:
1019
diff
changeset
|
54 * |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
55 * SPDX-License-Identifier: AGPL-3.0-or-later |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
56 * License-Filename: LICENSES/AGPL-3.0.txt |
1063
7ec2133c6404
client: add area measurement. simpify code
Bernhard Reiter <bernhard@intevation.de>
parents:
1019
diff
changeset
|
57 * |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
58 * Copyright (C) 2018 by via donau |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
59 * – Österreichische Wasserstraßen-Gesellschaft mbH |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
60 * Software engineering by Intevation GmbH |
1063
7ec2133c6404
client: add area measurement. simpify code
Bernhard Reiter <bernhard@intevation.de>
parents:
1019
diff
changeset
|
61 * |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
62 * Author(s): |
1251
d1903250390b
splitted mophtool into two components
Markus Kottlaender <markus@intevation.de>
parents:
1249
diff
changeset
|
63 * Thomas Junk <thomas.junk@intevation.de> |
d1903250390b
splitted mophtool into two components
Markus Kottlaender <markus@intevation.de>
parents:
1249
diff
changeset
|
64 * Bernhard E. Reiter <bernhard.reiter@intevation.de> |
d1903250390b
splitted mophtool into two components
Markus Kottlaender <markus@intevation.de>
parents:
1249
diff
changeset
|
65 * Markus Kottländer <markus.kottlaender@intevation.de> |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1014
diff
changeset
|
66 */ |
1123
d9e6a1f6f394
moved all collapse flags for UI elements to store
Markus Kottlaender <markus@intevation.de>
parents:
1113
diff
changeset
|
67 import { mapState, mapGetters } from "vuex"; |
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
68 |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
69 export default { |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
70 name: "identify", |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
71 computed: { |
1014
77202406b1a7
reverted demo build target, include revision number based on version tag
Markus Kottlaender <markus@intevation.de>
parents:
1007
diff
changeset
|
72 ...mapGetters("application", ["versionStr"]), |
1123
d9e6a1f6f394
moved all collapse flags for UI elements to store
Markus Kottlaender <markus@intevation.de>
parents:
1113
diff
changeset
|
73 ...mapState("application", ["showIdentify"]), |
1249
104d41ea7c15
restyling of boxes to save screen space
Markus Kottlaender <markus@intevation.de>
parents:
1247
diff
changeset
|
74 ...mapState("map", ["identifiedFeatures", "currentMeasurement"]) |
770
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
75 }, |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
76 methods: { |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
77 prepareProperties(feature) { |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
78 // return dict object with propertyname:plainvalue prepared for display |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
79 var properties = feature.getProperties(); |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
80 delete properties[feature.getGeometryName()]; |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
81 return properties; |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
82 } |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
83 } |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
84 }; |
c12ec7fde3f2
client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
85 </script> |