Mercurial > gemma
view client/src/components/importconfiguration/Import.vue @ 3668:3eb19b38446e
client: avoid requesting number of pending imports after logging out
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 17 Jun 2019 11:08:03 +0200 |
parents | c220ad7e61ed |
children | a3d1fce63c9e |
line wrap: on
line source
<template> <div> <UIBoxHeader icon="clock" :title="title" :closeCallback="$parent.close" /> <div v-if="mode === $options.MODES.LIST"> <UISpinnerOverlay v-if="loading" /> <UITableHeader :columns="[ { id: 'id', title: `${idLabel}`, class: 'col-1' }, { id: 'kind', title: `${typeLabel}`, class: 'col-1' }, { id: 'user', title: `${ownerLabel}`, class: 'col-2' }, { id: 'country', title: `${countryLabel}`, class: 'col-1' }, { id: 'config.cron', title: `${scheduleLabel}`, class: 'col-2' }, { id: 'config.send-email', title: `${emailLabel}`, class: 'col-2' } ]" /> <UITableBody :data="filteredSchedules | sortTable(sortColumn, sortDirection)" :isActive="item => currentSchedule && item.id === currentSchedule.id" > <template v-slot:row="{ item: schedule }"> <div class="table-cell py-1 col-1">{{ schedule.id }}</div> <div class="table-cell py-1 col-1"> {{ schedule.kind.toUpperCase() }} </div> <div style="width:115px;" class="table-cell py-1"> {{ schedule.user }} </div> <div style="width:55px;" class="table-cell py-1"> {{ userCountries[schedule.user] }} </div> <div class="table-cell py-1 col-2">{{ schedule.config.cron }}</div> <div class="table-cell py-1 col-2"> <font-awesome-icon v-if="schedule.config['send-email']" class="fa-fw mr-2" fixed-width icon="check" /> </div> <div class="table-cell py-1 col justify-content-end"> <button @click="triggerManualImport(schedule.id)" class="btn btn-xs btn-dark mr-1" :disabled="importScheduleDetailVisible" > <font-awesome-icon icon="play" fixed-width /> </button> <button @click="editSchedule(schedule.id)" class="btn btn-xs btn-dark mr-1" :disabled="importScheduleDetailVisible" > <font-awesome-icon icon="pencil-alt" fixed-width /> </button> <button @click="deleteSchedule(schedule)" class="btn btn-xs btn-dark" :disabled="importScheduleDetailVisible" > <font-awesome-icon icon="trash" fixed-width /> </button> </div> </template> </UITableBody> </div> <ImportDetails v-if="mode === $options.MODES.EDIT"></ImportDetails> <div class="text-right border-top p-2" v-if="mode === $options.MODES.LIST && !isOnetime" > <button :key="3" @click="newConfiguration()" class="btn btn-sm btn-info"> <translate>New import</translate> </button> </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> * Markus Kottländer <markus.kottlaender@intevation.de> */ import { mapState, mapGetters } from "vuex"; import { displayInfo, displayError } from "@/lib/errors"; import { HTTP } from "@/lib/http"; import { IMPORTTYPES, MODES // IMPORTTYPEKIND, // initializeCurrentSchedule } from "@/store/importschedule"; import { sortTable } from "@/lib/mixins"; export default { mixins: [sortTable], components: { ImportDetails: () => import("./ImportDetails") }, data() { return { loading: false, sortColumn: "", sortDirection: "" }; }, methods: { back() { this.$store.commit("importschedule/setListMode"); }, newConfiguration() { this.$store.commit("importschedule/setEditMode"); }, getSchedules() { this.loading = true; this.$store .dispatch("importschedule/loadSchedules") .catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }) .finally(() => { this.loading = false; }); }, editSchedule(id) { this.$store .dispatch("importschedule/loadSchedule", id) .then(() => { this.$store.commit("importschedule/setEditMode"); }) .catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); }, triggerManualImport(id) { HTTP.get("/imports/config/" + id + "/run", { headers: { "X-Gemma-Auth": localStorage.getItem("token") } }) .then(response => { const { id } = response.data; displayInfo({ title: this.$gettext("Imports"), message: this.$gettext("Manually triggered import: #") + id }); }) .catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); }, deleteSchedule(schedule) { console.log(schedule); this.$store.commit("application/popup", { icon: "trash", title: this.$gettext("Delete Import"), content: this.$gettext("Do you really want to delete the import with ID") + `<b>${schedule.id}</b>` + this.$gettext("of type") + `<b>${schedule.kind.toUpperCase()}</b>?`, confirm: { label: this.$gettext("Delete"), icon: "trash", callback: () => { this.$store .dispatch("importschedule/deleteSchedule", schedule.id) .then(() => { this.getSchedules(); displayInfo({ title: this.$gettext("Imports"), message: this.$gettext("Deleted import: #") + schedule.id }); }) .catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); } }, cancel: { label: this.$gettext("Cancel"), icon: "times" } }); } }, computed: { ...mapState("application", ["searchQuery"]), ...mapState("importschedule", [ "mode", "schedules", "currentSchedule", "importScheduleDetailVisible" ]), ...mapGetters("usermanagement", ["userCountries"]), countryLabel() { return this.$gettext("Country"); }, isOnetime() { for (let kind of [ this.$options.IMPORTTYPES.SOUNDINGRESULTS, this.$options.IMPORTTYPES.APPROVEDGAUGEMEASUREMENTS, this.$options.IMPORTTYPES.WATERWAYPROFILES ]) { if (kind === this.currentSchedule.importType) return true; } return false; }, title() { return this.$gettext("Imports"); }, filteredSchedules() { return this.schedules.filter(s => { return (s.id + s.kind) .toLowerCase() .includes(this.searchQuery.toLowerCase()); }); }, importScheduleLabel() { return this.$gettext("Import Schedule"); }, idLabel() { return this.$gettext("ID"); }, typeLabel() { return this.$gettext("Type"); }, ownerLabel() { return this.$gettext("Owner"); }, scheduleLabel() { return this.$gettext("Schedule"); }, emailLabel() { return this.$gettext("Email"); } }, mounted() { this.$store .dispatch("usermanagement/loadUsers") .then(() => { this.$store.commit("importschedule/setListMode"); this.$store.commit("importschedule/clearCurrentSchedule"); this.getSchedules(); }) .catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); }, IMPORTTYPES: IMPORTTYPES, MODES: MODES }; </script>