Mercurial > gemma
annotate client/src/application/Topbar.vue @ 666:4c36b0e39d78
feat: prepareProfile converts geoJSON to diagram data.
PrepareProfile assumes data given in geoJSON format.
It extracts heigth and width information for the diagram and
transposes every coordinate given relative to the first coordinate
in the first set.
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Tue, 18 Sep 2018 13:43:24 +0200 |
parents | 83081ba6c9c1 |
children | 3e2eeb215d0e |
rev | line source |
---|---|
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
1 <template> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
2 <div class="topbar d-flex flex-row justify-content-between"> |
638
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
3 <div @click="toggleSidebar"> |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
4 <i class="ui-element menubutton fa fa-bars"></i> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
5 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
6 <div v-if="routeName != 'usermanagement'" class="input-group searchcontainer"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
7 <div class="input-group-prepend shadow"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
8 <span class="input-group-text searchlabel" for="search"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
9 <i class="fa fa-search"></i> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
10 </span> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
11 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
12 <input id="search" type="text" class="form-control ui-element search searchbar"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
13 </div> |
630
855cca0142ec
refac: Usermanagement now flexible sidebar layout
Thomas Junk <thomas.junk@intevation.de>
parents:
629
diff
changeset
|
14 <div v-if="routeName != 'usermanagement'"> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
15 <i @click="splitScreen" class="ui-element splitscreen fa fa-window-restore shadow"></i> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
16 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
593
diff
changeset
|
17 <Layers v-if="routeName != 'usermanagement'"></Layers> |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
18 </div> |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
19 </template> |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
20 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
21 <style lang="scss"> |
593
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
22 .splitscreen { |
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
23 background-color: white; |
632
f2097d2aa048
fix: adjusted icon sizes
Thomas Junk <thomas.junk@intevation.de>
parents:
630
diff
changeset
|
24 padding: $small-offset; |
638
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
25 margin-right: $small-offset; |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
26 margin-left: $offset; |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
27 border-radius: $border-radius; |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
28 height: $icon-width; |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
29 width: $icon-height; |
593
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
30 } |
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
31 |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
32 .menubutton { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
33 background-color: white; |
632
f2097d2aa048
fix: adjusted icon sizes
Thomas Junk <thomas.junk@intevation.de>
parents:
630
diff
changeset
|
34 padding: $small-offset; |
638
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
35 border-radius: $border-radius; |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
36 margin-left: $offset; |
632
f2097d2aa048
fix: adjusted icon sizes
Thomas Junk <thomas.junk@intevation.de>
parents:
630
diff
changeset
|
37 height: $icon-width; |
f2097d2aa048
fix: adjusted icon sizes
Thomas Junk <thomas.junk@intevation.de>
parents:
630
diff
changeset
|
38 width: $icon-height; |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
39 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
40 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
41 .searchcontainer { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
42 margin-left: 20vw; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
43 margin-right: auto; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
44 width: 50vw !important; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
45 height: 39px; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
46 border-radius: 0.25rem; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
47 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
48 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
49 .searchbar { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
50 margin-left: auto; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
51 margin-right: auto; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
52 height: 50px; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
53 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
54 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
55 .topbar { |
638
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
56 padding-top: $offset; |
c2f040dba57f
feat: collapsible layer selection
Thomas Junk <thomas.junk@intevation.de>
parents:
632
diff
changeset
|
57 margin-right: $offset; |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
58 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
59 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
60 .logout { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
61 font-size: x-large; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
62 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
63 </style> |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
64 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
65 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
66 <script> |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
67 import Layers from "../layers/Layers"; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
68 |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
69 export default { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
70 name: "topbar", |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
71 components: { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
72 Layers: Layers |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
73 }, |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
638
diff
changeset
|
74 props: ["routeName"], |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
75 methods: { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
76 toggleSidebar() { |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
77 this.$store.commit("application/toggleSidebar"); |
593
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
78 }, |
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
79 splitScreen() { |
c4a4dc612191
feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents:
587
diff
changeset
|
80 this.$store.commit("application/toggleSplitScreen"); |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
81 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
82 } |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
83 }; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
84 </script> |