changeset 4867:5555b77b8c4e

report backenderror due to failing OL loaders
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 17 Dec 2019 14:27:44 +0100
parents 9df7794ec969
children 008bc1ae8897
files client/src/components/App.vue client/src/components/map/layers.js client/src/lib/http.js client/src/store/application.js
diffstat 4 files changed, 74 insertions(+), 16 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/App.vue	Fri Dec 13 12:39:08 2019 +0100
+++ b/client/src/components/App.vue	Tue Dec 17 14:27:44 2019 +0100
@@ -78,12 +78,17 @@
  * Markus Kottländer <markus.kottlaender@intevation.de>
  */
 import { mapState } from "vuex";
+import { displayError } from "@/lib/errors";
 
 export default {
   name: "app",
   computed: {
     ...mapState("user", ["isAuthenticated"]),
-    ...mapState("application", ["contextBoxContent", "showSearchbar"]),
+    ...mapState("application", [
+      "contextBoxContent",
+      "showSearchbar",
+      "backendError"
+    ]),
     isMapVisible() {
       return /importconfiguration|importoverview|stretches|sections|review|bottlenecks|mainview/.test(
         this.$route.name
@@ -113,6 +118,26 @@
       import("./fairway/AvailableFairwayDepthDialogue.vue"),
     MapPopup: () => import("./map/MapPopup"),
     KeyboardHandler: () => import("./KeyboardHandler")
+  },
+  watch: {
+    backendError() {
+      if (this.backendError) {
+        displayError({
+          title: this.$gettext("Backend Error"),
+          message: this.$gettext(
+            "The Map information may be corrupted due to a backend error. Please contact your system operator"
+          ),
+          options: {
+            timeout: 0,
+            showProgressBar: false,
+            closeOnClick: true,
+            pauseOnHover: true,
+            oneAtTime: true,
+            bodyMaxLength: 1024
+          }
+        });
+      }
+    }
   }
 };
 </script>
--- a/client/src/components/map/layers.js	Fri Dec 13 12:39:08 2019 +0100
+++ b/client/src/components/map/layers.js	Tue Dec 17 14:27:44 2019 +0100
@@ -58,6 +58,7 @@
       })
       .catch(() => {
         vectorSource.removeLoadedExtent(extent);
+        store.dispatch("application/reportBackendError");
       });
   };
 };
@@ -352,9 +353,13 @@
                   "X-Gemma-Auth": localStorage.getItem("token")
                 },
                 responseType: "blob"
-              }).then(response => {
-                tile.getImage().src = URL.createObjectURL(response.data);
-              });
+              })
+                .then(response => {
+                  tile.getImage().src = URL.createObjectURL(response.data);
+                })
+                .catch(() => {
+                  store.dispatch("application/reportBackendError");
+                });
             } // TODO  tile.setState(TileState.ERROR);
           })
         }),
@@ -378,9 +383,13 @@
                   "X-Gemma-Auth": localStorage.getItem("token")
                 },
                 responseType: "blob"
-              }).then(response => {
-                tile.getImage().src = URL.createObjectURL(response.data);
-              });
+              })
+                .then(response => {
+                  tile.getImage().src = URL.createObjectURL(response.data);
+                })
+                .catch(() => {
+                  store.dispatch("application/reportBackendError");
+                });
             } // TODO  tile.setState(TileState.ERROR);
           })
         }),
@@ -474,9 +483,13 @@
                   "X-Gemma-Auth": localStorage.getItem("token")
                 },
                 responseType: "blob"
-              }).then(response => {
-                tile.getImage().src = URL.createObjectURL(response.data);
-              });
+              })
+                .then(response => {
+                  tile.getImage().src = URL.createObjectURL(response.data);
+                })
+                .catch(() => {
+                  store.dispatch("application/reportBackendError");
+                });
             } // TODO  tile.setState(TileState.ERROR);
           })
         }),
@@ -601,9 +614,13 @@
                   "X-Gemma-Auth": localStorage.getItem("token")
                 },
                 responseType: "blob"
-              }).then(response => {
-                tile.getImage().src = URL.createObjectURL(response.data);
-              });
+              })
+                .then(response => {
+                  tile.getImage().src = URL.createObjectURL(response.data);
+                })
+                .catch(() => {
+                  store.dispatch("application/reportBackendError");
+                });
             } // TODO  tile.setState(TileState.ERROR);
           })
         }),
--- a/client/src/lib/http.js	Fri Dec 13 12:39:08 2019 +0100
+++ b/client/src/lib/http.js	Tue Dec 17 14:27:44 2019 +0100
@@ -28,9 +28,11 @@
 HTTP.interceptors.response.use(
   response => response,
   error => {
-    const { status } = error.response;
-    if (status === UNAUTHORIZED) {
-      logOff();
+    if (error.response) {
+      const { status } = error.response;
+      if (status === UNAUTHORIZED) {
+        logOff();
+      }
     }
     return Promise.reject(error);
   }
--- a/client/src/store/application.js	Fri Dec 13 12:39:08 2019 +0100
+++ b/client/src/store/application.js	Tue Dec 17 14:27:44 2019 +0100
@@ -26,6 +26,7 @@
     secondaryLogo: process.env.VUE_APP_SECONDARY_LOGO_URL,
     logoForPDF: process.env.VUE_APP_LOGO_FOR_PDF_URL,
     popup: null,
+    backendError: false,
     paneSetup: "DEFAULT",
     paneRotate: 1,
     showSidebar: false,
@@ -139,9 +140,22 @@
     },
     config: (state, config) => {
       state.config = config;
+    },
+    setBackendErrorFlag: state => {
+      state.backendError = true;
+    },
+    removeBackendErrorFlag: state => {
+      state.backendError = false;
     }
   },
   actions: {
+    reportBackendError({ commit }) {
+      const TWOMINUTES = 2 * 60 * 1000;
+      commit("setBackendErrorFlag");
+      setTimeout(() => {
+        commit("removeBackendErrorFlag");
+      }, TWOMINUTES);
+    },
     loadConfig({ commit }) {
       return HTTP.get("/system/settings", {
         headers: { "X-Gemma-Auth": localStorage.getItem("token") }