Mercurial > gemma

changeset 2753:2aa1620ffd9e

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
search: in context of importoverview pressing enter triggers a request for and updated dataset
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 21 Mar 2019 13:03:27 +0100
parents 018f979f9e23
children d0f6c222f4f9
files client/src/components/Search.vue client/src/components/importoverview/ImportOverview.vue client/src/store/imports.js
diffstat 3 files changed, 85 insertions(+), 31 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/Search.vue	Thu Mar 21 12:53:39 2019 +0100
+++ b/client/src/components/Search.vue	Thu Mar 21 13:03:27 2019 +0100
@@ -19,7 +19,7 @@
       ]"
     >
       <input
-        @keyup.enter="takeFirstSearchresult"
+        @keyup.enter="triggerEnter"
         id="search"
         v-model="searchQuery"
         type="text"
@@ -156,10 +156,11 @@
  * Markus Kottländer <markus.kottlaender@intevation.de>
  */
 import debounce from "lodash.debounce";
-import { mapState } from "vuex";
+import { mapState, mapGetters } from "vuex";
 
 import { displayError } from "@/lib/errors.js";
 import { HTTP } from "@/lib/http";
+import { format } from "date-fns";
 
 const setFocus = () => document.querySelector("#search").focus();
 
@@ -178,6 +179,8 @@
       "showContextBox",
       "contextBoxContent"
     ]),
+    ...mapState("imports", ["startDate", "endDate"]),
+    ...mapGetters("imports", ["filters"]),
     searchQuery: {
       get() {
         return this.$store.state.application.searchQuery;
@@ -230,7 +233,27 @@
     }
   },
   methods: {
-    takeFirstSearchresult() {
+    loadLogs() {
+      this.$store
+        .dispatch("imports/getImports", {
+          filter: this.filters,
+          from: format(this.startDate, "YYYY-MM-DDTHH:mm:ss.SSS"),
+          to: format(this.endDate, "YYYY-MM-DDTHH:mm:ss.SSS"),
+          query: this.searchQuery
+        })
+        .then(() => {})
+        .catch(error => {
+          const { status, data } = error.response;
+          displayError({
+            title: this.$gettext("Backend Error"),
+            message: `${status}: ${data.message || data}`
+          });
+        });
+    },
+    triggerEnter() {
+      if (this.showContextBox && this.contextBoxContent === "importoverview") {
+        this.loadLogs();
+      }
       if (!this.searchResults || this.searchResults.length != 1) return;
       this.moveToSearchResult(this.searchResults[0]);
     },
--- a/client/src/components/importoverview/ImportOverview.vue	Thu Mar 21 12:53:39 2019 +0100
+++ b/client/src/components/importoverview/ImportOverview.vue	Thu Mar 21 13:03:27 2019 +0100
@@ -150,8 +150,6 @@
   data() {
     return {
       loading: false,
-      startDate: startOfHour(new Date()),
-      endDate: new Date(),
       selectedInterval: this.$options.LAST_HOUR,
       laterPossible: false
     };
@@ -162,7 +160,7 @@
   LAST_30_DAYS: "lastthirtydays",
   computed: {
     ...mapState("application", ["searchQuery"]),
-    ...mapState("imports", ["imports", "reviewed"]),
+    ...mapState("imports", ["imports", "reviewed", "startDate", "endDate"]),
     ...mapGetters("imports", ["filters"]),
     interval() {
       return [this.startDate, this.endDate];
@@ -172,23 +170,41 @@
     earlier() {
       switch (this.selectedInterval) {
         case this.$options.LAST_HOUR:
-          this.startDate = subHours(startOfHour(this.startDate), 1);
-          this.endDate = endOfHour(this.startDate);
+          this.$store.commit(
+            "imports/setStartDate",
+            subHours(startOfHour(this.startDate), 1)
+          );
+          this.$store.commit("imports/setEndDate", endOfHour(this.startDate));
           this.laterPossible = true;
           break;
         case this.$options.TODAY:
-          this.startDate = subDays(startOfDay(this.startDate), 1);
-          this.endDate = endOfDay(this.startDate);
+          this.$store.commit(
+            "imports/setStartDate",
+            subDays(startOfDay(this.startDate), 1)
+          );
+          this.$store.commit("imports/setEndDate", endOfDay(this.startDate));
           this.laterPossible = true;
           break;
         case this.$options.LAST_7_DAYS:
-          this.startDate = subDays(startOfDay(this.startDate), 7);
-          this.endDate = endOfDay(addDays(this.startDate, 7));
+          this.$store.commit(
+            "imports/setStartDate",
+            subDays(startOfDay(this.startDate), 7)
+          );
+          this.$store.commit(
+            "imports/setEndDate",
+            endOfDay(addDays(this.startDate, 7))
+          );
           this.laterPossible = true;
           break;
         case this.$options.LAST_30_DAYS:
-          this.startDate = subDays(startOfDay(this.startDate), 30);
-          this.endDate = endOfDay(addDays(this.startDate, 30));
+          this.$store.commit(
+            "imports/setStartDate",
+            subDays(startOfDay(this.startDate), 30)
+          );
+          this.$store.commit(
+            "imports/setEndDate",
+            endOfDay(addDays(this.startDate, 30))
+          );
           this.laterPossible = true;
           break;
       }
@@ -205,8 +221,8 @@
           if (isFuture(subHours(end, 1))) {
             return;
           }
-          this.startDate = start;
-          this.endDate = isFuture(end) ? now : end;
+          this.$store.commit("imports/setStartDate", start);
+          this.$store.commit("imports/setEndDate", isFuture(end) ? now : end);
           break;
         case this.$options.TODAY:
           start = addDays(startOfDay(this.startDate), 1);
@@ -215,8 +231,8 @@
           if (isFuture(subDays(end, 1))) {
             return;
           }
-          this.startDate = start;
-          this.endDate = isFuture(end) ? now : end;
+          this.$store.commit("imports/setStartDate", start);
+          this.$store.commit("imports/setEndDate", isFuture(end) ? now : end);
           break;
         case this.$options.LAST_7_DAYS:
           start = addDays(startOfDay(this.startDate), 7);
@@ -225,16 +241,16 @@
           if (isFuture(subDays(end, 7))) {
             return;
           }
-          this.startDate = start;
-          this.endDate = isFuture(end) ? now : end;
+          this.$store.commit("imports/setStartDate", start);
+          this.$store.commit("imports/setEndDate", isFuture(end) ? now : end);
           break;
         case this.$options.LAST_30_DAYS:
           start = addDays(startOfDay(this.startDate), 30);
           end = endOfDay(addDays(start, 30));
           this.laterPossible = !isFuture(end);
           if (isFuture(subDays(end, 7))) return;
-          this.startDate = start;
-          this.endDate = isFuture(end) ? now : end;
+          this.$store.commit("imports/setStartDate", start);
+          this.$store.commit("imports/setEndDate", isFuture(end) ? now : end);
           break;
       }
       this.loadLogs();
@@ -334,20 +350,26 @@
       const now = new Date();
       switch (this.selectedInterval) {
         case this.$options.LAST_HOUR:
-          this.startDate = subHours(now, 1);
-          this.endDate = now;
+          this.$store.commit("imports/setStartDate", startOfHour(now));
+          this.$store.commit("imports/setEndDate", now);
           break;
         case this.$options.TODAY:
-          this.startDate = startOfDay(now);
-          this.endDate = now;
+          this.$store.commit("imports/setStartDate", startOfDay(now));
+          this.$store.commit("imports/setEndDate", now);
           break;
         case this.$options.LAST_7_DAYS:
-          this.startDate = subDays(startOfDay(now), 7);
-          this.endDate = now;
+          this.$store.commit(
+            "imports/setStartDate",
+            subDays(startOfDay(now), 7)
+          );
+          this.$store.commit("imports/setEndDate", now);
           break;
         case this.$options.LAST_30_DAYS:
-          this.startDate = subDays(startOfDay(now), 30);
-          this.endDate = now;
+          this.$store.commit(
+            "imports/setStartDate",
+            subDays(startOfDay(now), 30)
+          );
+          this.$store.commit("imports/setEndDate", now);
           break;
       }
       this.loadLogs();
--- a/client/src/store/imports.js	Thu Mar 21 12:53:39 2019 +0100
+++ b/client/src/store/imports.js	Thu Mar 21 13:03:27 2019 +0100
@@ -15,6 +15,7 @@
 import { HTTP } from "@/lib/http";
 import { WFS } from "ol/format.js";
 import { equalTo as equalToFilter } from "ol/format/filter.js";
+import { startOfHour } from "date-fns";
 
 /* eslint-disable no-unused-vars */
 /* eslint-disable no-unreachable */
@@ -40,7 +41,9 @@
     show: NODETAILS,
     showAdditional: NODETAILS,
     showLogs: NODETAILS,
-    details: []
+    details: [],
+    startDate: startOfHour(new Date()),
+    endDate: new Date()
   };
 };
 
@@ -94,6 +97,12 @@
     }
   },
   mutations: {
+    setStartDate: (state, start) => {
+      state.startDate = start;
+    },
+    setEndDate: (state, end) => {
+      state.endDate = end;
+    },
     setCurrentDetails: (state, details) => {
       state.details = details;
     },