changeset 2626:50cc5bffd787

client: importoverview2: implemented Finish Review (confirm) dialog
author Markus Kottlaender <markus@intevation.de>
date Wed, 13 Mar 2019 16:26:14 +0100
parents fd93babdf8e6
children 53807c3a2de7
files client/src/components/importoverview/ImportOverviewAlt.vue
diffstat 1 files changed, 72 insertions(+), 2 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/importoverview/ImportOverviewAlt.vue	Wed Mar 13 16:24:35 2019 +0100
+++ b/client/src/components/importoverview/ImportOverviewAlt.vue	Wed Mar 13 16:26:14 2019 +0100
@@ -12,7 +12,11 @@
           <font-awesome-icon icon="spinner" spin v-if="loading" />
           <font-awesome-icon icon="redo" v-else />
         </button>
-        <button class="btn btn-sm btn-info" :disabled="!reviewed.length">
+        <button
+          class="btn btn-sm btn-info"
+          :disabled="!reviewed.length"
+          @click="save"
+        >
           <translate>Commit</translate> {{ reviewed.length }}
         </button>
       </div>
@@ -41,8 +45,9 @@
  * Thomas Junk <thomas.junk@intevation.de>
  */
 
-import { displayError } from "@/lib/errors.js";
 import { mapState } from "vuex";
+import { displayError, displayInfo } from "@/lib/errors.js";
+import { STATES } from "@/store/imports.js";
 
 export default {
   name: "importoverviewalt",
@@ -73,6 +78,71 @@
             message: `${status}: ${data.message || data}`
           });
         });
+    },
+    save() {
+      if (!this.reviewed.length) return;
+
+      let popupContent = `<table class="table table-sm small mb-0 border-0" style="margin-top: -1px;">`;
+      this.reviewed.forEach(r => {
+        let imp = this.imports.find(i => i.id === r.id);
+        let approved = STATES.APPROVED === r.status;
+        popupContent += `<tr>
+          <td>${imp.id}</td>
+          <td>${imp.kind.toUpperCase()}</td>
+          <td>${this.$options.filters.dateTime(imp.enqueued)}</td>
+          <td class="text-${approved ? "success" : "danger"}">
+            ${this.$gettext(approved ? "approved" : "declined")}
+          </td>
+        </tr>`;
+      });
+      popupContent += "</table>";
+
+      this.$store.commit("application/popup", {
+        icon: "clipboard-check",
+        title: this.$gettext("Finish Review"),
+        padding: false,
+        big: true,
+        content: popupContent,
+        confirm: {
+          icon: "check",
+          callback: () => {
+            let data = this.reviewed.map(r => ({
+              id: r.id,
+              state: r.status
+            }));
+            this.$store
+              .dispatch("imports/confirmReview", data)
+              .then(response => {
+                this.loadLogs();
+                const messages = response.data
+                  .map(x => {
+                    if (x.message) return x.message;
+                    if (x.error) return x.error;
+                  })
+                  .join("\n\n");
+                displayInfo({
+                  title: "Staging Area",
+                  message: messages,
+                  options: {
+                    timeout: 0,
+                    buttons: [{ text: "Ok", action: null, bold: true }]
+                  }
+                });
+              })
+              .catch(error => {
+                const { status, data } = error.response;
+                displayError({
+                  title: "Backend Error",
+                  message: `${status}: ${data.message || data}`
+                });
+              });
+          }
+        },
+        cancel: {
+          label: this.$gettext("Cancel"),
+          icon: "times"
+        }
+      });
     }
   },
   watch: {