Mercurial > gemma
view client/src/components/importoverview/ImportOverview.vue @ 2403:a4f36c481f4b staging_consolidation
wip
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 27 Feb 2019 16:21:45 +0100 |
parents | |
children | 77baf4f0ee1e |
line wrap: on
line source
<template> <div> <UIBoxHeader icon="clipboard-check" title="Staging Area" :closeCallback="$parent.close" /> <div class="d-flex flex-row w-100 justify-content-end"> <button class="btn btn-dark align-self-start" @click="refresh"> <translate>Refresh</translate> </button> </div> <div class="d-flex flex-row w-100 border-bottom"> <font-awesome-icon class="pointer" @click="toggleStaging()" v-if="stagingVisible" icon="angle-up" fixed-width ></font-awesome-icon> <font-awesome-icon class="pointer" @click="toggleStaging()" v-if="!stagingVisible" icon="angle-down" fixed-width ></font-awesome-icon> <Staging v-if="stagingVisible"></Staging> <div v-else><h5>Staging</h5></div> </div> <div class="d-flex flex-row"> <font-awesome-icon class="pointer" @click="toggleLogs()" v-if="logsVisible" icon="angle-up" fixed-width ></font-awesome-icon> <font-awesome-icon class="pointer" @click="toggleLogs()" v-if="!logsVisible" icon="angle-down" fixed-width ></font-awesome-icon> <Logs v-if="logsVisible"></Logs> <div v-else><h5>Logs</h5></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> */ import { displayError } from "@/lib/errors.js"; import { mapState } from "vuex"; export default { name: "importoverview", components: { Staging: () => import("./staging/Staging.vue"), Logs: () => import("./logs/Logs.vue") }, computed: { ...mapState("imports", ["stagingVisible", "logsVisible"]) }, methods: { toggleStaging() { this.$store.commit("imports/setStagingVisibility", !this.stagingVisible); }, toggleLogs() { this.$store.commit("imports/setLogsVisibility", !this.logsVisible); }, refresh() { this.loadImportQueue(); this.loadLogs(); }, loadImportQueue() { this.$store .dispatch("imports/getImports") .then(() => {}) .catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); }, loadLogs() { this.$store.dispatch("imports/getStaging").catch(error => { const { status, data } = error.response; displayError({ title: "Backend Error", message: `${status}: ${data.message || data}` }); }); } }, mounted() { this.refresh(); } }; </script> <style></style>