Mercurial > gemma
annotate client/src/components/importoverview/AGMLogItem.vue @ 3915:f7f09f32d6e0
hydrological conditions: omit rendering, when container isn't visible
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Thu, 11 Jul 2019 13:51:26 +0200 |
parents | fd6d62b08af7 |
children | fe3dd65c0891 |
rev | line source |
---|---|
3766
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
1 <template> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
2 <div class="d-flex flex-column"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
3 <div class="px-2 d-flex justify-content-between"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
4 <div class="d-flex"> |
3767
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
5 <div @click="toggleShow(index)" class="my-auto text-left"> |
3766
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
6 <UISpinnerButton |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
7 :state="show" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
8 :icons="['angle-right', 'angle-down']" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
9 classes="text-info" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
10 /> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
11 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
12 <div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
13 {{ line["fk-gauge-id"] }} |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
14 <sup v-if="isNew(line)" class="text-success"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
15 (<translate>New</translate>) |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
16 </sup> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
17 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
18 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
19 <div>{{ line["measure-date"] | dateTime }}</div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
20 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
21 <div v-if="show" class="compare-table"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
22 <div class="row no-gutters px-4 text-left font-weight-bold"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
23 <div :class="isNew(line) ? 'col-6' : 'col-4'"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
24 <translate>Value</translate> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
25 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
26 <div v-if="isOld(line)" class="col-4"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
27 <translate>Old</translate> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
28 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
29 <div :class="isNew(line) ? 'col-6' : 'col-4'"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
30 <translate>New</translate> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
31 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
32 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
33 <div |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
34 class="row no-gutters px-4 text-left" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
35 v-for="(entry, index) in Object.keys(line.versions[0])" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
36 :key="index" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
37 v-if="isNew(line) || isDifferent(line, entry)" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
38 > |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
39 <div :class="isNew(line) ? 'col-6' : 'col-4'"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
40 {{ entry }} |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
41 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
42 <div :class="isNew(line) ? 'col-6' : 'col-4'"> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
43 {{ line.versions[0][entry] }} |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
44 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
45 <div |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
46 v-if="isOld(line) && isDifferent(line, entry)" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
47 :class="isNew(line) ? 'col-6' : 'col-4'" |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
48 > |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
49 {{ line.versions[1][entry] }} |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
50 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
51 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
52 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
53 </div> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
54 </template> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
55 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
56 <script> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
57 export default { |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
58 props: ["line", "index", "showDiff"], |
3767
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
59 computed: { |
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
60 show() { |
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
61 return this.index === this.showDiff; |
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
62 } |
3766
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
63 }, |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
64 methods: { |
3767
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
65 toggleShow(index) { |
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
66 this.$emit("openDiff", index); |
fd6d62b08af7
review_agm: fixed open diff bug. Only selected diff is opened and stays open
Thomas Junk <thomas.junk@intevation.de>
parents:
3766
diff
changeset
|
67 }, |
3766
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
68 isNew(result) { |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
69 return result && result.versions && result.versions.length === 1; |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
70 }, |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
71 isOld(result) { |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
72 return !this.isNew(result); |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
73 }, |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
74 isDifferent(result, entry) { |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
75 return ( |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
76 this.isOld(result) && |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
77 result.versions[0][entry] != result.versions[1][entry] |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
78 ); |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
79 } |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
80 } |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
81 }; |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
82 </script> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
83 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
84 <style lang="sass" scoped> |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
85 .diffs |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
86 width: 100% |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
87 overflow-y: auto |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
88 > div |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
89 border-top: dashed 1px #dee2e6 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
90 &:first-child |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
91 border-top: none |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
92 .compare-table |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
93 position: relative |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
94 overflow: hidden |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
95 &::after |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
96 content: '' |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
97 position: absolute |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
98 top: 0 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
99 right: -5px |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
100 bottom: 0 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
101 left: -5px |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
102 box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.4) |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
103 > div |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
104 font-size: 0.7rem |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
105 &:nth-child(odd) |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
106 background-color: #f8f9fa |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
107 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
108 .split |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
109 max-height: 35vh |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
110 |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
111 .full |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
112 max-height: 70vh |
96ee62fb88fd
agm_review: now with virtual scrolling
Thomas Junk <thomas.junk@intevation.de>
parents:
diff
changeset
|
113 </style> |