Mercurial > gemma
comparison client/src/components/importconfiguration/types/Soundingresults.vue @ 3281:439e1865a2d2
client: define stretches/imports: code cleanup / style improvements
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Thu, 16 May 2019 09:52:32 +0200 |
parents | cb3b31566e48 |
children | c1c85e70a368 |
comparison
equal
deleted
inserted
replaced
3280:8fb81b45085f | 3281:439e1865a2d2 |
---|---|
1 <template> | 1 <template> |
2 <div> | 2 <div> |
3 <div v-if="editState" class="mb-3"> | 3 <div v-if="editState" class="mb-2 p-2"> |
4 <div | 4 <div |
5 v-for="(message, index) in messages" | 5 v-for="(message, index) in messages" |
6 :key="index" | 6 :key="index" |
7 class="alert alert-warning small rounded-0" | 7 class="alert alert-warning small" |
8 > | 8 > |
9 {{ message }} | 9 {{ message }} |
10 </div> | 10 </div> |
11 <div class="d-flex flex-row w-100"> | 11 <div class="d-flex w-100"> |
12 <div class="w-50 mr-2 text-left"> | 12 <div class="w-50 mr-2 text-left"> |
13 <small class="text-muted"> | 13 <small class="text-muted"> |
14 <translate>Bottleneck</translate> | 14 <translate>Bottleneck</translate> |
15 </small> | 15 </small> |
16 <select v-model="bottleneck" class="custom-select"> | 16 <select v-model="bottleneck" class="custom-select custom-select-sm"> |
17 <option | 17 <option |
18 v-for="bottleneck in availableBottlenecks" | 18 v-for="bottleneck in availableBottlenecks" |
19 :value="bottleneck" | 19 :value="bottleneck" |
20 :key="bottleneck.properties.objnam" | 20 :key="bottleneck.properties.objnam" |
21 > | 21 > |
31 <div class="w-50 ml-3 text-left"> | 31 <div class="w-50 ml-3 text-left"> |
32 <small class="text-muted"> | 32 <small class="text-muted"> |
33 <translate>Projection</translate> (EPSG) | 33 <translate>Projection</translate> (EPSG) |
34 </small> | 34 </small> |
35 <input | 35 <input |
36 class="form-control" | 36 class="form-control form-control-sm" |
37 v-model="projection" | 37 v-model="projection" |
38 value="4326" | 38 value="4326" |
39 placeholder="e.g. 4326" | 39 placeholder="e.g. 4326" |
40 type="number" | 40 type="number" |
41 /> | 41 /> |
51 <small class="text-muted"> | 51 <small class="text-muted"> |
52 <translate>Depthreference</translate> | 52 <translate>Depthreference</translate> |
53 </small> | 53 </small> |
54 <select | 54 <select |
55 v-model="depthReference" | 55 v-model="depthReference" |
56 class="custom-select" | 56 class="custom-select custom-select-sm" |
57 id="depthreference" | 57 id="depthreference" |
58 > | 58 > |
59 <option | 59 <option |
60 v-for="option in this.depthReferenceOptions" | 60 v-for="option in this.depthReferenceOptions" |
61 :key="option" | 61 :key="option" |
71 <div class="w-50 ml-3 text-left"> | 71 <div class="w-50 ml-3 text-left"> |
72 <small class="text-muted"> <translate>Date</translate> </small> | 72 <small class="text-muted"> <translate>Date</translate> </small> |
73 <input | 73 <input |
74 id="importdate" | 74 id="importdate" |
75 type="date" | 75 type="date" |
76 class="form-control" | 76 class="form-control form-control-sm" |
77 placeholder="Date of import" | 77 placeholder="Date of import" |
78 aria-label="bottleneck" | 78 aria-label="bottleneck" |
79 aria-describedby="bottlenecklabel" | 79 aria-describedby="bottlenecklabel" |
80 v-model="importDate" | 80 v-model="importDate" |
81 /> | 81 /> |
85 </small> | 85 </small> |
86 </span> | 86 </span> |
87 </div> | 87 </div> |
88 </div> | 88 </div> |
89 </div> | 89 </div> |
90 <div class="mt-3"> | 90 <div class="mt-2"> |
91 <div v-if="uploadState" class="input-group"> | 91 <div v-if="uploadState" class="input-group px-2"> |
92 <div :key="1" class="flex-column mr-4"> | 92 <div :key="1" class="flex-column mr-4"> |
93 <div class="flex-row text-left"> | 93 <div class="flex-row text-left"> |
94 <small class="text-muted"> | 94 <small class="text-muted"> |
95 <translate>Email Notification</translate> | 95 <translate>Email Notification</translate> |
96 </small> | 96 </small> |
120 <label class="pointer custom-file-label" for="uploadFile"> | 120 <label class="pointer custom-file-label" for="uploadFile"> |
121 {{ uploadLabel }} | 121 {{ uploadLabel }} |
122 </label> | 122 </label> |
123 </div> | 123 </div> |
124 </div> | 124 </div> |
125 <div class="d-flex justify-content-between mt-3" v-if="editState"> | 125 <div |
126 <a | 126 class="d-flex justify-content-between mt-2 p-2 border-top" |
127 download="meta.json" | 127 v-if="editState" |
128 :href="dataLink" | 128 > |
129 :class="[ | 129 <button |
130 'btn btn-outline-info', | 130 :key="1" |
131 { disabled: !bottleneck || !importDate || !depthReference } | 131 @click="deleteTempData()" |
132 ]" | 132 class="btn btn-sm btn-warning" |
133 > | 133 > |
134 <translate>Download Meta.json</translate> | 134 Back |
135 </a> | 135 </button> |
136 <span> | 136 <span> |
137 <a | |
138 download="meta.json" | |
139 :href="dataLink" | |
140 :class="[ | |
141 'btn btn-sm btn-outline-info', | |
142 { disabled: !bottleneck || !importDate || !depthReference } | |
143 ]" | |
144 > | |
145 <translate>Download Meta.json</translate> | |
146 </a> | |
137 <button | 147 <button |
138 :disabled="disableUploadButton" | 148 :disabled="disableUploadButton" |
139 @click="confirm" | 149 @click="confirm" |
140 class="btn btn-info mr-2" | 150 class="btn btn-sm btn-info ml-2" |
141 type="button" | 151 type="button" |
142 > | 152 > |
143 <translate>Confirm</translate> | 153 <translate>Confirm</translate> |
144 </button> | 154 </button> |
145 <button :key="1" @click="deleteTempData()" class="btn btn-warning"> | |
146 Back | |
147 </button> | |
148 </span> | 155 </span> |
149 </div> | 156 </div> |
150 <div v-if="uploadState" class="d-flex flex-row-100 mt-3"> | 157 <div v-if="uploadState" class="d-flex mt-2 p-2 border-top"> |
151 <button :key="2" @click="back()" class="ml-auto btn btn-warning"> | 158 <button :key="2" @click="back()" class="btn btn-sm btn-warning"> |
152 Back | 159 Back |
153 </button> | 160 </button> |
154 </div> | 161 </div> |
155 </div> | 162 </div> |
156 </div> | 163 </div> |