Mercurial > gemma
annotate client/src/morphtool/Morphtool.vue @ 1213:9d93968db2cd
replaced custom css with bootstrap classes
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 19 Nov 2018 14:13:01 +0100 |
parents | b23622905a3f |
children | ba8cd80d68b6 |
rev | line source |
---|---|
823
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
1 <template> |
1213
9d93968db2cd
replaced custom css with bootstrap classes
Markus Kottlaender <markus@intevation.de>
parents:
1191
diff
changeset
|
2 <div class="morphcontainer rounded position-relative"> |
9d93968db2cd
replaced custom css with bootstrap classes
Markus Kottlaender <markus@intevation.de>
parents:
1191
diff
changeset
|
3 <div v-if="selectedBottleneck && surveys && !selectedSurvey" class="ui-element bg-white rounded p-3 shadow"> |
1111
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
4 <div class="headline"> |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
5 <h4>{{ selectedBottleneck }}</h4> |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
6 <hr> |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
7 <div |
1146
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
8 @click="$store.dispatch('fairwayprofile/clearSelection');" |
1111
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
9 class="float-left ui-element d-flex morphtoolminus" |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
10 > |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
11 <i class="fa fa-close morphtoolsminus"></i> |
892
81b84ad962f8
morphtool streamlined
Thomas Junk <thomas.junk@intevation.de>
parents:
891
diff
changeset
|
12 </div> |
886
b1489669ba52
morphtool layout fixed
Thomas Junk <thomas.junk@intevation.de>
parents:
836
diff
changeset
|
13 </div> |
1111
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
14 <ul class="list-group surveylist"> |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
15 <li |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
16 v-for="survey of surveys" |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
17 :key="survey.data_info" |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
18 class="list-group-item" |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
19 @click.prevent="$store.commit('bottlenecks/setSelectedSurvey', survey)" |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
20 > |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
21 <a href="#" @click.prevent>{{ survey.date_info }}</a> |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
22 </li> |
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
23 </ul> |
892
81b84ad962f8
morphtool streamlined
Thomas Junk <thomas.junk@intevation.de>
parents:
891
diff
changeset
|
24 </div> |
1213
9d93968db2cd
replaced custom css with bootstrap classes
Markus Kottlaender <markus@intevation.de>
parents:
1191
diff
changeset
|
25 <div v-if="selectedSurvey && !showSplitscreen" class="ui-element shadow morphtool rounded"> |
892
81b84ad962f8
morphtool streamlined
Thomas Junk <thomas.junk@intevation.de>
parents:
891
diff
changeset
|
26 <div class="d-flex flex-row justify-content-between"> |
1146
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
27 <h6 class="my-auto px-2"> |
1111
f106aee673e7
selected bottleneck and surveys now handled by bottleneck store
Markus Kottlaender <markus@intevation.de>
parents:
1064
diff
changeset
|
28 {{ selectedBottleneck }} |
1146
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
29 ({{ selectedSurvey.date_info }}) |
1027
04a9e78dcc5f
refac: remove morphstore. not necessary
Thomas Junk <thomas.junk@intevation.de>
parents:
1019
diff
changeset
|
30 </h6> |
1146
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
31 <i class="fa fa-angle-up py-2 px-2 border-left" @click="$store.commit('application/showSplitscreen', true)" v-if="Object.keys(currentProfile).length"></i> |
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
32 <i class="fa fa-close text-danger py-2 px-2 border-left" @click="$store.dispatch('fairwayprofile/clearSelection');"></i> |
886
b1489669ba52
morphtool layout fixed
Thomas Junk <thomas.junk@intevation.de>
parents:
836
diff
changeset
|
33 </div> |
b1489669ba52
morphtool layout fixed
Thomas Junk <thomas.junk@intevation.de>
parents:
836
diff
changeset
|
34 </div> |
826
90a601884ff2
client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents:
823
diff
changeset
|
35 </div> |
823
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
36 </template> |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
37 |
1191
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
38 <style scoped lang="sass"> |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
39 .headline |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
40 margin-right: $offset |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
41 margin-left: $offset |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
42 |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
43 .morphcontainer |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
44 margin-bottom: $offset |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
45 margin-left: auto |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
46 |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
47 .surveylist |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
48 text-align: left |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
49 margin-bottom: $offset !important |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
50 margin-left: $offset |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
51 margin-right: $offset |
892
81b84ad962f8
morphtool streamlined
Thomas Junk <thomas.junk@intevation.de>
parents:
891
diff
changeset
|
52 |
1191
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
53 .surveylist li |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
54 margin-left: auto |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
55 margin-right: auto |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
56 border-style: none |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
57 padding-bottom: 0rem |
892
81b84ad962f8
morphtool streamlined
Thomas Junk <thomas.junk@intevation.de>
parents:
891
diff
changeset
|
58 |
1191
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
59 .morphtool |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
60 position: relative |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
61 background-color: white |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
62 height: $icon-width |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
63 margin-top: auto |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
64 margin-bottom: auto |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
65 z-index: 2 |
892
81b84ad962f8
morphtool streamlined
Thomas Junk <thomas.junk@intevation.de>
parents:
891
diff
changeset
|
66 |
1191
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
67 .morphtoolminus |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
68 position: absolute |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
69 top: 0 |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
70 right: 0 |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
71 background-color: white |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
72 padding: $small-offset |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
73 height: $icon-width |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
74 width: $icon-height |
b23622905a3f
switched entirely to sass instead of scss
Markus Kottlaender <markus@intevation.de>
parents:
1146
diff
changeset
|
75 z-index: 2 |
823
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
76 </style> |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
77 |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
78 <script> |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
79 /* |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
80 * This is Free Software under GNU Affero General Public License v >= 3.0 |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
81 * without warranty, see README.md and license for details. |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
82 * |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
83 * SPDX-License-Identifier: AGPL-3.0-or-later |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
84 * License-Filename: LICENSES/AGPL-3.0.txt |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
85 * |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
86 * Copyright (C) 2018 by via donau |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
87 * – Österreichische Wasserstraßen-Gesellschaft mbH |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
88 * Software engineering by Intevation GmbH |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
89 * |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
90 * Author(s): |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
91 * Thomas Junk <thomas.junk@intevation.de> |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
1015
diff
changeset
|
92 */ |
1140
2e06bc53b002
separating line/polygon/cut tools in UI
Markus Kottlaender <markus@intevation.de>
parents:
1123
diff
changeset
|
93 import { mapState, mapGetters } from "vuex"; |
826
90a601884ff2
client: improve survey selection for Morphtool
Bernhard Reiter <bernhard@intevation.de>
parents:
823
diff
changeset
|
94 |
823
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
95 export default { |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
96 name: "morphtool", |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
97 computed: { |
1140
2e06bc53b002
separating line/polygon/cut tools in UI
Markus Kottlaender <markus@intevation.de>
parents:
1123
diff
changeset
|
98 ...mapGetters("map", ["getLayerByName"]), |
2e06bc53b002
separating line/polygon/cut tools in UI
Markus Kottlaender <markus@intevation.de>
parents:
1123
diff
changeset
|
99 ...mapState("map", ["openLayersMap", "cutTool"]), |
1146
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
100 ...mapState("application", ["showSplitscreen"]), |
74e180ad3d6b
fairway profile UI improvements
Markus Kottlaender <markus@intevation.de>
parents:
1144
diff
changeset
|
101 ...mapState("fairwayprofile", ["currentProfile"]), |
1118
7e788814cbde
removed unnecessary imports and formatted code
Markus Kottlaender <markus@intevation.de>
parents:
1115
diff
changeset
|
102 ...mapState("bottlenecks", [ |
7e788814cbde
removed unnecessary imports and formatted code
Markus Kottlaender <markus@intevation.de>
parents:
1115
diff
changeset
|
103 "selectedBottleneck", |
7e788814cbde
removed unnecessary imports and formatted code
Markus Kottlaender <markus@intevation.de>
parents:
1115
diff
changeset
|
104 "surveys", |
7e788814cbde
removed unnecessary imports and formatted code
Markus Kottlaender <markus@intevation.de>
parents:
1115
diff
changeset
|
105 "selectedSurvey" |
7e788814cbde
removed unnecessary imports and formatted code
Markus Kottlaender <markus@intevation.de>
parents:
1115
diff
changeset
|
106 ]) |
823
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
107 } |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
108 }; |
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
diff
changeset
|
109 </script> |