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