changeset 2974:e161e1ffb6b5 unified_import

unified_imports: AGM moved to new interface
author Thomas Junk <thomas.junk@intevation.de>
date Mon, 08 Apr 2019 16:44:15 +0200
parents de6e5b9eae84
children 2a29bf8776d0
files client/src/components/ImportApprovedGaugeMeasurement.vue client/src/components/Sidebar.vue client/src/components/importconfiguration/Import.vue client/src/components/importconfiguration/ImportApprovedGaugeMeasurement.vue client/src/components/importconfiguration/ImportDetails.vue client/src/router.js client/src/store/importschedule.js
diffstat 7 files changed, 216 insertions(+), 223 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/ImportApprovedGaugeMeasurement.vue	Mon Apr 08 15:50:38 2019 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,140 +0,0 @@
-<template>
-  <div class="d-flex flex-row">
-    <Spacer />
-    <div class="card sysconfig mt-2 shadow-xs w-100 h-100 mr-2">
-      <UIBoxHeader icon="upload" :title="importGaugmeasurmentLabel" />
-      <div class="card-body stretches-card">
-        <div class="w-95 ml-auto mr-auto mt-4 mb-4">
-          <div class="d-flex flex-column text-left w-25">
-            <label class="text-nowrap" for="originator">
-              <small class="text-muted"
-                >{{ $options.ORIGINATOR }} / {{ $options.FROM }}</small
-              >
-            </label>
-            <input
-              type="text"
-              v-model="originator"
-              class="form-control"
-              id="originator"
-            />
-            <span class="text-left text-danger">
-              <small v-if="!originator">
-                <translate>Please enter an originator</translate>
-              </small>
-            </span>
-          </div>
-          <div class="mt-4 flex-column w-100">
-            <div class="custom-file">
-              <input
-                accept=".csv"
-                type="file"
-                @change="fileSelected"
-                class="custom-file-input"
-                id="uploadFile"
-              />
-              <label class="pointer custom-file-label" for="uploadFile">
-                {{ uploadLabel }}
-              </label>
-            </div>
-          </div>
-        </div>
-        <div class="buttons text-right">
-          <button
-            :disabled="disableUploadButton"
-            @click="submit"
-            class="btn btn-info mt-4"
-            type="button"
-          >
-            <font-awesome-icon class="fa-fw mr-2" fixed-width icon="play" />
-            <translate>Trigger import</translate>
-          </button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-/* This is Free Software under GNU Affero General Public License v >= 3.0
- * without warranty, see README.md and license for details.
- *
- * SPDX-License-Identifier: AGPL-3.0-or-later
- * License-Filename: LICENSES/AGPL-3.0.txt
- *
- * Copyright (C) 2018 by via donau
- *   – Österreichische Wasserstraßen-Gesellschaft mbH
- * Software engineering by Intevation GmbH
- *
- * Author(s):
- * Thomas Junk <thomas.junk@intevation.de>
- */
-
-import { HTTP } from "@/lib/http";
-import { displayError, displayInfo } from "@/lib/errors.js";
-import app from "@/main";
-
-export default {
-  name: "importapprovedgaugemeasurements",
-  data() {
-    return {
-      disableUploadButton: false,
-      uploadLabel: this.$gettext("choose file to upload"),
-      uploadFile: null,
-      originator: "viadonau"
-    };
-  },
-  computed: {
-    importGaugmeasurmentLabel() {
-      return this.$gettext("Import approved gaugemeasurements");
-    }
-  },
-  methods: {
-    initialState() {
-      this.uploadLabel = this.$gettext("choose file to upload");
-      this.uploadFile = null;
-      this.originator = "viadonau";
-    },
-    fileSelected(e) {
-      const files = e.target.files || e.dataTransfer.files;
-      if (!files) return;
-      this.uploadLabel = files[0].name;
-      this.uploadFile = files[0];
-    },
-    submit() {
-      if (!this.originator || !this.uploadFile) return;
-      let formData = new FormData();
-      formData.append("agm", this.uploadFile);
-      formData.append("originator", this.originator);
-      HTTP.post("/imports/agm", formData, {
-        headers: {
-          "X-Gemma-Auth": localStorage.getItem("token"),
-          "Content-Type": "multipart/form-data"
-        }
-      })
-        .then(() => {
-          displayInfo({
-            title: this.$gettext("Import"),
-            message: this.$gettext(
-              "Starting import of Approved Gauge Measurements"
-            )
-          });
-          this.initialState();
-        })
-        .catch(error => {
-          const { status, data } = error.response;
-          displayError({
-            title: this.$gettext("Backend Error"),
-            message: `${status}: ${data.message || data}`
-          });
-        });
-    }
-  },
-  components: {
-    Spacer: () => import("./Spacer")
-  },
-  ORIGINATOR: app.$gettext("originator"),
-  FROM: app.$gettext("from")
-};
-</script>
-
-<style lang="scss" scoped></style>
--- a/client/src/components/Sidebar.vue	Mon Apr 08 15:50:38 2019 +0200
+++ b/client/src/components/Sidebar.vue	Mon Apr 08 16:44:15 2019 +0200
@@ -49,12 +49,6 @@
             <font-awesome-icon class="fa-fw mr-2" fixed-width icon="upload" />
             <span class="fix-trans-space" v-translate>Soundingresults</span>
           </router-link>
-          <router-link to="/importapprovedgaugemeasurement">
-            <font-awesome-icon class="fa-fw mr-2" fixed-width icon="upload" />
-            <span class="fix-trans-space" v-translate
-              >Approved Gaugemeasurements</span
-            >
-          </router-link>
           <router-link to="/importwaterwayprofiles">
             <font-awesome-icon class="fa-fw mr-2" fixed-width icon="upload" />
             <span class="fix-trans-space" v-translate>Waterway Profiles</span>
--- a/client/src/components/importconfiguration/Import.vue	Mon Apr 08 15:50:38 2019 +0200
+++ b/client/src/components/importconfiguration/Import.vue	Mon Apr 08 16:44:15 2019 +0200
@@ -61,15 +61,15 @@
     <div class="d-flex flex-row-reverse w-100 mb-3">
       <button
         :key="1"
-        v-if="mode === $options.MODES.EDIT"
-        @click="mode = $options.MODES.LIST"
+        v-if="mode === $options.MODES.EDIT && !isOnetime"
+        @click="back()"
         class="btn btn-warning mr-3"
       >
         Back
       </button>
       <button
         :key="2"
-        v-if="mode === $options.MODES.EDIT"
+        v-if="mode === $options.MODES.EDIT && !isOnetime"
         type="submit"
         class="shadow-sm btn btn-info submit-button  mr-3"
       >
@@ -77,14 +77,18 @@
       </button>
       <button
         :key="3"
-        v-if="mode === $options.MODES.LIST"
+        v-if="mode === $options.MODES.LIST && !isOnetime"
         @click="newConfiguration()"
         class="btn btn-info mr-3"
       >
         <translate>New import</translate>
       </button>
       <button
-        v-if="mode === $options.MODES.EDIT && !isOnetime"
+        v-if="
+          mode === $options.MODES.EDIT &&
+            currentSchedule.importType &&
+            !isOnetime
+        "
         @click="triggerManualImport"
         type="button"
         class="shadow-sm btn btn-outline-info trigger mr-auto ml-3"
@@ -117,7 +121,8 @@
 import { displayInfo, displayError } from "@/lib/errors";
 import { HTTP } from "@/lib/http";
 import {
-  IMPORTTYPES
+  IMPORTTYPES,
+  MODES
   // IMPORTTYPEKIND,
   // initializeCurrentSchedule
 } from "@/store/importschedule";
@@ -130,13 +135,15 @@
     return {
       loading: false,
       sortColumn: "",
-      sortDirection: "",
-      mode: this.$options.MODES.LIST
+      sortDirection: ""
     };
   },
   methods: {
+    back() {
+      this.$store.commit("importschedule/setListMode");
+    },
     newConfiguration() {
-      this.mode = this.$options.MODES.EDIT;
+      this.$store.commit("importschedule/setEditMode");
     },
     getSchedules() {
       this.loading = true;
@@ -190,6 +197,7 @@
   computed: {
     ...mapState("application", ["searchQuery"]),
     ...mapState("importschedule", [
+      "mode",
       "schedules",
       "currentSchedule",
       "importScheduleDetailVisible"
@@ -234,12 +242,11 @@
     }
   },
   mounted() {
+    this.$store.commit("importschedule/setListMode");
+    this.$store.commit("importschedule/clearCurrentSchedule");
     this.getSchedules();
   },
-  MODES: {
-    LIST: "list",
-    EDIT: "edit"
-  },
-  IMPORTTYPES: IMPORTTYPES
+  IMPORTTYPES: IMPORTTYPES,
+  MODES: MODES
 };
 </script>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/client/src/components/importconfiguration/ImportApprovedGaugeMeasurement.vue	Mon Apr 08 16:44:15 2019 +0200
@@ -0,0 +1,129 @@
+<template>
+  <div>
+    <div class="d-flex flex-column text-left w-25">
+      <label class="text-nowrap" for="originator">
+        <small class="text-muted"
+          >{{ $options.ORIGINATOR }} / {{ $options.FROM }}</small
+        >
+      </label>
+      <input
+        type="text"
+        v-model="originator"
+        class="form-control"
+        id="originator"
+      />
+      <span class="text-left text-danger">
+        <small v-if="!originator">
+          <translate>Please enter an originator</translate>
+        </small>
+      </span>
+    </div>
+    <div class="mt-4 flex-column w-100">
+      <div class="custom-file">
+        <input
+          accept=".csv"
+          type="file"
+          @change="fileSelected"
+          class="custom-file-input"
+          id="uploadFile"
+        />
+        <label class="pointer custom-file-label" for="uploadFile">
+          {{ uploadLabel }}
+        </label>
+      </div>
+    </div>
+    <div class="d-flex flex-row-reverse w-100 mt-3">
+      <button :key="1" @click="back()" class="btn btn-warning">
+        Back
+      </button>
+      <button
+        :key="2"
+        type="submit"
+        @click="submit"
+        class="shadow-sm btn btn-info submit-button  mr-3"
+      >
+        <translate>Submit</translate>
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+/* This is Free Software under GNU Affero General Public License v >= 3.0
+ * without warranty, see README.md and license for details.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ * License-Filename: LICENSES/AGPL-3.0.txt
+ *
+ * Copyright (C) 2018 by via donau
+ *   – Österreichische Wasserstraßen-Gesellschaft mbH
+ * Software engineering by Intevation GmbH
+ *
+ * Author(s):
+ * Thomas Junk <thomas.junk@intevation.de>
+ */
+
+import { HTTP } from "@/lib/http";
+import { displayError, displayInfo } from "@/lib/errors.js";
+import app from "@/main";
+
+export default {
+  name: "importapprovedgaugemeasurements",
+  data() {
+    return {
+      disableUploadButton: false,
+      uploadLabel: this.$gettext("choose file to upload"),
+      uploadFile: null,
+      originator: "viadonau"
+    };
+  },
+  computed: {
+    importGaugmeasurmentLabel() {
+      return this.$gettext("Import approved gaugemeasurements");
+    }
+  },
+  methods: {
+    back() {
+      this.$store.commit("importschedule/setListMode");
+    },
+    fileSelected(e) {
+      const files = e.target.files || e.dataTransfer.files;
+      if (!files) return;
+      this.uploadLabel = files[0].name;
+      this.uploadFile = files[0];
+    },
+    submit() {
+      if (!this.originator || !this.uploadFile) return;
+      let formData = new FormData();
+      formData.append("agm", this.uploadFile);
+      formData.append("originator", this.originator);
+      HTTP.post("/imports/agm", formData, {
+        headers: {
+          "X-Gemma-Auth": localStorage.getItem("token"),
+          "Content-Type": "multipart/form-data"
+        }
+      })
+        .then(() => {
+          displayInfo({
+            title: this.$gettext("Import"),
+            message: this.$gettext(
+              "Starting import of Approved Gauge Measurements"
+            )
+          });
+          this.back();
+        })
+        .catch(error => {
+          const { status, data } = error.response;
+          displayError({
+            title: this.$gettext("Backend Error"),
+            message: `${status}: ${data.message || data}`
+          });
+        });
+    }
+  },
+  ORIGINATOR: app.$gettext("originator"),
+  FROM: app.$gettext("from")
+};
+</script>
+
+<style lang="scss" scoped></style>
--- a/client/src/components/importconfiguration/ImportDetails.vue	Mon Apr 08 15:50:38 2019 +0200
+++ b/client/src/components/importconfiguration/ImportDetails.vue	Mon Apr 08 16:44:15 2019 +0200
@@ -1,49 +1,50 @@
 <template>
-  <div>
-    <div class="mb-3">
-      <select v-model="Import" class="custom-select" id="importtype">
-        <optgroup :label="regularLabel">
-          <option :value="$options.IMPORTTYPES.BOTTLENECK">
-            <translate>Bottlenecks</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.WATERWAYAXIS">
-            <translate>Waterway axis</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.GAUGEMEASUREMENT">
-            <translate>Gauge measurement</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.FAIRWAYAVAILABILITY">
-            <translate>Available fairway depths</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.WATERWAYAREA">
-            <translate>Waterway area</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.FAIRWAYDIMENSION">
-            <translate>Fairway dimension</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.WATERWAYGAUGES">
-            <translate>Waterway gauges</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.DISTANCEMARKSVIRTUAL">
-            <translate>Distance marks virtual</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.DISTANCEMARKSASHORE">
-            <translate>Distance marks ashore</translate>
-          </option>
-        </optgroup>
-        <optgroup :label="onetimeLabel">
-          <option :value="$options.IMPORTTYPES.SOUNDINGRESULTS">
-            <translate>Soundingresults</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.APPROVEDGAUGEMEASUREMENTS">
-            <translate>Approved Gaugemeasurements</translate>
-          </option>
-          <option :value="$options.IMPORTTYPES.WATERWAYPROFILES">
-            <translate>Waterway Profiles</translate>
-          </option>
-        </optgroup>
-      </select>
-    </div>
+  <div class="mt-3 mb-3 mr-3 ml-3">
+    <select v-model="Import" class="custom-select" id="importtype">
+      <optgroup :label="regularLabel">
+        <option :value="$options.IMPORTTYPES.BOTTLENECK">
+          <translate>Bottlenecks</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.WATERWAYAXIS">
+          <translate>Waterway axis</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.GAUGEMEASUREMENT">
+          <translate>Gauge measurement</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.FAIRWAYAVAILABILITY">
+          <translate>Available fairway depths</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.WATERWAYAREA">
+          <translate>Waterway area</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.FAIRWAYDIMENSION">
+          <translate>Fairway dimension</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.WATERWAYGAUGES">
+          <translate>Waterway gauges</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.DISTANCEMARKSVIRTUAL">
+          <translate>Distance marks virtual</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.DISTANCEMARKSASHORE">
+          <translate>Distance marks ashore</translate>
+        </option>
+      </optgroup>
+      <optgroup :label="onetimeLabel">
+        <option :value="$options.IMPORTTYPES.SOUNDINGRESULTS">
+          <translate>Soundingresults</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.APPROVEDGAUGEMEASUREMENTS">
+          <translate>Approved Gaugemeasurements</translate>
+        </option>
+        <option :value="$options.IMPORTTYPES.WATERWAYPROFILES">
+          <translate>Waterway Profiles</translate>
+        </option>
+      </optgroup>
+    </select>
+    <ApprovedGaugeMeasurement
+      v-if="Import === $options.IMPORTTYPES.APPROVEDGAUGEMEASUREMENTS"
+    />
   </div>
 </template>
 
@@ -75,6 +76,10 @@
 // import { HTTP } from "@/lib/http";
 
 export default {
+  components: {
+    ApprovedGaugeMeasurement: () =>
+      import("./ImportApprovedGaugeMeasurement.vue")
+  },
   data() {
     return {};
   },
--- a/client/src/router.js	Mon Apr 08 15:50:38 2019 +0200
+++ b/client/src/router.js	Mon Apr 08 16:44:15 2019 +0200
@@ -113,22 +113,6 @@
       }
     },
     {
-      path: "/importapprovedgaugemeasurement",
-      name: "approvedgaugemeasurement",
-      component: () => import("./components/ImportApprovedGaugeMeasurement"),
-      meta: {
-        requiresAuth: true
-      },
-      beforeEnter: (to, from, next) => {
-        const isWaterwayAdmin = store.getters["user/isWaterwayAdmin"];
-        if (!isWaterwayAdmin) {
-          next("/login");
-        } else {
-          next();
-        }
-      }
-    },
-    {
       path: "/importschedule",
       name: "importschedule",
       component: () => import("./components/importschedule/Importschedule.vue"),
--- a/client/src/store/importschedule.js	Mon Apr 08 15:50:38 2019 +0200
+++ b/client/src/store/importschedule.js	Mon Apr 08 16:44:15 2019 +0200
@@ -91,12 +91,18 @@
   };
 };
 
+const MODES = {
+  LIST: "list",
+  EDIT: "edit"
+};
+
 // initial state
 const init = () => {
   return {
     schedules: [],
     importScheduleDetailVisible: false,
-    currentSchedule: initializeCurrentSchedule()
+    currentSchedule: initializeCurrentSchedule(),
+    mode: MODES.LIST
   };
 };
 
@@ -105,6 +111,13 @@
   namespaced: true,
   state: init(),
   mutations: {
+    setEditMode: state => {
+      state.mode = MODES.EDIT;
+    },
+    setListMode: state => {
+      state.currentSchedule = initializeCurrentSchedule();
+      state.mode = MODES.LIST;
+    },
     setImportType: (state, type) => {
       Vue.set(state.currentSchedule, "importType", type);
     },
@@ -326,5 +339,6 @@
   importschedule,
   initializeCurrentSchedule,
   IMPORTTYPES,
-  IMPORTTYPEKIND
+  IMPORTTYPEKIND,
+  MODES
 };