comparison client/src/components/Bottlenecks.vue @ 5451:66f2c48aa69c uiimprovements

minor layout fixes for bottlenecks
author Thomas Junk <thomas.junk@intevation.de>
date Wed, 14 Jul 2021 14:07:26 +0200
parents 62caee603217
children 54214717ef5d
comparison
equal deleted inserted replaced
5450:62caee603217 5451:66f2c48aa69c
11 { 11 {
12 id: 'properties.responsible_country', 12 id: 'properties.responsible_country',
13 title: `${countryLabel}`, 13 title: `${countryLabel}`,
14 width: '100px' 14 width: '100px'
15 }, 15 },
16 { id: 'properties.from', title: `${chainageLabel}`, width: '155px' },
16 { 17 {
17 id: 'properties.current', 18 id: 'properties.current',
18 title: `${latestmeasurementLabel}`, 19 title: `${latestmeasurementLabel}`,
19 width: '150px' 20 width: '150px'
20 }, 21 }
21 { id: 'properties.from', title: `${chainageLabel}`, width: '155px' }
22 ]" 22 ]"
23 /> 23 />
24 <UITableBody 24 <UITableBody
25 :data="filteredBottlenecks() | sortTable(sortColumn, sortDirection)" 25 :data="filteredBottlenecks() | sortTable(sortColumn, sortDirection)"
26 maxHeight="35rem" 26 maxHeight="35rem"
33 }}</a> 33 }}</a>
34 </div> 34 </div>
35 <div class="table-cell text-center" style="width: 100px"> 35 <div class="table-cell text-center" style="width: 100px">
36 {{ bottleneck.properties.responsible_country }} 36 {{ bottleneck.properties.responsible_country }}
37 </div> 37 </div>
38 <div class="table-cell" style="flex-grow:1;">
39 <span class="ml-auto">{{
40 displayCurrentChainage(
41 bottleneck.properties.from,
42 bottleneck.properties.to
43 )
44 }}</span>
45 </div>
38 <div class="table-cell" style="width: 150px"> 46 <div class="table-cell" style="width: 150px">
39 {{ bottleneck.properties.current | surveyDate }} 47 <span class="ml-auto">{{
48 bottleneck.properties.current | surveyDate
49 }}</span>
40 <UISpinnerButton 50 <UISpinnerButton
41 @click="loadSurveys(bottleneck)" 51 @click="loadSurveys(bottleneck)"
42 :loading="loading === bottleneck" 52 :loading="loading === bottleneck"
43 :state="bottleneck === openBottleneck" 53 :state="bottleneck === openBottleneck"
44 v-if="bottleneck.properties.current" 54 v-if="bottleneck.properties.current"
45 /> 55 />
46 </div>
47 <div class="table-cell" style="flex-grow:1;">
48 {{
49 displayCurrentChainage(
50 bottleneck.properties.from,
51 bottleneck.properties.to
52 )
53 }}
54 </div> 56 </div>
55 </template> 57 </template>
56 <template v-slot:expand="{ item: bottleneck }"> 58 <template v-slot:expand="{ item: bottleneck }">
57 <a 59 <a
58 href="#" 60 href="#"