Mercurial > gemma

comparison client/src/components/identify/Identify.vue @ 4291:81ab34bd2d0d

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Legend: Improve display of data availability In order to show Nash Sutcliffe data for bottleneckts the according gauge has to be determined. Every gauge is loaded at initial startup, data will be available when necessary for identification of bottlenecks. The Nash Sutcliffe data is lazy loaded and used here. Perhaps we could use this cache for the style layer too.
author Thomas Junk <thomas.junk@intevation.de>
date Fri, 30 Aug 2019 12:11:35 +0200
parents 30f26bf7ff24
children dbd8d2416da7
comparison
equal deleted inserted replaced
4290:2de644208706 4291:81ab34bd2d0d
75 <div> 75 <div>
76 <font-awesome-icon 76 <font-awesome-icon
77 icon="caret-up" 77 icon="caret-up"
78 fixed-width 78 fixed-width
79 :style="{ 79 :style="{
80 color: forecastVsRealityColor(feature), 80 color: gaugeStatusColor,
81 'font-size': 'x-large' 81 'font-size': 'x-large'
82 }" 82 }"
83 /> 83 />
84 <small class="my-auto"> 84 <small class="my-auto">
85 {{ forecastVsReality(feature) }} 85 {{ gaugeStatusText }}
86 </small> 86 </small>
87 </div> 87 </div>
88 <div> 88 <div>
89 <font-awesome-icon 89 <font-awesome-icon
90 icon="caret-up" 90 icon="caret-up"
217 forecastVsRealityColorCodes 217 forecastVsRealityColorCodes
218 } = styleFactory(); 218 } = styleFactory();
219 219
220 export default { 220 export default {
221 name: "identify", 221 name: "identify",
222 data() {
223 return {
224 gaugeStatus: ""
225 };
226 },
222 computed: { 227 computed: {
223 ...mapGetters("application", ["versionStr"]), 228 ...mapGetters("application", ["versionStr"]),
224 ...mapState("application", ["showIdentify", "userManualUrl", "config"]), 229 ...mapState("application", ["showIdentify", "userManualUrl", "config"]),
225 ...mapGetters("map", ["filteredIdentifiedFeatures"]), 230 ...mapGetters("map", ["filteredIdentifiedFeatures"]),
226 ...mapState("map", ["currentMeasurement"]), 231 ...mapState("map", ["currentMeasurement"]),
232 ...mapState("gauges", ["gauges"]),
227 identifiedLabel() { 233 identifiedLabel() {
228 return this.$gettext("Identified Features"); 234 return this.$gettext("Identified Features");
229 }, 235 },
230 usermanualFilename() { 236 usermanualFilename() {
231 return this.$gettext("User Manual"); 237 return this.$gettext("User Manual");
238 },
239 gaugeStatusColor() {
240 return forecastVsRealityColorCodes[this.gaugeStatus];
241 },
242 gaugeStatusText() {
243 const nsc24 = this.config.gm_forecast_vs_reality_nsc_24h;
244 const nsc72 = this.config.gm_forecast_vs_reality_nsc_72h;
245 const messagesPerState = {
246 OK: this.$gettext("Nash-Sutcliffe") + `>${nsc24} /24h >${nsc72} / 72h`,
247 WARNING: this.$gettext("Nash-Sutcliffe") + ` < ${nsc72}`,
248 DANGER: this.$gettext("Nash-Sutcliffe") + ` < ${nsc24}`,
249 NEUTRAL: this.$gettext("Nash-Sutcliffe not available")
250 };
251 return messagesPerState[this.gaugeStatus];
252 }
253 },
254 watch: {
255 filteredIdentifiedFeatures() {
256 const bottlecks = this.filteredIdentifiedFeatures.filter(f =>
257 /bottleneck/.test(f.id_)
258 );
259 if (bottlecks.length > 0) {
260 const gauge = this.gauges.find(
261 g => g.properties.objname === bottlecks[0].get("gauge_objname")
262 );
263 const isrs = gauge.properties.isrs_code;
264 this.$store
265 .dispatch("gauges/getNashSutcliffeForISRS", isrs)
266 .then(response => {
267 this.gaugeStatus = classifications.calcForecastVsRealityForNSC(
268 response
269 );
270 });
271 }
232 } 272 }
233 }, 273 },
234 methods: { 274 methods: {
235 gmAvailability(feature) { 275 gmAvailability(feature) {
236 const latestInHours = this.config.gm_latest_hours; 276 const latestInHours = this.config.gm_latest_hours;
266 forecastAccuracyColor(feature) { 306 forecastAccuracyColor(feature) {
267 return forecastAccuracyColorCodes[ 307 return forecastAccuracyColorCodes[
268 classifications.forecastAccuracy(feature) 308 classifications.forecastAccuracy(feature)
269 ]; 309 ];
270 }, 310 },
271 forecastVsReality(feature) {
272 const nsc24 = this.config.gm_forecast_vs_reality_nsc_24h;
273 const nsc72 = this.config.gm_forecast_vs_reality_nsc_72h;
274 const messagesPerState = {
275 OK: this.$gettext("Nash-Sutcliffe") + `>${nsc24} /24h >${nsc72} / 72h`,
276 WARNING: this.$gettext("Nash-Sutcliffe") + ` < ${nsc72}`,
277 DANGER: this.$gettext("Nash-Sutcliffe") + ` < ${nsc24}`,
278 NEUTRAL: this.$gettext("Nash-Sutcliffe not available")
279 };
280 return messagesPerState[[classifications.forecastVsReality(feature)]];
281 },
282 forecastVsRealityColor(feature) {
283 return forecastVsRealityColorCodes[
284 classifications.forecastVsReality(feature)
285 ];
286 },
287 recency(feature) { 311 recency(feature) {
288 const revisitingFactor = this.config.bn_revtime_multiplier; 312 const revisitingFactor = this.config.bn_revtime_multiplier;
289 const messagesPerState = { 313 const messagesPerState = {
290 OK: this.$gettext("Data within the revisiting time"), 314 OK: this.$gettext("Data within the revisiting time"),
291 WARNING: 315 WARNING: