Mercurial > gemma
annotate client/src/components/importoverview/LogEntry.vue @ 2874:b9a6abef9f1c
client: more unified table layout
Expandable/collapsible rows are now also handled by the component
| author | Markus Kottlaender <markus@intevation.de> |
|---|---|
| date | Mon, 01 Apr 2019 11:51:03 +0200 |
| parents | e19fac818aab |
| children | 84effca50751 |
| rev | line source |
|---|---|
| 2579 | 1 <template> |
|
2874
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
2 <div> |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
3 <div class="row no-gutters text-left"> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
4 <div |
|
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
5 style="width: 79px;" |
|
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
6 class="table-cell d-flex justify-content-between" |
|
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
7 > |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
8 <font-awesome-icon |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
9 @click="toggleDetails" |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
10 class="my-auto text-info pointer" |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
11 :icon="entry.id === show ? 'angle-down' : 'angle-right'" |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
12 fixed-width |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
13 ></font-awesome-icon> |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
14 {{ entry.id }} |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
15 </div> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
16 <div style="width: 53px;" class="table-cell text-center"> |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
17 {{ entry.kind.toUpperCase() }} |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
18 </div> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
19 <div style="width: 138px;" class="table-cell text-center"> |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
20 {{ entry.enqueued | dateTime }} |
|
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
21 </div> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
22 <div style="width: 105px;" class="table-cell truncate"> |
|
2699
ef10f1cd6cb8
import_overview: testwise including header component
Thomas Junk <thomas.junk@intevation.de>
parents:
2685
diff
changeset
|
23 {{ entry.user }} |
|
ef10f1cd6cb8
import_overview: testwise including header component
Thomas Junk <thomas.junk@intevation.de>
parents:
2685
diff
changeset
|
24 </div> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
25 <div style="width: 105px;" class="table-cell truncate"> |
|
2699
ef10f1cd6cb8
import_overview: testwise including header component
Thomas Junk <thomas.junk@intevation.de>
parents:
2685
diff
changeset
|
26 {{ entry.signer }} |
|
ef10f1cd6cb8
import_overview: testwise including header component
Thomas Junk <thomas.junk@intevation.de>
parents:
2685
diff
changeset
|
27 </div> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
28 <div style="width: 72px;" class="table-cell text-center"> |
|
2656
8299cce986a2
import_overview: readded status
Thomas Junk <thomas.junk@intevation.de>
parents:
2617
diff
changeset
|
29 <span v-if="entry.state === 'failed'" class="text-danger">{{ |
|
8299cce986a2
import_overview: readded status
Thomas Junk <thomas.junk@intevation.de>
parents:
2617
diff
changeset
|
30 entry.state |
|
8299cce986a2
import_overview: readded status
Thomas Junk <thomas.junk@intevation.de>
parents:
2617
diff
changeset
|
31 }}</span> |
|
8299cce986a2
import_overview: readded status
Thomas Junk <thomas.junk@intevation.de>
parents:
2617
diff
changeset
|
32 <span v-else>{{ entry.state }}</span> |
|
8299cce986a2
import_overview: readded status
Thomas Junk <thomas.junk@intevation.de>
parents:
2617
diff
changeset
|
33 </div> |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
34 <div style="width: 44px;" class="table-cell text-center"> |
| 2592 | 35 <font-awesome-icon |
| 36 v-if="entry.warnings" | |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
37 class="text-warning" |
| 2592 | 38 icon="exclamation-triangle" |
| 39 fixed-width | |
| 40 ></font-awesome-icon> | |
| 41 </div> | |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
42 <div style="flex-grow: 1; padding: 0;" class="table-cell text-right"> |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
43 <div v-if="entry.state === 'pending'"> |
| 2592 | 44 <button |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
45 :class="['actions approved', { active: isApproved }]" |
| 2592 | 46 @click="toggleApproval($options.STATES.APPROVED)" |
| 47 > | |
| 48 <font-awesome-icon | |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
49 class="small pointer" |
| 2592 | 50 icon="check" |
| 51 ></font-awesome-icon> | |
| 52 </button> | |
| 53 <button | |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
54 :class="['actions rejected', { active: isRejected }]" |
| 2592 | 55 @click="toggleApproval($options.STATES.REJECTED)" |
| 56 > | |
| 57 <font-awesome-icon | |
| 58 icon="times" | |
|
2617
359f5f0037f5
client: importoverview2: improved table layout to save more space
Markus Kottlaender <markus@intevation.de>
parents:
2616
diff
changeset
|
59 class="small pointer" |
| 2592 | 60 ></font-awesome-icon> |
| 61 </button> | |
| 62 </div> | |
| 63 </div> | |
| 64 </div> | |
|
2727
0fe0b3f1720f
client: import overview: several style fixes
Markus Kottlaender <markus@intevation.de>
parents:
2725
diff
changeset
|
65 <LogDetail |
|
0fe0b3f1720f
client: import overview: several style fixes
Markus Kottlaender <markus@intevation.de>
parents:
2725
diff
changeset
|
66 :entry="entry" |
|
0fe0b3f1720f
client: import overview: several style fixes
Markus Kottlaender <markus@intevation.de>
parents:
2725
diff
changeset
|
67 :details="details" |
|
0fe0b3f1720f
client: import overview: several style fixes
Markus Kottlaender <markus@intevation.de>
parents:
2725
diff
changeset
|
68 v-if="show === entry.id" |
|
0fe0b3f1720f
client: import overview: several style fixes
Markus Kottlaender <markus@intevation.de>
parents:
2725
diff
changeset
|
69 ></LogDetail> |
| 2579 | 70 </div> |
| 71 </template> | |
| 72 | |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
73 <style lang="sass" scoped> |
|
2874
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
74 .actions |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
75 height: 100% |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
76 width: 50% |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
77 border: 0 |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
78 background: transparent |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
79 outline: none |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
80 &.approved |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
81 color: green |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
82 &.active, |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
83 &:hover |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
84 color: white |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
85 background: green |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
86 &.rejected |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
87 border-left: 1px solid #dee2e6 |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
88 color: red |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
89 &.active, |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
90 &:hover |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
91 color: white |
|
b9a6abef9f1c
client: more unified table layout
Markus Kottlaender <markus@intevation.de>
parents:
2799
diff
changeset
|
92 background: red |
|
2720
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
93 </style> |
|
305af1e2975d
client: table headers: improved component to accept specific widths for columns
Markus Kottlaender <markus@intevation.de>
parents:
2699
diff
changeset
|
94 |
| 2579 | 95 <script> |
| 2592 | 96 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
| 97 * without warranty, see README.md and license for details. | |
| 98 * | |
| 99 * SPDX-License-Identifier: AGPL-3.0-or-later | |
| 100 * License-Filename: LICENSES/AGPL-3.0.txt | |
| 101 * | |
| 102 * Copyright (C) 2018 by via donau | |
| 103 * – Österreichische Wasserstraßen-Gesellschaft mbH | |
| 104 * Software engineering by Intevation GmbH | |
| 105 * | |
| 106 * Author(s): | |
| 107 * Thomas Junk <thomas.junk@intevation.de> | |
| 108 */ | |
| 109 import { mapState } from "vuex"; | |
| 110 import { STATES } from "@/store/imports.js"; | |
|
2799
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
111 import { displayError } from "@/lib/errors.js"; |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
112 import { HTTP } from "@/lib/http.js"; |
| 2592 | 113 |
| 2579 | 114 export default { |
| 115 name: "importlogentry", | |
| 116 props: ["entry"], | |
|
2685
39a05f8c34e6
import_overview: Refactoring of detailed information.
Thomas Junk <thomas.junk@intevation.de>
parents:
2656
diff
changeset
|
117 data() { |
|
39a05f8c34e6
import_overview: Refactoring of detailed information.
Thomas Junk <thomas.junk@intevation.de>
parents:
2656
diff
changeset
|
118 return { |
|
39a05f8c34e6
import_overview: Refactoring of detailed information.
Thomas Junk <thomas.junk@intevation.de>
parents:
2656
diff
changeset
|
119 details: null |
|
39a05f8c34e6
import_overview: Refactoring of detailed information.
Thomas Junk <thomas.junk@intevation.de>
parents:
2656
diff
changeset
|
120 }; |
|
39a05f8c34e6
import_overview: Refactoring of detailed information.
Thomas Junk <thomas.junk@intevation.de>
parents:
2656
diff
changeset
|
121 }, |
| 2592 | 122 components: { |
| 123 LogDetail: () => import("./LogDetail.vue") | |
| 124 }, | |
| 125 methods: { | |
| 126 toggleApproval(state) { | |
| 127 this.$store.commit("imports/toggleApprove", { | |
| 128 id: this.entry.id, | |
| 129 newStatus: state | |
| 130 }); | |
| 131 }, | |
| 132 toggleDetails() { | |
| 133 const { id } = this.entry; | |
| 134 if (id === this.show) { | |
| 135 this.$store.commit("imports/hideDetails"); | |
| 2597 | 136 this.$store.commit("imports/hideAdditionalInfo"); |
| 137 this.$store.commit("imports/hideAdditionalLogs"); | |
| 2592 | 138 } else { |
|
2799
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
139 HTTP.get("/imports/" + this.entry.id, { |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
140 headers: { "X-Gemma-Auth": localStorage.getItem("token") } |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
141 }) |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
142 .then(response => { |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
143 this.$store.commit("imports/showDetailsFor", id); |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
144 this.$store.commit("imports/setCurrentDetails", response.data); |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
145 }) |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
146 .catch(error => { |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
147 const { status, data } = error.response; |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
148 displayError({ |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
149 title: this.$gettext("Backend Error"), |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
150 message: `${status}: ${data.message || data}` |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
151 }); |
|
e19fac818aab
import_overview: specifying single imports via URL should open the overview with all logentries of the according hour and open the details for the specified import
Thomas Junk <thomas.junk@intevation.de>
parents:
2732
diff
changeset
|
152 }); |
| 2592 | 153 } |
| 154 } | |
| 155 }, | |
| 2579 | 156 computed: { |
| 2592 | 157 ...mapState("imports", ["show"]), |
| 158 needsApproval() { | |
| 159 return this.entry.status === STATES.NEEDSAPPROVAL; | |
| 160 }, | |
| 161 isRejected() { | |
| 162 return this.entry.status === STATES.REJECTED; | |
| 163 }, | |
| 164 isApproved() { | |
| 165 return this.entry.status === STATES.APPROVED; | |
| 2579 | 166 } |
| 2592 | 167 }, |
| 168 STATES: STATES | |
| 2579 | 169 }; |
| 170 </script> |