2403
|
1 <template>
|
|
2 <div>
|
|
3 <UIBoxHeader
|
|
4 icon="clipboard-check"
|
|
5 title="Staging Area"
|
|
6 :closeCallback="$parent.close"
|
|
7 />
|
|
8 <div class="d-flex flex-row w-100 justify-content-end">
|
|
9 <button class="btn btn-dark align-self-start" @click="refresh">
|
|
10 <translate>Refresh</translate>
|
|
11 </button>
|
|
12 </div>
|
|
13 <div class="d-flex flex-row w-100 border-bottom">
|
|
14 <font-awesome-icon
|
|
15 class="pointer"
|
|
16 @click="toggleStaging()"
|
|
17 v-if="stagingVisible"
|
|
18 icon="angle-up"
|
|
19 fixed-width
|
|
20 ></font-awesome-icon>
|
|
21 <font-awesome-icon
|
|
22 class="pointer"
|
|
23 @click="toggleStaging()"
|
|
24 v-if="!stagingVisible"
|
|
25 icon="angle-down"
|
|
26 fixed-width
|
|
27 ></font-awesome-icon>
|
|
28 <Staging v-if="stagingVisible"></Staging>
|
|
29 <div v-else><h5>Staging</h5></div>
|
|
30 </div>
|
|
31 <div class="d-flex flex-row">
|
|
32 <font-awesome-icon
|
|
33 class="pointer"
|
|
34 @click="toggleLogs()"
|
|
35 v-if="logsVisible"
|
|
36 icon="angle-up"
|
|
37 fixed-width
|
|
38 ></font-awesome-icon>
|
|
39 <font-awesome-icon
|
|
40 class="pointer"
|
|
41 @click="toggleLogs()"
|
|
42 v-if="!logsVisible"
|
|
43 icon="angle-down"
|
|
44 fixed-width
|
|
45 ></font-awesome-icon>
|
|
46 <Logs v-if="logsVisible"></Logs>
|
|
47 <div v-else><h5>Logs</h5></div>
|
|
48 </div>
|
|
49 </div>
|
|
50 </template>
|
|
51
|
|
52 <script>
|
|
53 /* This is Free Software under GNU Affero General Public License v >= 3.0
|
|
54 * without warranty, see README.md and license for details.
|
|
55 *
|
|
56 * SPDX-License-Identifier: AGPL-3.0-or-later
|
|
57 * License-Filename: LICENSES/AGPL-3.0.txt
|
|
58 *
|
|
59 * Copyright (C) 2018 by via donau
|
|
60 * – Österreichische Wasserstraßen-Gesellschaft mbH
|
|
61 * Software engineering by Intevation GmbH
|
|
62 *
|
|
63 * Author(s):
|
|
64 * Thomas Junk <thomas.junk@intevation.de>
|
|
65 */
|
|
66 import { displayError } from "@/lib/errors.js";
|
|
67 import { mapState } from "vuex";
|
|
68
|
|
69 export default {
|
|
70 name: "importoverview",
|
|
71 components: {
|
|
72 Staging: () => import("./staging/Staging.vue"),
|
|
73 Logs: () => import("./logs/Logs.vue")
|
|
74 },
|
|
75 computed: {
|
|
76 ...mapState("imports", ["stagingVisible", "logsVisible"])
|
|
77 },
|
|
78 methods: {
|
|
79 toggleStaging() {
|
|
80 this.$store.commit("imports/setStagingVisibility", !this.stagingVisible);
|
|
81 },
|
|
82 toggleLogs() {
|
|
83 this.$store.commit("imports/setLogsVisibility", !this.logsVisible);
|
|
84 },
|
|
85 refresh() {
|
|
86 this.loadImportQueue();
|
|
87 this.loadLogs();
|
|
88 },
|
|
89 loadImportQueue() {
|
|
90 this.$store
|
|
91 .dispatch("imports/getImports")
|
|
92 .then(() => {})
|
|
93 .catch(error => {
|
|
94 const { status, data } = error.response;
|
|
95 displayError({
|
|
96 title: this.$gettext("Backend Error"),
|
|
97 message: `${status}: ${data.message || data}`
|
|
98 });
|
|
99 });
|
|
100 },
|
|
101 loadLogs() {
|
|
102 this.$store.dispatch("imports/getStaging").catch(error => {
|
|
103 const { status, data } = error.response;
|
|
104 displayError({
|
|
105 title: "Backend Error",
|
|
106 message: `${status}: ${data.message || data}`
|
|
107 });
|
|
108 });
|
|
109 }
|
|
110 },
|
|
111 mounted() {
|
|
112 this.refresh();
|
|
113 }
|
|
114 };
|
|
115 </script>
|
|
116
|
|
117 <style></style>
|