Mercurial > gemma
view client/src/components/importschedule/Importschedule.vue @ 2717:5b990f612420
import_review: rename overview to review. More space for logs
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Tue, 19 Mar 2019 10:00:34 +0100 |
parents | 4bcb26542767 |
children | add2d47c2567 |
line wrap: on
line source
<template> <div class="d-flex flex-row"> <Spacer></Spacer> <div class="mt-2 w-100"> <div class="card flex-grow-1 schedulecard shadow-xs"> <UIBoxHeader icon="clock" title="Import Schedule" /> <div class="searchandfilter p-3 w-50 mx-auto"> <div class="searchgroup input-group"> <div class="input-group-prepend"> <span class="input-group-text" id="search"> <font-awesome-icon icon="search"></font-awesome-icon> </span> </div> <input v-model="searchQuery" type="text" class="form-control" placeholder aria-label="Search" aria-describedby="search" /> </div> </div> <UITableHeader :columns="[ { id: 'id', title: 'ID', class: 'col-1' }, { id: 'type', title: 'Type', class: 'col-2' }, { id: 'author', title: 'Author', class: 'col-2' }, { id: 'schedule', title: 'Schedule', class: 'col-2' }, { id: 'email', title: 'Email', class: 'col-2' } ]" :sortable="false" /> <UITableBody :data="schedules" v-slot="{ item: schedule }"> <div class="py-1 col-1">{{ schedule.id }}</div> <div class="py-1 col-2">{{ schedule.kind.toUpperCase() }}</div> <div class="py-1 col-2">{{ schedule.user }}</div> <div class="py-1 col-2">{{ schedule.config.cron }}</div> <div class="py-1 col-2 text-center"> <font-awesome-icon v-if="schedule.config['send-email']" class="fa-fw mr-2" fixed-width icon="check" ></font-awesome-icon> </div> <div class="py-1 col text-right"> <button @click="editSchedule(schedule.id)" class="btn btn-xs btn-dark mr-1" :disabled="importScheduleDetailVisible" > <font-awesome-icon icon="pencil-alt" fixed-width ></font-awesome-icon> </button> <button @click="deleteSchedule(schedule)" class="btn btn-xs btn-dark mr-1" :disabled="importScheduleDetailVisible" > <font-awesome-icon icon="trash" fixed-width></font-awesome-icon> </button> <button @click="triggerManualImport(schedule.id)" class="btn btn-xs btn-dark" :disabled="importScheduleDetailVisible" > <font-awesome-icon icon="play" fixed-width></font-awesome-icon> </button> </div> </UITableBody> <div class="p-3 text-right"> <button :disabled="importScheduleDetailVisible" @click="newImport" class="btn btn-info newbutton" > <translate>New Import</translate> </button> </div> </div> </div> <Importscheduledetail></Importscheduledetail> </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 } from "vuex"; import { HTTP } from "@/lib/http"; import { displayInfo, displayError } from "@/lib/errors.js"; export default { name: "importschedule", components: { Importscheduledetail: () => import("./Importscheduledetail"), Spacer: () => import("@/components/Spacer") }, data() { return { searchQuery: "" }; }, mounted() { this.getSchedules(); }, methods: { editSchedule(id) { this.$store .dispatch("importschedule/loadSchedule", id) .then(() => { this.$store.commit("importschedule/setImportScheduleDetailVisible"); }) .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}` }); }); }, getSchedules() { this.$store.dispatch("importschedule/loadSchedules").catch(error => { const { status, data } = error.response; displayError({ title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); }, newImport() { this.$store.commit("importschedule/setImportScheduleDetailVisible"); }, 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", ["showSidebar"]), ...mapState("importschedule", ["schedules", "importScheduleDetailVisible"]), spacerStyle() { return [ "spacer ml-3", { "spacer-expanded": this.showSidebar, "spacer-collapsed": !this.showSidebar } ]; } } }; </script> <style lang="scss" scoped> th { border-top: 0px; } .card-body { padding-bottom: $small-offset; } .schedulecard { margin-right: $small-offset; min-height: 20rem; } .schedulecard-body { width: 100%; margin-left: auto; margin-right: auto; } </style>