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");
     },