comparison client/src/components/importconfiguration/types/Soundingresults.vue @ 3692:3138836bf840

import_soundingresults: bottlenecks grouped by countrycode
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 18 Jun 2019 17:44:28 +0200
parents 3c4f6b9acaad
children 5754793ff9b0
comparison
equal deleted inserted replaced
3691:afc8ac7001ee 3692:3138836bf840
11 <div class="d-flex"> 11 <div class="d-flex">
12 <div class="text-left mr-3"> 12 <div class="text-left mr-3">
13 <small class="text-muted"> 13 <small class="text-muted">
14 <translate>Bottleneck</translate> 14 <translate>Bottleneck</translate>
15 </small> 15 </small>
16 <select v-model="bottleneck" class="custom-select custom-select-sm"> 16 <select class="form-control font-weight-bold" v-model="bottleneck">
17 <option 17 <option :value="null">{{ placeholder }}</option>
18 v-for="bottleneck in availableBottlenecks" 18 <optgroup
19 :value="bottleneck" 19 v-for="(bottlenecksForCountry, cc) in orderedBottlenecks"
20 :key="bottleneck.properties.objnam" 20 :key="cc"
21 :label="cc"
21 > 22 >
22 {{ bottleneck.properties.objnam }} 23 <option
23 </option> 24 v-for="bn in bottlenecksForCountry"
25 :key="bn.properties.objnam"
26 :value="bn"
27 >
28 {{ bn.properties.objnam }}
29 </option>
30 </optgroup>
24 </select> 31 </select>
25 <span class="text-danger"> 32 <span class="text-danger">
26 <small v-if="!bottleneck"> 33 <small v-if="!bottleneck">
27 <translate>Please select a bottleneck</translate> 34 <translate>Please select a bottleneck</translate>
28 </small> 35 </small>
354 return this.disableUpload; 361 return this.disableUpload;
355 }, 362 },
356 availableBottlenecks() { 363 availableBottlenecks() {
357 return this.bottlenecks; 364 return this.bottlenecks;
358 }, 365 },
366 placeholder() {
367 return this.$gettext("Select bottleneck");
368 },
369 orderedBottlenecks() {
370 let groupedBottlenecks = {},
371 orderedGroups = {};
372
373 // group bottlenecks by cc
374 this.availableBottlenecks.forEach(bn => {
375 let cc = bn.properties.responsible_country;
376 if (groupedBottlenecks.hasOwnProperty(cc)) {
377 groupedBottlenecks[cc].push(bn);
378 } else {
379 groupedBottlenecks[cc] = [bn];
380 }
381 });
382
383 // order groups by cc
384 Object.keys(groupedBottlenecks)
385 .sort()
386 .forEach(cc => (orderedGroups[cc] = groupedBottlenecks[cc]));
387
388 return orderedGroups;
389 },
359 editState() { 390 editState() {
360 return this.importState === IMPORTSTATE.EDIT; 391 return this.importState === IMPORTSTATE.EDIT;
361 }, 392 },
362 uploadState() { 393 uploadState() {
363 return this.importState === IMPORTSTATE.UPLOAD; 394 return this.importState === IMPORTSTATE.UPLOAD;