Mercurial > gemma

comparison client/src/components/Statistics.vue @ 3199:25a26f666ee8

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
statistics: layout
author Thomas Junk <thomas.junk@intevation.de>
date Wed, 08 May 2019 15:54:40 +0200
parents b0328646e34f
children bf571429515f
comparison
equal deleted inserted replaced
3198:b0328646e34f 3199:25a26f666ee8
7 > 7 >
8 <div style="width: 18rem"> 8 <div style="width: 18rem">
9 <UIBoxHeader icon="chart-line" :title="label" :closeCallback="close" /> 9 <UIBoxHeader icon="chart-line" :title="label" :closeCallback="close" />
10 <div class="box-body"> 10 <div class="box-body">
11 <UISpinnerOverlay v-if="loading" /> 11 <UISpinnerOverlay v-if="loading" />
12 <div class="mb-3 d-flex flex-row justify-content-between"> 12 <div
13 class="mb-3 d-flex flex-row justify-content-between align-items-center"
14 >
13 <div> 15 <div>
14 <input :value="$options.BOTTLENECKS" type="radio" v-model="type" /> 16 <input :value="$options.BOTTLENECKS" type="radio" v-model="type" />
15 <small class="ml-1 text-muted"> 17 <small class="ml-1 text-muted">
16 <translate>Bottlenecks</translate> 18 <translate>Bottlenecks</translate>
17 </small> 19 </small>
30 </div> 32 </div>
31 </div> 33 </div>
32 <div class="d-flex flex-column"> 34 <div class="d-flex flex-column">
33 <select 35 <select
34 @change="entrySelected" 36 @change="entrySelected"
35 class="form-control font-weight-bold" 37 class="form-control form-control-sm font-weight-bold"
36 v-model="selectedEntry" 38 v-model="selectedEntry"
37 > 39 >
38 <option :value="null">{{ empty }}</option> 40 <option :value="null">{{ empty }}</option>
39 <option 41 <option
40 v-for="(entry, index) in entries" 42 v-for="(entry, index) in entries"
43 >{{ entry.properties.name }}</option 45 >{{ entry.properties.name }}</option
44 > 46 >
45 </select> 47 </select>
46 </div> 48 </div>
47 <div class="d-flex flex-column mt-3"> 49 <div class="d-flex flex-column mt-3">
48 <div class="d-flex flex-column mb-3"> 50 <div class="d-flex flex-row w-100">
49 <small class="my-auto text-muted" 51 <div class="d-flex flex-column mb-3 w-50 mr-1">
50 ><translate>Type</translate></small 52 <small class="my-auto text-muted"
51 > 53 ><translate>Type</translate></small
52 <select v-model="selectedFrequency" class="form-control">
53 <option
54 v-for="(option, index) in $options.FREQUENCIES"
55 :value="option"
56 :key="index"
57 ><translate>{{ option }}</translate></option
58 > 54 >
59 </select> 55 <select
60 </div> 56 v-model="selectedFrequency"
61 <div class="d-flex flex-column mb-3"> 57 class="form-control form-control-sm"
62 <small class="my-auto text-muted"><translate>LOS</translate></small> 58 >
63 <select v-model="los" class="form-control"> 59 <option
64 <option value="1">1</option> 60 v-for="(option, index) in $options.FREQUENCIES"
65 <option value="2">2</option> 61 :value="option"
66 <option value="3">3</option> 62 :key="index"
67 </select> 63 ><translate>{{ option }}</translate></option
68 </div> 64 >
69 <div class="d-flex flex-column mb-3"> 65 </select>
70 <small for="from" class="my-auto text-muted" 66 </div>
71 ><translate>Date from</translate></small 67 <div class="d-flex flex-column mb-3 w-50 ml-1">
72 ><input 68 <small class="my-auto text-muted"
73 id="from" 69 ><translate>LOS</translate></small
74 v-model="fromDate" 70 >
75 class="form-control" 71 <select v-model="los" class="form-control form-control-sm">
76 type="date" 72 <option value="1">1</option>
77 /> 73 <option value="2">2</option>
78 </div> 74 <option value="3">3</option>
79 <div class="d-flex flex-column"> 75 </select>
80 <small for="to" class="my-auto text-muted" 76 </div>
81 ><translate>Date to</translate></small 77 </div>
82 ><input id="to" v-model="toDate" class="form-control" type="date" /> 78 <div class="d-flex flex-row w-100">
79 <div class="d-flex flex-column w-50 mr-1">
80 <small for="from" class="my-auto text-muted"
81 ><translate>Date from</translate></small
82 ><input
83 id="from"
84 v-model="fromDate"
85 class="form-control form-control-sm"
86 type="date"
87 />
88 </div>
89 <div class="d-flex flex-column w-50 ml-1">
90 <small for="to" class="my-auto text-muted"
91 ><translate>Date to</translate></small
92 ><input
93 id="to"
94 v-model="toDate"
95 class="form-control form-control-sm"
96 type="date"
97 />
98 </div>
83 </div> 99 </div>
84 </div> 100 </div>
85 <div class="mt-3"> 101 <div class="mt-3">
86 <button 102 <button
87 @click="openFairwaydepth" 103 @click="openFairwaydepth"
93 </div> 109 </div>
94 </div> 110 </div>
95 </div> 111 </div>
96 </div> 112 </div>
97 </template> 113 </template>
114
115 <style lang="scss" scoped>
116 input,
117 select {
118 font-size: 0.8em;
119 }
120 </style>
98 121
99 <script> 122 <script>
100 /* This is Free Software under GNU Affero General Public License v >= 3.0 123 /* This is Free Software under GNU Affero General Public License v >= 3.0
101 * without warranty, see README.md and license for details. 124 * without warranty, see README.md and license for details.
102 * 125 *
294 QUARTERLY: "quarterly", 317 QUARTERLY: "quarterly",
295 YEARLY: "yearly" 318 YEARLY: "yearly"
296 } 319 }
297 }; 320 };
298 </script> 321 </script>
299
300 <style></style>