2579
|
1 <template>
|
2592
|
2 <div>
|
2601
|
3 <div class="logentry d-flex flex-row text-left">
|
2592
|
4 <font-awesome-icon
|
|
5 v-if="entry.id === show"
|
|
6 @click="toggleDetails"
|
|
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 !== show"
|
|
13 @click="toggleDetails"
|
|
14 class="my-auto mr-1 text-info pointer"
|
|
15 icon="angle-right"
|
2579
|
16 fixed-width
|
2592
|
17 ></font-awesome-icon>
|
2599
|
18 <div class="kind">{{ entry.kind.toUpperCase() }}</div>
|
2592
|
19 <div class="enqueued">{{ entry.enqueued | surveyDate }}</div>
|
|
20 <div class="user">{{ entry.user }}</div>
|
|
21 <div class="signer">{{ entry.signer }}</div>
|
|
22 <div>
|
|
23 <font-awesome-icon
|
|
24 v-if="entry.warnings"
|
|
25 class="ml-1 text-warning"
|
|
26 icon="exclamation-triangle"
|
|
27 fixed-width
|
|
28 ></font-awesome-icon>
|
|
29 </div>
|
|
30 <div v-if="reviewable" class="controls d-flex flex-row ml-auto">
|
|
31 <div>
|
|
32 <button
|
|
33 :class="{
|
|
34 'ml-3': true,
|
|
35 'mr-3': true,
|
|
36 btn: true,
|
|
37 'btn-outline-success': needsApproval || isRejected,
|
|
38 'btn-success': isApproved,
|
|
39 actions: true
|
|
40 }"
|
|
41 @click="toggleApproval($options.STATES.APPROVED)"
|
|
42 >
|
|
43 <font-awesome-icon
|
|
44 class="mx-auto small pointer mb-2"
|
|
45 icon="check"
|
|
46 ></font-awesome-icon>
|
|
47 </button>
|
|
48 </div>
|
|
49 <div>
|
|
50 <button
|
|
51 :class="{
|
|
52 'mr-3': true,
|
|
53 btn: true,
|
|
54 'btn-outline-danger': needsApproval || isApproved,
|
|
55 'btn-danger': isRejected,
|
|
56 actions: true
|
|
57 }"
|
|
58 @click="toggleApproval($options.STATES.REJECTED)"
|
|
59 >
|
|
60 <font-awesome-icon
|
|
61 icon="times"
|
|
62 class="small pointer mb-2"
|
|
63 ></font-awesome-icon>
|
|
64 </button>
|
|
65 </div>
|
|
66 </div>
|
|
67 </div>
|
2594
|
68 <div class="ml-1 d-flex flex-row">
|
2597
|
69 <LogDetail :entry="entry" v-if="show === entry.id"></LogDetail>
|
2592
|
70 </div>
|
2579
|
71 </div>
|
|
72 </template>
|
|
73
|
|
74 <script>
|
2592
|
75 /* This is Free Software under GNU Affero General Public License v >= 3.0
|
|
76 * without warranty, see README.md and license for details.
|
|
77 *
|
|
78 * SPDX-License-Identifier: AGPL-3.0-or-later
|
|
79 * License-Filename: LICENSES/AGPL-3.0.txt
|
|
80 *
|
|
81 * Copyright (C) 2018 by via donau
|
|
82 * – Österreichische Wasserstraßen-Gesellschaft mbH
|
|
83 * Software engineering by Intevation GmbH
|
|
84 *
|
|
85 * Author(s):
|
|
86 * Thomas Junk <thomas.junk@intevation.de>
|
|
87 */
|
|
88 import { mapState } from "vuex";
|
|
89 import { STATES } from "@/store/imports.js";
|
|
90
|
2579
|
91 export default {
|
|
92 name: "importlogentry",
|
|
93 props: ["entry"],
|
2592
|
94 components: {
|
|
95 LogDetail: () => import("./LogDetail.vue")
|
|
96 },
|
|
97 methods: {
|
|
98 toggleApproval(state) {
|
|
99 this.$store.commit("imports/toggleApprove", {
|
|
100 id: this.entry.id,
|
|
101 newStatus: state
|
|
102 });
|
|
103 },
|
|
104 toggleDetails() {
|
|
105 const { id } = this.entry;
|
|
106 if (id === this.show) {
|
|
107 this.$store.commit("imports/hideDetails");
|
2597
|
108 this.$store.commit("imports/hideAdditionalInfo");
|
|
109 this.$store.commit("imports/hideAdditionalLogs");
|
2592
|
110 } else {
|
|
111 this.$store.commit("imports/showDetailsFor", id);
|
|
112 }
|
|
113 }
|
|
114 },
|
2579
|
115 computed: {
|
2592
|
116 ...mapState("imports", ["show"]),
|
|
117 needsApproval() {
|
|
118 return this.entry.status === STATES.NEEDSAPPROVAL;
|
|
119 },
|
|
120 isRejected() {
|
|
121 return this.entry.status === STATES.REJECTED;
|
|
122 },
|
|
123 isApproved() {
|
|
124 return this.entry.status === STATES.APPROVED;
|
|
125 },
|
2579
|
126 reviewable() {
|
|
127 return this.entry.state === "pending";
|
|
128 }
|
2592
|
129 },
|
|
130 STATES: STATES
|
2579
|
131 };
|
|
132 </script>
|
|
133
|
2592
|
134 <style lang="scss" scoped>
|
2601
|
135 .logentry {
|
|
136 }
|
|
137
|
2599
|
138 .kind {
|
|
139 width: 10%;
|
|
140 }
|
2592
|
141 .enqueued {
|
|
142 width: 20%;
|
|
143 }
|
|
144 .user {
|
|
145 width: 10%;
|
|
146 }
|
|
147 .signer {
|
|
148 width: 10%;
|
|
149 }
|
|
150 button {
|
|
151 height: 19px;
|
|
152 width: 19px;
|
|
153 padding: 0.1rem;
|
|
154 }
|
|
155 </style>
|