Mercurial > gemma
diff client/src/components/importschedule/Importschedule.vue @ 1725:b24a54c684bd
importschedule: UI improvements
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 09 Jan 2019 11:39:39 +0100 |
parents | 79a18eb1672b |
children | 647195199dc8 |
line wrap: on
line diff
--- a/client/src/components/importschedule/Importschedule.vue Wed Jan 09 10:18:35 2019 +0100 +++ b/client/src/components/importschedule/Importschedule.vue Wed Jan 09 11:39:39 2019 +0100 @@ -11,7 +11,7 @@ </h6> <div class="card-body schedulecardbody"> <div class="card-body schedulecardbody"> - <div class="searchandfilter w-50 d-flex flex-row"> + <div class="searchandfilter mb-3 w-50 d-flex flex-row"> <div class="searchgroup input-group"> <div class="input-group-prepend"> <span class="input-group-text" id="search"> @@ -38,15 +38,23 @@ <th><translate>Email</translate></th> <th> </th> <th> </th> + <th> </th> </tr> </thead> <tbody> - <tr v-for="(schedule, index) in schedules" :key="index"> - <td></td> + <tr v-for="schedule in schedules" :key="schedule.id"> + <td>{{ schedule.id }}</td> + <td>{{ schedule.kind }}</td> + <td>{{ schedule.user }}</td> <td></td> - <td></td> - <td></td> - <td></td> + <td> + <font-awesome-icon + v-if="schedule['send-email']" + class="fa-fw mr-2" + fixed-width + icon="check" + ></font-awesome-icon> + </td> <td> <font-awesome-icon icon="pencil-alt" @@ -55,11 +63,19 @@ </td> <td> <font-awesome-icon - @click="deleteSchedule" + @click="deleteSchedule(schedule.id)" icon="trash" fixed-width ></font-awesome-icon> </td> + <td> + <font-awesome-icon + @click="triggerManualImport(schedule.id)" + class="fa-fw mr-2" + fixed-width + icon="play" + ></font-awesome-icon> + </td> </tr> </tbody> </table> @@ -96,7 +112,8 @@ */ import { mapState } from "vuex"; -import { displayError } from "@/lib/errors.js"; +import { HTTP } from "@/lib/http"; +import { displayInfo, displayError } from "@/lib/errors.js"; export default { name: "importschedule", @@ -113,11 +130,30 @@ this.getSchedules(); }, methods: { + triggerManualImport(id) { + HTTP.get("/imports/config/" + id, { + headers: { "X-Gemma-Auth": localStorage.getItem("token") } + }) + .then(response => { + const { id } = response.data; + displayInfo({ + title: this.$gettext("Not Implemented"), + 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("imports/loadSchedules").catch(error => { const { status, data } = error.response; displayError({ - title: this.gettext("Backend Error"), + title: this.$gettext("Backend Error"), message: `${status}: ${data.message || data}` }); }); @@ -126,7 +162,13 @@ this.$store.commit("imports/setImportScheduleDetailVisible"); }, deleteSchedule(index) { - this.$store.commit("imports/deleteSchedule", index); + this.$store.dispatch("imports/deleteSchedule", index).catch(error => { + const { status, data } = error.response; + displayError({ + title: this.$gettext("Backend Error"), + message: `${status}: ${data.message || data}` + }); + }); } }, computed: { @@ -146,6 +188,10 @@ </script> <style lang="scss" scoped> +th { + border-top: 0px; +} + .schedulecard { margin-right: $offset; min-height: 20rem;