changeset 1183:1d4801145a2d

import soundingresults context now map instead administration
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 15 Nov 2018 16:33:12 +0100
parents 936dd3714325
children 064d44ccc6f2
files client/src/application/Sidebar.vue client/src/application/Topbar.vue client/src/imports/Imports.vue client/src/router.js client/src/store/application.js
diffstat 5 files changed, 68 insertions(+), 39 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/application/Sidebar.vue	Thu Nov 15 15:50:02 2018 +0100
+++ b/client/src/application/Sidebar.vue	Thu Nov 15 16:33:12 2018 +0100
@@ -12,9 +12,9 @@
                     <i class="fa fa-map-o align-self-center navicon"></i>Riverbed Morphology
                 </router-link>
                 <a
+                    class="text-body d-flex flex-row nav-link"
                     v-if="routeName == 'mainview'"
                     href="#"
-                    class="text-body d-flex flex-row nav-link"
                     @click="$store.commit('application/showBottlenecks', !showBottlenecks);"
                 >Bottlenecks</a>
                 <div v-if="isSysAdmin">
@@ -25,9 +25,17 @@
                     </router-link>
                 </div>
                 <div v-if="isWaterwayAdmin">
-                    <router-link class="text-body d-flex flex-row nav-link" to="imports">
+                    <div v-if="routeName == 'mainview'" class="d-flex flex-row nav-link">
+                        <i class="fa fa-upload align-self-center navicon"></i>
+                        <a
+                            href="#"
+                            class="text-body"
+                            @click="$store.commit('application/showImportSoundingResults', !showImportSoundingResults);"
+                        >Import soundingresults</a>
+                    </div>
+                    <!-- <router-link class="text-body d-flex flex-row nav-link" to="imports">
                         <i class="fa fa-upload align-self-center navicon"></i>Imports
-                    </router-link>
+                    </router-link>-->
                 </div>
                 <div v-if="isSysAdmin">
                     <router-link
@@ -78,7 +86,11 @@
   computed: {
     ...mapGetters("user", ["isSysAdmin", "isWaterwayAdmin"]),
     ...mapState("user", ["user"]),
-    ...mapState("application", ["showSidebar", "showBottlenecks"]),
+    ...mapState("application", [
+      "showSidebar",
+      "showBottlenecks",
+      "showImportSoundingResults"
+    ]),
     menuStyle() {
       return {
         menu: true,
@@ -109,6 +121,10 @@
 </script>
 
 <style lang="sass" scoped>
+
+a:hover
+  text-decoration: none
+
 .menupoints
   text-align: left
 
--- a/client/src/application/Topbar.vue	Thu Nov 15 15:50:02 2018 +0100
+++ b/client/src/application/Topbar.vue	Thu Nov 15 16:33:12 2018 +0100
@@ -2,6 +2,7 @@
     <div class="topbar d-flex flex-row">
         <Sidebar :routeName="routeName"></Sidebar>
         <Bottlenecks v-if="routeName == 'mainview'"></Bottlenecks>
+        <Imports v-if="routeName == 'mainview'"></Imports>
         <div v-if="routeName == 'mainview'" :class="searchbarContainerStyle">
             <div class="input-group-prepend shadow">
                 <span @click="toggleSearchbar" :class="searchButtonStyle" for="search">
@@ -9,7 +10,14 @@
                 </span>
             </div>
             <div class="searchgroup flex-fill">
-                <input @keyup.enter="takeFirstSearchresult" v-if="showSearchbar" id="search" v-model="searchQuery" type="text" class="form-control ui-element search searchbar d-print-none">
+                <input
+                    @keyup.enter="takeFirstSearchresult"
+                    v-if="showSearchbar"
+                    id="search"
+                    v-model="searchQuery"
+                    type="text"
+                    class="form-control ui-element search searchbar d-print-none"
+                >
                 <ul v-if="showSearchbar && searchResults !== null " class="list-group d-print-none">
                     <li v-for="entry of searchResults" :key="entry.name" class="list-group-item">
                         <a href="#" @click.prevent="moveToSearchResult(entry)">{{entry.name}}</a>
@@ -102,20 +110,17 @@
 
 import { displayError } from "../application/lib/errors.js";
 import { HTTP } from "../application/lib/http";
-import Identify from "../identify/Identify";
-import Layers from "../layers/Layers";
-import Sidebar from "./Sidebar";
-import Bottlenecks from "../bottlenecks/Bottlenecks";
 
 const setFocus = () => document.querySelector("#search").focus();
 
 export default {
   name: "topbar",
   components: {
-    Identify,
-    Layers,
-    Sidebar,
-    Bottlenecks
+    Identify: () => import("../identify/Identify"),
+    Layers: () => import("../layers/Layers"),
+    Sidebar: () => import("./Sidebar"),
+    Bottlenecks: () => import("../bottlenecks/Bottlenecks"),
+    Imports: () => import("../imports/Imports.vue")
   },
   data() {
     return {
--- a/client/src/imports/Imports.vue	Thu Nov 15 15:50:02 2018 +0100
+++ b/client/src/imports/Imports.vue	Thu Nov 15 16:33:12 2018 +0100
@@ -1,11 +1,18 @@
 <template>
-    <div>
-        <div class="imports shadow d-flex content flex-column">
+    <div v-if="showImportSoundingResults">
+        <div class="imports shadow d-flex content flex-column ui-element">
             <div class="card importcard">
-                <div
-                    class="card-header shadow-sm text-white bg-info mb-3"
-                >Import of sounding results</div>
                 <div class="card-body importcardbody">
+                    <div
+                        @click="$store.commit('application/showImportSoundingResults', !showImportSoundingResults);"
+                        class="ui-element close-showImportSoundingResults"
+                    >
+                        <i class="fa fa-close"></i>
+                    </div>
+                    <div class="card-title mb-4 headline">
+                        <h4>Import soundingresults</h4>
+                        <hr>
+                    </div>
                     <div class="d-flex flex-row input-group mb-4">
                         <div class="">
                             <label
@@ -82,6 +89,7 @@
 <script>
 import { HTTP } from "../application/lib/http";
 import { displayError, displayInfo } from "../application/lib/errors.js";
+import { mapState } from "vuex";
 
 const defaultLabel = "Choose file";
 
@@ -129,6 +137,7 @@
     }
   },
   computed: {
+    ...mapState("application", ["showImportSoundingResults"]),
     dataLink() {
       return (
         "data:text/json;charset=utf-8," +
@@ -169,6 +178,15 @@
 </script>
 
 <style lang="scss" scoped>
+.close-showImportSoundingResults {
+  position: absolute;
+  z-index: 2;
+  right: 0;
+  top: 7px;
+  border-radius: $border-radius;
+  height: $icon-width;
+  width: $icon-height;
+}
 .label-text {
   width: 10rem;
   text-align: left;
@@ -181,15 +199,18 @@
   position: relative;
   height: 100%;
   width: 90%;
-  margin: auto;
+  margin-left: auto;
+  margin-right: auto;
 }
 .imports {
+  position: relative;
   background-color: white;
-  width: 40rem;
+  width: 30rem;
   height: 28rem;
   margin-left: auto;
   margin-right: auto;
-  margin-top: $offset;
+  border-radius: $border-radius;
+  opacity: $slight-transparent;
 }
 .downloadbtn {
   position: absolute;
--- a/client/src/router.js	Thu Nov 15 15:50:02 2018 +0100
+++ b/client/src/router.js	Thu Nov 15 16:33:12 2018 +0100
@@ -25,7 +25,6 @@
 const Main = () => import("./application/Main.vue");
 const Usermanagement = () => import("./usermanagement/Usermanagement.vue");
 const Logs = () => import("./logs/logs.vue");
-const Imports = () => import("./imports/Imports.vue");
 const Importqueue = () => import("./importqueue/Importqueue.vue");
 const Systemconfiguration = () =>
   import("./systemconfiguration/systemconfiguration.vue");
@@ -88,22 +87,6 @@
       }
     },
     {
-      path: "/imports",
-      name: "imports",
-      component: Imports,
-      meta: {
-        requiresAuth: true
-      },
-      beforeEnter: (to, from, next) => {
-        const isWaterwayAdmin = store.getters["user/isWaterwayAdmin"];
-        if (!isWaterwayAdmin) {
-          next("/");
-        } else {
-          next();
-        }
-      }
-    },
-    {
       path: "/importqueue",
       name: "importqueue",
       component: Importqueue,
--- a/client/src/store/application.js	Thu Nov 15 15:50:02 2018 +0100
+++ b/client/src/store/application.js	Thu Nov 15 16:33:12 2018 +0100
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  * License-Filename: LICENSES/AGPL-3.0.txt
  *
- * Copyright (C) 2018 by via donau 
+ * Copyright (C) 2018 by via donau
  *   – Österreichische Wasserstraßen-Gesellschaft mbH
  * Software engineering by Intevation GmbH
  *
@@ -29,6 +29,7 @@
     showIdentify: false,
     showLayers: true,
     showPdfTool: false,
+    showImportSoundingResults: false,
     countries: ["AT", "SK", "HU", "HR", "RS", "BiH", "BG", "RO", "UA"],
     version
   },
@@ -73,6 +74,9 @@
     },
     showPdfTool: (state, show) => {
       state.showPdfTool = show;
+    },
+    showImportSoundingResults: (state, show) => {
+      state.showImportSoundingResults = show;
     }
   }
 };