Mercurial > gemma
comparison client/src/components/importoverview/ApprovedGaugeMeasurementDetail.vue @ 2914:84a40983bb9f
client: importsoverview: improved opening mechanism for additional details
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Wed, 03 Apr 2019 12:55:32 +0200 |
parents | 399b03e59411 |
children | ce148a7fb896 |
comparison
equal
deleted
inserted
replaced
2913:cf6f595af2cb | 2914:84a40983bb9f |
---|---|
6 split: showLogs | 6 split: showLogs |
7 }" | 7 }" |
8 > | 8 > |
9 <div v-for="(result, index) in details.summary" :key="index"> | 9 <div v-for="(result, index) in details.summary" :key="index"> |
10 <div class="pl-2 d-flex flex-row"> | 10 <div class="pl-2 d-flex flex-row"> |
11 <div | 11 <div @click="toggleDiff(index)" class="my-auto text-left"> |
12 @click="toggleDiff(index)" | |
13 class="small mt-auto mb-auto text-info text-left" | |
14 > | |
15 <UISpinnerButton | 12 <UISpinnerButton |
16 :state="showDiff == index" | 13 :state="showDiff === index" |
17 :icons="['angle-right', 'angle-down']" | 14 :icons="['angle-right', 'angle-down']" |
18 class="text-info" | 15 class="text-info" |
19 /> | 16 /> |
20 </div> | 17 </div> |
21 <span v-if="result.versions.length == 1" class="agmcode text-left" | 18 <span v-if="result.versions.length == 1" class="agmcode text-left" |
28 > | 25 > |
29 <span class="text-left" | 26 <span class="text-left" |
30 ><div>{{ result["measure-date"] | dateTime }}</div></span | 27 ><div>{{ result["measure-date"] | dateTime }}</div></span |
31 > | 28 > |
32 </div> | 29 </div> |
33 <div v-if="showDiff == index" class="pl-3 d-flex flex-row"> | 30 <div v-if="showDiff === index" class="pl-3 d-flex flex-row"> |
34 <div class="w-100"> | 31 <div class="w-100"> |
35 <div class="d-flex flex-row pl-3 text-left"> | 32 <div class="d-flex flex-row pl-3 text-left"> |
36 <div class="header border-bottom agmdetailskeys"> | 33 <div class="header border-bottom agmdetailskeys"> |
37 <small><translate>Value</translate></small> | 34 <small><translate>Value</translate></small> |
38 </div> | 35 </div> |
126 export default { | 123 export default { |
127 name: "agmdetails", | 124 name: "agmdetails", |
128 props: ["entry"], | 125 props: ["entry"], |
129 data() { | 126 data() { |
130 return { | 127 return { |
131 showDiff: false | 128 showDiff: 0 // open first item by default |
132 }; | 129 }; |
133 }, | 130 }, |
134 computed: { | 131 computed: { |
135 ...mapState("imports", ["showLogs", "details"]) | 132 ...mapState("imports", ["showLogs", "details"]) |
136 }, | 133 }, |