comparison client/src/components/importoverview/LogDetail.vue @ 2594:ecec6d5aae00

overview2 WIP
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 12 Mar 2019 11:14:56 +0100
parents 956b230c6062
children 02d5de05291f
comparison
equal deleted inserted replaced
2593:956b230c6062 2594:ecec6d5aae00
1 <template> 1 <template>
2 <div> 2 <div>
3 <h1>logdetail</h1> 3 <div class="d-flex fex-row">
4 <font-awesome-icon
5 v-if="entry.id === showAdditional"
6 @click="toggleAdditionalInfo"
7 class="my-auto mr-1 text-info pointer"
8 icon="angle-down"
9 fixed-width
10 ></font-awesome-icon>
11 <font-awesome-icon
12 v-if="entry.id !== showAdditional"
13 @click="toggleAdditionalInfo"
14 class="my-auto mr-1 text-info pointer"
15 icon="angle-right"
16 fixed-width
17 ></font-awesome-icon>
18 <span class="text-info"><translate>Additional Info</translate></span>
19 </div>
20 <AdditionalDetail
21 v-if="entry.id === showAdditional"
22 class="ml-2 d-flex flex-row"
23 ></AdditionalDetail>
24 <div class="d-flex fex-row">
25 <font-awesome-icon
26 v-if="entry.id === showLogs"
27 @click="toggleAdditionalLogging"
28 class="my-auto mr-1 text-info pointer"
29 icon="angle-down"
30 fixed-width
31 ></font-awesome-icon>
32 <font-awesome-icon
33 v-if="entry.id !== showLogs"
34 @click="toggleAdditionalLogging"
35 class="my-auto mr-1 text-info pointer"
36 icon="angle-right"
37 fixed-width
38 ></font-awesome-icon>
39 <span class="text-info"><translate>Additional Logs</translate></span>
40 </div>
41
42 <AdditionalLog
43 v-if="entry.id === showLogs"
44 class="ml-2 d-flex flex-row"
45 ></AdditionalLog>
4 </div> 46 </div>
5 </template> 47 </template>
6 48
7 <script> 49 <script>
8 /* This is Free Software under GNU Affero General Public License v >= 3.0 50 /* This is Free Software under GNU Affero General Public License v >= 3.0
16 * Software engineering by Intevation GmbH 58 * Software engineering by Intevation GmbH
17 * 59 *
18 * Author(s): 60 * Author(s):
19 * Thomas Junk <thomas.junk@intevation.de> 61 * Thomas Junk <thomas.junk@intevation.de>
20 */ 62 */
63
64 import { mapState } from "vuex";
65
21 export default { 66 export default {
22 name: "logdetail", 67 name: "logdetail",
23 props: ["entry"] 68 props: ["entry"],
69 components: {
70 AdditionalDetail: () => import("./AdditionalDetail.vue"),
71 AdditionalLog: () => import("./AdditionalLog.vue")
72 },
73 methods: {
74 toggleAdditionalInfo() {
75 if (this.entry.id === this.showAdditional) {
76 this.$store.commit("imports/hideAdditionalInfo");
77 } else {
78 this.$store.commit("imports/showAdditionalInfoFor", this.entry.id);
79 }
80 },
81 toggleAdditionalLogging() {
82 if (this.entry.id === this.showLogs) {
83 this.$store.commit("imports/hideAdditionalLogs");
84 } else {
85 this.$store.commit("imports/showAdditionalLogsFor", this.entry.id);
86 }
87 }
88 },
89 computed: {
90 ...mapState("imports", ["showAdditional", "showLogs"])
91 }
24 }; 92 };
25 </script> 93 </script>
26 94
27 <style></style> 95 <style lang="scss" scoped></style>