changeset 295:22deb76dff2c usermanagement

feat: Added vue2-toastr To show status messages.
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 31 Jul 2018 15:01:10 +0200
parents c57b0b230452
children b1116c4ce57f
files client/package.json client/src/main.js client/src/views/Users.vue client/yarn.lock
diffstat 4 files changed, 32 insertions(+), 3 deletions(-) [+]
line wrap: on
line diff
--- a/client/package.json	Tue Jul 31 13:50:47 2018 +0200
+++ b/client/package.json	Tue Jul 31 15:01:10 2018 +0200
@@ -14,6 +14,7 @@
   "dependencies": {
     "axios": "^0.18.0",
     "bootstrap": "^4.1.1",
+    "cxlt-vue2-toastr": "^1.1.0",
     "font-awesome": "^4.7.0",
     "locale2": "^2.2.0",
     "ol": "^5.0.0",
--- a/client/src/main.js	Tue Jul 31 13:50:47 2018 +0200
+++ b/client/src/main.js	Tue Jul 31 15:01:10 2018 +0200
@@ -5,9 +5,20 @@
 import GetTextPlugin from "vue-gettext";
 import translations from "./translations.json";
 import locale2 from "locale2";
+import CxltToastr from "cxlt-vue2-toastr";
 import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
 import "../node_modules/font-awesome/css/font-awesome.min.css";
 import "../node_modules/ol/ol.css";
+import "../node_modules/cxlt-vue2-toastr/dist/css/cxlt-vue2-toastr.css";
+
+var toastrConfigs = {
+  position: "bottom center",
+  showDuration: 2000,
+  timeOut: 8000,
+  closeButton: true
+};
+
+Vue.use(CxltToastr, toastrConfigs);
 
 let browserLanguage = locale2;
 
@@ -33,8 +44,10 @@
 
 Vue.config.productionTip = false;
 
-new Vue({
+const app = new Vue({
   router,
   store,
   render: h => h(App)
 }).$mount("#app");
+
+export default app;
--- a/client/src/views/Users.vue	Tue Jul 31 13:50:47 2018 +0200
+++ b/client/src/views/Users.vue	Tue Jul 31 15:01:10 2018 +0200
@@ -67,6 +67,7 @@
 import Sidebar from "../components/Sidebar";
 import store from "../store";
 import { mapGetters } from "vuex";
+import app from "../main";
 
 export default {
   name: "userview",
@@ -77,7 +78,15 @@
     ...mapGetters("usermanagement", ["users"])
   },
   beforeRouteEnter(to, from, next) {
-    store.dispatch("usermanagement/loadUsers").then(next);
+    store
+      .dispatch("usermanagement/loadUsers")
+      .then(next)
+      .catch(() => {
+        app.$toast.error({
+          title: "Error",
+          message: "Backend Error"
+        });
+      });
   }
 };
 </script>
--- a/client/yarn.lock	Tue Jul 31 13:50:47 2018 +0200
+++ b/client/yarn.lock	Tue Jul 31 15:01:10 2018 +0200
@@ -2709,6 +2709,12 @@
   dependencies:
     array-find-index "^1.0.1"
 
+cxlt-vue2-toastr@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/cxlt-vue2-toastr/-/cxlt-vue2-toastr-1.1.0.tgz#b2cddab6b436f86a9ac3b1d6edcaa7f2cbf5597c"
+  dependencies:
+    vue "^2.2.2"
+
 cyclist@~0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-0.2.2.tgz#1b33792e11e914a2fd6d6ed6447464444e5fa640"
@@ -9004,7 +9010,7 @@
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.6.0.tgz#dc42697133302ce3017524356a6c61b7b69b4a18"
 
-vue@^2.5.16:
+vue@^2.2.2, vue@^2.5.16:
   version "2.5.16"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.5.16.tgz#07edb75e8412aaeed871ebafa99f4672584a0085"