Mercurial > gemma
annotate client/src/App.vue @ 1033:fd7059f7cbdc
added UI for PDF export (with static PDFs)
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Wed, 24 Oct 2018 15:35:50 +0200 |
parents | ca628dce90dd |
children | 1ff8c072df18 |
rev | line source |
---|---|
3 | 1 <template> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
2 <div id="app" class="main"> |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
3 <div v-if="isAuthenticated" class="d-flex flex-column userinterface"> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
4 <div class="topcontainer"> |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
5 <Topbar :routeName="routeName"></Topbar> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
6 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
7 <div class="midcontainer d-flex flex-row"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
8 <div class="leftcontainer"> |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
9 <Sidebar></Sidebar> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
10 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
11 <div class="middle"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
12 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
13 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
14 <div class="rightcontainer"> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
15 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
16 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
17 </div> |
626
d4fa28bfa6ec
fix: layout minor fixes of buttons and menu
Thomas Junk <thomas.junk@intevation.de>
parents:
621
diff
changeset
|
18 <div class="bottomcontainer d-flex flex-row align-items-end"> |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
19 <Userbar></Userbar> |
816
cd79f62794dd
client: prepare survey selection
Bernhard Reiter <bernhard@intevation.de>
parents:
713
diff
changeset
|
20 <Morphtool v-if="routeName == 'mainview'"></Morphtool> |
713
badbc0207418
feat: systeminformation feature added
Thomas Junk <thomas.junk@intevation.de>
parents:
649
diff
changeset
|
21 <Linetool v-if="routeName == 'mainview'"></Linetool> |
1033
fd7059f7cbdc
added UI for PDF export (with static PDFs)
Markus Kottlaender <markus@intevation.de>
parents:
1019
diff
changeset
|
22 <Pdftool v-if="routeName == 'mainview'"></Pdftool> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
23 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
24 </div> |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
25 <div class="d-flex flex-column"> |
962
d7f34791b18d
refac: moved linetool and morphtool
Thomas Junk <thomas.junk@intevation.de>
parents:
823
diff
changeset
|
26 <router-view /> |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
27 </div> |
581 | 28 </div> |
3 | 29 </template> |
30 | |
31 <style lang="scss"> | |
161
b7ac2e4f9c5c
feat: collapsible sidebar
Thomas Junk <thomas.junk@intevation.de>
parents:
30
diff
changeset
|
32 html { |
b7ac2e4f9c5c
feat: collapsible sidebar
Thomas Junk <thomas.junk@intevation.de>
parents:
30
diff
changeset
|
33 height: 100%; |
539
924490b3395b
refac: Loginmask reworked
Thomas Junk <thomas.junk@intevation.de>
parents:
161
diff
changeset
|
34 width: 100%; |
924490b3395b
refac: Loginmask reworked
Thomas Junk <thomas.junk@intevation.de>
parents:
161
diff
changeset
|
35 margin: 0 auto; |
161
b7ac2e4f9c5c
feat: collapsible sidebar
Thomas Junk <thomas.junk@intevation.de>
parents:
30
diff
changeset
|
36 } |
17
7d242100af46
Adjusted the look and feel of the login page according to ISC
Thomas Junk <thomas.junk@intevation.de>
parents:
13
diff
changeset
|
37 body { |
542
505656a9947f
refac: layout refactored
Thomas Junk <thomas.junk@intevation.de>
parents:
539
diff
changeset
|
38 height: 100%; |
505656a9947f
refac: layout refactored
Thomas Junk <thomas.junk@intevation.de>
parents:
539
diff
changeset
|
39 width: 100%; |
17
7d242100af46
Adjusted the look and feel of the login page according to ISC
Thomas Junk <thomas.junk@intevation.de>
parents:
13
diff
changeset
|
40 background-color: #efefef !important; |
7d242100af46
Adjusted the look and feel of the login page according to ISC
Thomas Junk <thomas.junk@intevation.de>
parents:
13
diff
changeset
|
41 } |
7d242100af46
Adjusted the look and feel of the login page according to ISC
Thomas Junk <thomas.junk@intevation.de>
parents:
13
diff
changeset
|
42 |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
43 .topcontainer { |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
44 height: 10vh; |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
45 } |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
46 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
47 .bottomcontainer { |
626
d4fa28bfa6ec
fix: layout minor fixes of buttons and menu
Thomas Junk <thomas.junk@intevation.de>
parents:
621
diff
changeset
|
48 height: 10vh; |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
49 } |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
50 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
51 .midcontainer { |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
52 height: 80vh; |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
53 } |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
54 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
55 .rightcontainer { |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
56 width: 20vw; |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
57 } |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
58 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
59 .leftcontainer { |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
60 width: 20vw; |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
61 } |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
62 |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
63 .middle { |
631
13bccabbf7c5
fix: usermenu or sidebar trigger arrangement of user/userdetailsview
Thomas Junk <thomas.junk@intevation.de>
parents:
626
diff
changeset
|
64 width: 60vw; |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
65 } |
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
66 |
581 | 67 .userinterface { |
68 position: absolute; | |
69 top: 0; | |
70 left: 0; | |
71 height: 100vh; | |
72 width: 100vw; | |
73 z-index: 4; | |
74 pointer-events: none; | |
75 } | |
76 | |
3 | 77 #app { |
581 | 78 height: 100vh; |
79 width: 100vw; | |
3 | 80 font-family: "Avenir", Helvetica, Arial, sans-serif; |
81 -webkit-font-smoothing: antialiased; | |
82 -moz-osx-font-smoothing: grayscale; | |
83 text-align: center; | |
84 color: #2c3e50; | |
85 } | |
86 </style> | |
551
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
87 |
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
88 <script> |
1019
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
89 /* |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
90 * This is Free Software under GNU Affero General Public License v >= 3.0 |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
91 * without warranty, see README.md and license for details. |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
92 * |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
93 * SPDX-License-Identifier: AGPL-3.0-or-later |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
94 * License-Filename: LICENSES/AGPL-3.0.txt |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
95 * |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
96 * Copyright (C) 2018 by via donau |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
97 * – Österreichische Wasserstraßen-Gesellschaft mbH |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
98 * Software engineering by Intevation GmbH |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
99 * |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
100 * Author(s): |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
101 * Thomas Junk <thomas.junk@intevation.de> |
ca628dce90dd
Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents:
962
diff
changeset
|
102 */ |
585
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
581
diff
changeset
|
103 import Sidebar from "./application/Sidebar"; |
ef307bd6b5d8
refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
581
diff
changeset
|
104 import Topbar from "./application/Topbar"; |
553
f41c74b8af9c
fix: Sidebar/Topmenu only visible when logged in
Thomas Junk <thomas.junk@intevation.de>
parents:
551
diff
changeset
|
105 import { mapGetters } from "vuex"; |
641
14dfab4e6e32
refac: rename application/user to application/userbar to improve naming consistency
Thomas Junk <thomas.junk@intevation.de>
parents:
631
diff
changeset
|
106 import Userbar from "./application/Userbar"; |
962
d7f34791b18d
refac: moved linetool and morphtool
Thomas Junk <thomas.junk@intevation.de>
parents:
823
diff
changeset
|
107 import Linetool from "./linetool/Linetool"; |
d7f34791b18d
refac: moved linetool and morphtool
Thomas Junk <thomas.junk@intevation.de>
parents:
823
diff
changeset
|
108 import Morphtool from "./morphtool/Morphtool"; |
1033
fd7059f7cbdc
added UI for PDF export (with static PDFs)
Markus Kottlaender <markus@intevation.de>
parents:
1019
diff
changeset
|
109 import Pdftool from "./pdftool/Pdftool"; |
553
f41c74b8af9c
fix: Sidebar/Topmenu only visible when logged in
Thomas Junk <thomas.junk@intevation.de>
parents:
551
diff
changeset
|
110 |
551
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
111 export default { |
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
112 name: "app", |
553
f41c74b8af9c
fix: Sidebar/Topmenu only visible when logged in
Thomas Junk <thomas.junk@intevation.de>
parents:
551
diff
changeset
|
113 computed: { |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
114 ...mapGetters("user", ["isAuthenticated"]), |
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
115 routeName() { |
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
116 const routeName = this.$route.name; |
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
117 return routeName; |
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
118 } |
553
f41c74b8af9c
fix: Sidebar/Topmenu only visible when logged in
Thomas Junk <thomas.junk@intevation.de>
parents:
551
diff
changeset
|
119 }, |
551
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
120 components: { |
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
121 Sidebar, |
621
b17a4482d07d
feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents:
590
diff
changeset
|
122 Topbar, |
649
83081ba6c9c1
feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents:
641
diff
changeset
|
123 Userbar, |
823
d7ae7338872d
client: add morphtool again
Bernhard Reiter <bernhard@intevation.de>
parents:
819
diff
changeset
|
124 Linetool, |
1033
fd7059f7cbdc
added UI for PDF export (with static PDFs)
Markus Kottlaender <markus@intevation.de>
parents:
1019
diff
changeset
|
125 Morphtool, |
fd7059f7cbdc
added UI for PDF export (with static PDFs)
Markus Kottlaender <markus@intevation.de>
parents:
1019
diff
changeset
|
126 Pdftool |
551
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
127 } |
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
128 }; |
89bc8111563a
refac: Layout adjustments
Thomas Junk <thomas.junk@intevation.de>
parents:
542
diff
changeset
|
129 </script> |