Mercurial > gemma

changeset 2280:e9112939581e

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Merged.
author Sascha L. Teichmann <sascha.teichmann@intevation.de>
date Fri, 15 Feb 2019 11:18:19 +0100
parents 7f3bc4c39956 (current diff) 5f3110aa1ad1 (diff)
children 6689b7e1f28b
files
diffstat 5 files changed, 178 insertions(+), 124 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/Pdftool.vue	Thu Feb 14 17:39:29 2019 +0100
+++ b/client/src/components/Pdftool.vue	Fri Feb 15 11:18:19 2019 +0100
@@ -59,18 +59,23 @@
         </div>
         <button
           @click="download"
+          :key="'downloadBtn'"
           type="button"
-          :disabled="!readyToGenerate"
+          v-if="readyToGenerate"
           class="btn btn-sm btn-info d-block w-100 mt-2"
         >
-          <font-awesome-icon
-            v-if="!readyToGenerate"
-            class="mr-1"
-            icon="spinner"
-            spin
-          />
           <translate>Generate PDF</translate>
         </button>
+        <button
+          @click="cancel"
+          :key="'cancelBtn'"
+          type="button"
+          v-else
+          class="btn btn-sm btn-danger d-block w-100 mt-2"
+        >
+          <font-awesome-icon class="mr-1" icon="spinner" spin />
+          <translate>Cancel</translate>
+        </button>
       </div>
     </div>
   </div>
@@ -155,7 +160,10 @@
         height: null
       },
       logoImageForPDF: null, // a HTMLImageElement instance
-      readyToGenerate: true // if the user is allowed to press the button
+      readyToGenerate: true, // if the user is allowed to press the button
+      rendercompleteListener: null,
+      mapSize: null,
+      mapExtent: null
     };
   },
   computed: {
@@ -231,15 +239,15 @@
       // Step 2 which starts rendering a map with the necessary image size
 
       var map = this.openLayersMap;
-      var mapSize = map.getSize(); // size in pixels of the map in the DOM
+      this.mapSize = map.getSize(); // size in pixels of the map in the DOM
       // Calculate the extent for the current view state and the passed size.
       // The size is the pixel dimensions of the box into which the calculated
       // extent should fit.
-      var mapExtent = map.getView().calculateExtent(mapSize);
+      this.mapExtent = map.getView().calculateExtent(this.mapSize);
 
       this.pdf.doc = new jsPDF(this.form.format, "mm", this.form.paperSize);
       // set a callback for after the next complete rendering of the map
-      map.once("rendercomplete", event => {
+      this.rendercompleteListener = map.once("rendercomplete", event => {
         let canvas = event.context.canvas;
 
         // because we are using Web Mercator, a pixel represents
@@ -368,8 +376,8 @@
         }
 
         // reset to original size
-        map.setSize(mapSize);
-        map.getView().fit(mapExtent, { size: mapSize });
+        map.setSize(this.mapSize);
+        map.getView().fit(this.mapExtent, { size: this.mapSize });
 
         // as we are done: re-enable button
         this.readyToGenerate = true;
@@ -377,7 +385,16 @@
 
       // trigger rendering
       map.setSize(mapSizeForPrint);
-      map.getView().fit(mapExtent, { size: mapSizeForPrint });
+      map.getView().fit(this.mapExtent, { size: mapSizeForPrint });
+    },
+    cancel() {
+      this.openLayersMap.un(
+        this.rendercompleteListener.type,
+        this.rendercompleteListener.listener
+      );
+      this.openLayersMap.setSize(this.mapSize);
+      this.openLayersMap.getView().fit(this.mapExtent, { size: this.mapSize });
+      this.readyToGenerate = true;
     },
     addRoundedBox(x, y, w, h, color, rounding) {
       // draws a rounded background box at (x,y) width x height
--- a/client/src/components/Sidebar.vue	Thu Feb 14 17:39:29 2019 +0100
+++ b/client/src/components/Sidebar.vue	Fri Feb 15 11:18:19 2019 +0100
@@ -110,6 +110,8 @@
           ></font-awesome-icon>
           <span class="fix-trans-space" v-translate>Users</span>
         </router-link>
+      </div>
+      <div v-if="isWaterwayAdmin">
         <router-link to="systemconfiguration">
           <font-awesome-icon
             class="fa-fw mr-2"
@@ -118,6 +120,8 @@
           ></font-awesome-icon>
           <span class="fix-trans-space" v-translate>Configuration</span>
         </router-link>
+      </div>
+      <div v-if="isSysAdmin">
         <router-link to="logs">
           <font-awesome-icon
             class="fa-fw mr-2"
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/client/src/components/systemconfiguration/ColorSettings.vue	Fri Feb 15 11:18:19 2019 +0100
@@ -0,0 +1,135 @@
+<template>
+  <div class="d-flex flex-column mt-4">
+    <div class="d-flex flex-row justify-content-between">
+      <h5><translate>Color Settings</translate></h5>
+    </div>
+    <div class="mt-1">
+      <div class="d-flex">
+        <div>
+          <h6 class="card-title">
+            <translate>Bottleneck Areas fill-color</translate>
+          </h6>
+          <chrome-picker v-model="fillColor" />
+        </div>
+        <div class="ml-4">
+          <h6 class="card-title">
+            <translate>Bottleneck Areas stroke-color</translate>
+          </h6>
+          <compact-picker v-model="strokeColor" />
+        </div>
+      </div>
+      <div class="mt-4">
+        <a @click.prevent="submit" class="btn btn-info text-white">
+          <translate>Send</translate>
+        </a>
+      </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>
+ * Bernhard Reiter <bernhard@intevation.de>
+ * Markus Kottländer <markus@intevation.de>
+ */
+import { Chrome } from "vue-color";
+import { Compact } from "vue-color";
+
+import { HTTP } from "@/lib/http";
+import { displayError } from "@/lib/errors.js";
+
+export default {
+  name: "colorsettings",
+  data() {
+    return {
+      sent: false,
+      strokeColor: { r: 0, g: 0, b: 0, a: 1.0 },
+      fillColor: { r: 0, g: 0, b: 0, a: 1.0 },
+      currentConfig: null
+    };
+  },
+  components: {
+    "chrome-picker": Chrome,
+    "compact-picker": Compact
+  },
+  methods: {
+    submit() {
+      HTTP.put("/system/style/Bottlenecks/stroke", this.strokeColor.rgba, {
+        headers: {
+          "X-Gemma-Auth": localStorage.getItem("token"),
+          "Content-type": "application/json"
+        }
+      })
+        .then()
+        .catch(error => {
+          const { status, data } = error.response;
+          displayError({
+            title: this.$gettext("Backend Error"),
+            message: `${status}: ${data.message || data}`
+          });
+        });
+
+      HTTP.put("/system/style/Bottlenecks/fill", this.fillColor.rgba, {
+        headers: {
+          "X-Gemma-Auth": localStorage.getItem("token"),
+          "Content-type": "application/json"
+        }
+      })
+        .then()
+        .catch(error => {
+          const { status, data } = error.response;
+          displayError({
+            title: this.$gettext("Backend Error"),
+            message: `${status}: ${data.message || data}`
+          });
+        });
+    }
+  },
+  mounted() {
+    HTTP.get("/system/style/Bottlenecks/stroke", {
+      headers: {
+        "X-Gemma-Auth": localStorage.getItem("token"),
+        "Content-type": "application/json"
+      }
+    })
+      .then(response => {
+        this.strokeColor = response.data.colour;
+      })
+      .catch(error => {
+        const { status, data } = error.response;
+        displayError({
+          title: this.$gettext("Backend Error"),
+          message: `${status}: ${data.message || data}`
+        });
+      });
+
+    HTTP.get("/system/style/Bottlenecks/fill", {
+      headers: {
+        "X-Gemma-Auth": localStorage.getItem("token"),
+        "Content-type": "application/json"
+      }
+    })
+      .then(response => {
+        this.fillColor = response.data.colour;
+      })
+      .catch(error => {
+        const { status, data } = error.response;
+        displayError({
+          title: this.$gettext("Backend Error"),
+          message: `${status}: ${data.message || data}`
+        });
+      });
+  }
+};
+</script>
--- a/client/src/components/systemconfiguration/Systemconfiguration.vue	Thu Feb 14 17:39:29 2019 +0100
+++ b/client/src/components/systemconfiguration/Systemconfiguration.vue	Fri Feb 15 11:18:19 2019 +0100
@@ -9,29 +9,8 @@
         <translate class="headline">Systemconfiguration</translate>
       </h6>
       <div class="card-body text-left">
-        <h5 class="border-bottom pb-3 mb-3">
-          <translate>Color settings</translate>
-        </h5>
-        <div class="d-flex">
-          <div>
-            <h6 class="card-title">
-              <translate>Bottleneck Areas fill-color</translate>
-            </h6>
-            <chrome-picker v-model="fillColor" />
-          </div>
-          <div class="ml-4">
-            <h6 class="card-title">
-              <translate>Bottleneck Areas stroke-color</translate>
-            </h6>
-            <compact-picker v-model="strokeColor" />
-          </div>
-        </div>
-        <div class="mt-4">
-          <a @click.prevent="submit" class="btn btn-info text-white">
-            <translate>Send</translate>
-          </a>
-        </div>
         <PDFTemplates />
+        <ColorSettings v-if="isSysAdmin" />
       </div>
       <!-- card-body -->
     </div>
@@ -60,100 +39,19 @@
  * Author(s):
  * Thomas Junk <thomas.junk@intevation.de>
  * Bernhard Reiter <bernhard@intevation.de>
+ * Markus Kottländer <markus@intevation.de>
  */
-import { Chrome } from "vue-color";
-import { Compact } from "vue-color";
-
-import { HTTP } from "@/lib/http";
-import { displayError } from "@/lib/errors.js";
-import { mapState } from "vuex";
+import { mapGetters } from "vuex";
 
 export default {
   name: "systemconfiguration",
-  data() {
-    return {
-      sent: false,
-      strokeColor: { r: 0, g: 0, b: 0, a: 1.0 },
-      fillColor: { r: 0, g: 0, b: 0, a: 1.0 },
-      currentConfig: null
-    };
-  },
   components: {
-    "chrome-picker": Chrome,
-    "compact-picker": Compact,
     Spacer: () => import("../Spacer"),
-    PDFTemplates: () => import("./PDFTemplates")
+    PDFTemplates: () => import("./PDFTemplates"),
+    ColorSettings: () => import("./ColorSettings")
   },
   computed: {
-    ...mapState("application", ["showSidebar"])
-  },
-  methods: {
-    submit() {
-      HTTP.put("/system/style/Bottlenecks/stroke", this.strokeColor.rgba, {
-        headers: {
-          "X-Gemma-Auth": localStorage.getItem("token"),
-          "Content-type": "application/json"
-        }
-      })
-        .then()
-        .catch(error => {
-          const { status, data } = error.response;
-          displayError({
-            title: this.$gettext("Backend Error"),
-            message: `${status}: ${data.message || data}`
-          });
-        });
-
-      HTTP.put("/system/style/Bottlenecks/fill", this.fillColor.rgba, {
-        headers: {
-          "X-Gemma-Auth": localStorage.getItem("token"),
-          "Content-type": "application/json"
-        }
-      })
-        .then()
-        .catch(error => {
-          const { status, data } = error.response;
-          displayError({
-            title: this.$gettext("Backend Error"),
-            message: `${status}: ${data.message || data}`
-          });
-        });
-    }
-  },
-  mounted() {
-    HTTP.get("/system/style/Bottlenecks/stroke", {
-      headers: {
-        "X-Gemma-Auth": localStorage.getItem("token"),
-        "Content-type": "application/json"
-      }
-    })
-      .then(response => {
-        this.strokeColor = response.data.colour;
-      })
-      .catch(error => {
-        const { status, data } = error.response;
-        displayError({
-          title: this.$gettext("Backend Error"),
-          message: `${status}: ${data.message || data}`
-        });
-      });
-
-    HTTP.get("/system/style/Bottlenecks/fill", {
-      headers: {
-        "X-Gemma-Auth": localStorage.getItem("token"),
-        "Content-type": "application/json"
-      }
-    })
-      .then(response => {
-        this.fillColor = response.data.colour;
-      })
-      .catch(error => {
-        const { status, data } = error.response;
-        displayError({
-          title: this.$gettext("Backend Error"),
-          message: `${status}: ${data.message || data}`
-        });
-      });
+    ...mapGetters("user", ["isSysAdmin"])
   }
 };
 </script>
--- a/client/src/router.js	Thu Feb 14 17:39:29 2019 +0100
+++ b/client/src/router.js	Fri Feb 15 11:18:19 2019 +0100
@@ -71,8 +71,8 @@
         requiresAuth: true
       },
       beforeEnter: (to, from, next) => {
-        const isSysadmin = store.getters["user/isSysAdmin"];
-        if (!isSysadmin) {
+        const isWaterwayAdmin = store.getters["user/isWaterwayAdmin"];
+        if (!isWaterwayAdmin) {
           next("/");
         } else {
           next();