# HG changeset patch
# User Thomas Junk <thomas.junk@intevation.de>
# Date 1542631340 -3600
# Node ID 55eae66af7491ac91f8e5d34696d400eda839f17
# Parent  f14293893430a0372e76ec36e16e59bc7b8fb1cf
relayouting soundingresults

diff -r f14293893430 -r 55eae66af749 client/src/application/assets/application.sass
--- a/client/src/application/assets/application.sass	Mon Nov 19 13:38:43 2018 +0100
+++ b/client/src/application/assets/application.sass	Mon Nov 19 13:42:20 2018 +0100
@@ -35,6 +35,9 @@
 $xx-large-offset: 5rem
 $x-small-offset: 0.25rem
 
+.w-90
+  width: 90%
+
 .debug
   border: 1px solid red
 
diff -r f14293893430 -r 55eae66af749 client/src/imports/Imports.vue
--- a/client/src/imports/Imports.vue	Mon Nov 19 13:38:43 2018 +0100
+++ b/client/src/imports/Imports.vue	Mon Nov 19 13:42:20 2018 +0100
@@ -1,19 +1,17 @@
 <template>
     <div :class="importStyle">
-        <div @click="$store.commit('application/showImportSoundingResults', false);" class="ui-element close-imports">
+        <div
+            @click="$store.commit('application/showImportSoundingResults', false);"
+            class="ui-element close-imports"
+        >
             <i class="fa fa-close"></i>
         </div>
-
         <h4>Import soundingresults</h4>
-        <hr class="mb-0">
-        <div class="p-3">
+        <hr class="mr-auto ml-auto mb-0 w-90">
+        <div v-if="editState" class="p-3">
             <div class="d-flex flex-row input-group mb-4">
                 <div class="">
-                    <label
-                        for="bottleneck"
-                        class="label-text"
-                        id="bottlenecklabel"
-                    >Bottleneck</label>
+                    <label for="bottleneck" class="label-text" id="bottlenecklabel">Bottleneck</label>
                 </div>
                 <input
                     id="bottleneck"
@@ -50,6 +48,8 @@
                     >{{option}}</option>
                 </select>
             </div>
+        </div>
+        <div class="uploadsection mr-auto ml-auto mt-4 mb-4">
             <div class="d-flex flex-row input-group mb-4">
                 <div class="custom-file">
                     <input
@@ -63,6 +63,7 @@
             </div>
             <div class="downloadbtn text-right">
                 <a
+                    v-if="editState"
                     download="meta.json"
                     :href="dataLink "
                     class="btn btn-outline-info mr-2"
@@ -83,12 +84,14 @@
 import { displayError, displayInfo } from "../application/lib/errors.js";
 import { mapState } from "vuex";
 
-const defaultLabel = "Choose file";
+const defaultLabel = "Choose .zip-file";
+const IMPORTSTATE = { UPLOAD: "UPLOAD", EDIT: "EDIT" };
 
 export default {
   name: "imports",
   data() {
     return {
+      importState: IMPORTSTATE.UPLOAD,
       depthReference: "",
       bottleneck: "",
       importDate: "",
@@ -130,6 +133,12 @@
   },
   computed: {
     ...mapState("application", ["showImportSoundingResults"]),
+    editState() {
+      return this.importState === IMPORTSTATE.EDIT;
+    },
+    uploadState() {
+      return this.importState === IMPORTSTATE.UPLOAD;
+    },
     importStyle() {
       return [
         "ui-element shadow imports",
@@ -179,6 +188,8 @@
 </script>
 
 <style lang="sass" scoped>
+.uploadsection
+  width: 90%
 .imports
   position: relative
   background-color: #ffffff
@@ -190,6 +201,7 @@
   background: #fff
   margin-left: $offset
   margin-top: -$offset
+  width: 90%
 
 .importscollapsed
   width: 0