Mercurial > gemma
changeset 2812:30a753f51a3c
client: profiles: ordered bottleneck list by country code
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Tue, 26 Mar 2019 13:03:10 +0100 |
parents | 3b1bdbbc0225 |
children | 49c1570919ae |
files | client/src/components/fairway/Profiles.vue |
diffstat | 1 files changed, 24 insertions(+), 5 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/fairway/Profiles.vue Tue Mar 26 13:02:12 2019 +0100 +++ b/client/src/components/fairway/Profiles.vue Tue Mar 26 13:03:10 2019 +0100 @@ -25,12 +25,19 @@ <option :value="null"> <translate>Select Bottleneck</translate> </option> - <option - v-for="bn in bottlenecksList" - :key="bn.properties.name" - :value="bn.properties.name" - >{{ bn.properties.name }}</option + <optgroup + v-for="(bottlenecksForCountry, cc) in orderedBottlenecks" + :key="cc" + :label="cc" > + <option + v-for="bn in bottlenecksForCountry" + :key="bn.properties.name" + :value="bn.properties.name" + > + {{ bn.properties.name }} + </option> + </optgroup> </select> <div v-if="selectedBottleneck"> <div class="d-flex mt-2"> @@ -264,6 +271,18 @@ "profileLoading", "waterLevels" ]), + orderedBottlenecks() { + let orderedBottlenecks = {}; + this.bottlenecksList.forEach(bn => { + let cc = bn.properties.responsible_country; + if (orderedBottlenecks.hasOwnProperty(cc)) { + orderedBottlenecks[cc].push(bn); + } else { + orderedBottlenecks[cc] = [bn]; + } + }); + return orderedBottlenecks; + }, profilesLable() { return this.$gettext("Profiles"); },