Mercurial > gemma

comparison client/src/components/systemconfiguration/DataAccuracy.vue @ 4279:30f26bf7ff24

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Reordering of elements In order to improve user experience the configuration of avail, forceast vs. real and accuracy was changed in such a way, that it now mirrors the optics of the displayed triangle. The order in the identify tool was changed accordingly 1) avail 2) forcast vs. real 3) accuracy "Currency" was cleaned up to "recency"
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 29 Aug 2019 15:04:02 +0200
parents 851c0ccba59b
children 033685fe1355
comparison
equal deleted inserted replaced
4278:1d4e588a61df 4279:30f26bf7ff24
2 <div class="d-flex flex-column py-4"> 2 <div class="d-flex flex-column py-4">
3 <div class="px-3 container-fluid"> 3 <div class="px-3 container-fluid">
4 <div class="row"> 4 <div class="row">
5 <div class="col-sm-6 d-flex flex-column"> 5 <div class="col-sm-6 d-flex flex-column">
6 <h6 class="font-weight-bold"> 6 <h6 class="font-weight-bold">
7 <translate>Currency of Bottleneck Surveys</translate> 7 <translate>Recency of Bottleneck Surveys</translate>
8 </h6> 8 </h6>
9 <div class="d-flex flex-grow-1 text-center small"> 9 <div class="d-flex flex-grow-1 text-center small">
10 <div class="card rounded-left"> 10 <div class="card rounded-left">
11 <div class="card-header">OK</div> 11 <div class="card-header">OK</div>
12 <div 12 <div
113 class="form-control form-control-sm mx-1" 113 class="form-control form-control-sm mx-1"
114 style="width: 55px" 114 style="width: 55px"
115 v-model="config.gm_latest_hours" 115 v-model="config.gm_latest_hours"
116 /> 116 />
117 <translate>days.</translate> 117 <translate>days.</translate>
118 </div>
119 </div>
120 </div>
121 </div>
122 </div>
123 <div class="col-sm-6 d-flex flex-column">
124 <h6 class="font-weight-bold mt-3">
125 <translate>Gauge Forecast Confidence</translate>
126 </h6>
127 <div class="d-flex flex-grow-1 text-center small">
128 <div class="card rounded-left">
129 <div class="card-header">OK</div>
130 <div
131 class="card-body d-flex align-items-center justify-content-center"
132 >
133 <span
134 v-translate="{
135 gm24: Number(
136 config.gm_forecast_offset_24h
137 ).toLocaleString(),
138 gm72: Number(config.gm_forecast_offset_72h).toLocaleString()
139 }"
140 >The highest confidence value is less than
141 <b>%{gm24} cm</b>
142 within the last 24 hours and less than
143 <b>%{gm72} cm</b>
144 within last 72 hours.</span
145 >
146 </div>
147 </div>
148 <div class="card border-left-0 border-right-0 rounded-0">
149 <div class="card-header rounded-0">
150 Warning
151 </div>
152 <div
153 class="card-body d-flex flex-column align-items-center justify-content-center"
154 >
155 <div class="form-inline justify-content-center">
156 <translate
157 >The highest confidence value within the last 72 hours is
158 greater than</translate
159 >
160 <input
161 type="number"
162 step="1"
163 min="1"
164 class="form-control form-control-sm mx-1"
165 style="width: 55px"
166 v-model="config.gm_forecast_offset_72h"
167 />
168 cm.
169 </div>
170 </div>
171 </div>
172 <div class="card rounded-right">
173 <div class="card-header">Critical</div>
174 <div
175 class="card-body d-flex flex-column align-items-center justify-content-center"
176 >
177 <div class="form-inline justify-content-center">
178 <translate
179 >The highest confidence value within the last 24 hours is
180 greater than</translate
181 >
182 <input
183 type="number"
184 step="1"
185 min="1"
186 class="form-control form-control-sm mx-1"
187 style="width: 55px"
188 v-model="config.gm_forecast_offset_24h"
189 />
190 cm.
191 </div> 118 </div>
192 </div> 119 </div>
193 </div> 120 </div>
194 </div> 121 </div>
195 </div> 122 </div>
257 step="0.1" 184 step="0.1"
258 class="form-control form-control-sm mx-1" 185 class="form-control form-control-sm mx-1"
259 style="width: 70px" 186 style="width: 70px"
260 v-model="config.gm_forecast_vs_reality_nsc_24h" 187 v-model="config.gm_forecast_vs_reality_nsc_24h"
261 /> 188 />
189 </div>
190 </div>
191 </div>
192 </div>
193 </div>
194 <div class="col-sm-6 d-flex flex-column">
195 <h6 class="font-weight-bold mt-3">
196 <translate>Gauge Forecast Confidence</translate>
197 </h6>
198 <div class="d-flex flex-grow-1 text-center small">
199 <div class="card rounded-left">
200 <div class="card-header">OK</div>
201 <div
202 class="card-body d-flex align-items-center justify-content-center"
203 >
204 <span
205 v-translate="{
206 gm24: Number(
207 config.gm_forecast_offset_24h
208 ).toLocaleString(),
209 gm72: Number(config.gm_forecast_offset_72h).toLocaleString()
210 }"
211 >The highest confidence value is less than
212 <b>%{gm24} cm</b>
213 within the last 24 hours and less than
214 <b>%{gm72} cm</b>
215 within last 72 hours.</span
216 >
217 </div>
218 </div>
219 <div class="card border-left-0 border-right-0 rounded-0">
220 <div class="card-header rounded-0">
221 Warning
222 </div>
223 <div
224 class="card-body d-flex flex-column align-items-center justify-content-center"
225 >
226 <div class="form-inline justify-content-center">
227 <translate
228 >The highest confidence value within the last 72 hours is
229 greater than</translate
230 >
231 <input
232 type="number"
233 step="1"
234 min="1"
235 class="form-control form-control-sm mx-1"
236 style="width: 55px"
237 v-model="config.gm_forecast_offset_72h"
238 />
239 cm.
240 </div>
241 </div>
242 </div>
243 <div class="card rounded-right">
244 <div class="card-header">Critical</div>
245 <div
246 class="card-body d-flex flex-column align-items-center justify-content-center"
247 >
248 <div class="form-inline justify-content-center">
249 <translate
250 >The highest confidence value within the last 24 hours is
251 greater than</translate
252 >
253 <input
254 type="number"
255 step="1"
256 min="1"
257 class="form-control form-control-sm mx-1"
258 style="width: 55px"
259 v-model="config.gm_forecast_offset_24h"
260 />
261 cm.
262 </div> 262 </div>
263 </div> 263 </div>
264 </div> 264 </div>
265 </div> 265 </div>
266 </div> 266 </div>