Mercurial > gemma
changeset 4479:2d2c9f98360a
Bottlenecks: Instead of dynamically scroll use crosshairs button
| author | Thomas Junk <thomas.junk@intevation.de> |
|---|---|
| date | Wed, 25 Sep 2019 16:58:38 +0200 |
| parents | 51dc4811a0e6 |
| children | 004d08038319 c982969e7743 |
| files | client/src/components/fairway/BottleneckDialogue.vue |
| diffstat | 1 files changed, 25 insertions(+), 21 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/fairway/BottleneckDialogue.vue Wed Sep 25 16:52:40 2019 +0200 +++ b/client/src/components/fairway/BottleneckDialogue.vue Wed Sep 25 16:58:38 2019 +0200 @@ -13,28 +13,32 @@ /> <div class="box-body"> <UISpinnerOverlay v-if="surveysLoading || profileLoading" /> - <select - @change="moveToBottleneck" - v-model="selectedBottleneck" - class="form-control font-weight-bold" - > - <option :value="null"> - <translate>Select Bottleneck</translate> - </option> - <optgroup - v-for="(bottlenecksForCountry, cc) in orderedBottlenecks" - :key="cc" - :label="cc" + <div class="d-flex flex-row"> + <select + v-model="selectedBottleneck" + class="form-control font-weight-bold" > - <option - v-for="bn in bottlenecksForCountry" - :key="bn.properties.id" - :value="bn.properties.name" + <option :value="null"> + <translate>Select Bottleneck</translate> + </option> + <optgroup + v-for="(bottlenecksForCountry, cc) in orderedBottlenecks" + :key="cc" + :label="cc" > - {{ bn.properties.name }} - </option> - </optgroup> - </select> + <option + v-for="bn in bottlenecksForCountry" + :key="bn.properties.id" + :value="bn.properties.name" + > + {{ bn.properties.name }} + </option> + </optgroup> + </select> + <button @click="takeMeThere" class="btn btn-sm btn-info"> + <font-awesome-icon icon="crosshairs" /> + </button> + </div> <div v-if="selectedBottleneck"> <div class="d-flex flex-column mt-2"> <div class="flex-fill"> @@ -689,7 +693,7 @@ } }); }, - moveToBottleneck() { + takeMeThere() { const bottleneck = this.bottlenecksList.find( bn => bn.properties.name === this.selectedBottleneck );