Mercurial > gemma
comparison client/src/components/fairway/Profiles.vue @ 3158:f91df0bc4986
client: compare surveys: prevent loading of differences from blocking the whole dialog
The loading process of differences data is now visualized inside of the button to toggle between differences and the survey layer.
The button is now disabled and says 'calculating differences' for the time of the calculation
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 06 May 2019 12:21:28 +0200 |
parents | b6cc4838d2c0 |
children | 975efa874acf |
comparison
equal
deleted
inserted
replaced
3157:18a639e1f7f4 | 3158:f91df0bc4986 |
---|---|
10 icon="chart-area" | 10 icon="chart-area" |
11 :title="profilesLable" | 11 :title="profilesLable" |
12 :closeCallback="close" | 12 :closeCallback="close" |
13 /> | 13 /> |
14 <div class="box-body"> | 14 <div class="box-body"> |
15 <UISpinnerOverlay | 15 <UISpinnerOverlay v-if="surveysLoading || profileLoading" /> |
16 v-if="surveysLoading || profileLoading || differencesLoading" | |
17 /> | |
18 <select | 16 <select |
19 @change="moveToBottleneck" | 17 @change="moveToBottleneck" |
20 v-model="selectedBottleneck" | 18 v-model="selectedBottleneck" |
21 class="form-control font-weight-bold" | 19 class="form-control font-weight-bold" |
22 > | 20 > |
94 </select> | 92 </select> |
95 </div> | 93 </div> |
96 </div> | 94 </div> |
97 <div class="mt-2 d-flex" v-if="additionalSurvey"> | 95 <div class="mt-2 d-flex" v-if="additionalSurvey"> |
98 <button | 96 <button |
97 v-if="differencesLoading" | |
98 class="btn btn-info btn-xs flex-fill" | |
99 disabled | |
100 > | |
101 <font-awesome-icon icon="spinner" spin class="mr-1" /> | |
102 <translate>Calculating differences</translate> | |
103 </button> | |
104 <button | |
99 class="btn btn-info btn-xs flex-fill" | 105 class="btn btn-info btn-xs flex-fill" |
100 @click="differencesVisible ? showSurvey() : showDifferences()" | 106 @click="differencesVisible ? showSurvey() : showDifferences()" |
107 v-else | |
101 > | 108 > |
102 <translate v-if="differencesVisible" key="showsurvey" | 109 <translate v-if="differencesVisible" key="showsurvey" |
103 >Show survey</translate | 110 >Show survey</translate |
104 > | 111 > |
105 <translate v-else key="showdifferences" | 112 <translate v-else key="showdifferences" |