Mercurial > gemma

comparison client/src/components/map/contextbox/ImportSoundingresults.vue @ 1352:58113365c51d

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Import sounding results: fix empty metajson not displaying dialog. Pattern constrained to .zip
author Thomas Junk <thomas.junk@intevation.de>
date Mon, 26 Nov 2018 15:04:33 +0100
parents 58d41573e530
children f3bcce4e6f22
comparison
equal deleted inserted replaced
1350:58d41573e530 1352:58113365c51d
1 <template> 1 <template>
2 <div> 2 <div>
3 <h6 class="mb-0 py-2 px-3 border-bottom d-flex align-items-center"> 3 <h6 class="mb-0 py-2 px-3 border-bottom d-flex align-items-center">
4 <font-awesome-icon icon="upload" class="mr-2"></font-awesome-icon>Import Soundingresults 4 <font-awesome-icon icon="upload" class="mr-2"></font-awesome-icon>Import
5 Soundingresults
5 </h6> 6 </h6>
6 <div v-if="editState" class="ml-auto mr-auto mt-4 w-95"> 7 <div v-if="editState" class="ml-auto mr-auto mt-4 w-95">
7 <div class="d-flex flex-row input-group mb-4"> 8 <div class="d-flex flex-row input-group mb-4">
8 <div class="offset-r"> 9 <div class="offset-r">
9 <label for="bottleneck" class="label-text" id="bottlenecklabel">Bottleneck</label> 10 <label for="bottleneck" class="label-text" id="bottlenecklabel">Bottleneck</label>
33 > 34 >
34 <div class="offset-r"> 35 <div class="offset-r">
35 <label class="label-text w-100 depthreferencelabel" for="depthreference">Depthreference</label> 36 <label class="label-text w-100 depthreferencelabel" for="depthreference">Depthreference</label>
36 </div> 37 </div>
37 <select v-model="depthReference" class="custom-select" id="depthreference"> 38 <select v-model="depthReference" class="custom-select" id="depthreference">
38 <option v-for="option in this.$options.depthReferenceOptions" :key="option">{{option}}</option> 39 <option v-for="option in this.$options.depthReferenceOptions" :key="option">{{ option }}</option>
39 </select> 40 </select>
40 </div> 41 </div>
41 <div class="text-left"> 42 <div class="text-left">
42 <small v-for="(message, index) in messages" :key="index">{{message}}</small> 43 <small v-for="(message, index) in messages" :key="index">
44 {{
45 message
46 }}
47 </small>
43 </div> 48 </div>
44 </div> 49 </div>
45 <div class="w-95 ml-auto mr-auto mt-4 mb-4"> 50 <div class="w-95 ml-auto mr-auto mt-4 mb-4">
46 <div v-if="uploadState" class="d-flex flex-row input-group mb-4"> 51 <div v-if="uploadState" class="d-flex flex-row input-group mb-4">
47 <div class="custom-file"> 52 <div class="custom-file">
48 <input type="file" @change="fileSelected" class="custom-file-input" id="uploadFile"> 53 <input
49 <label class="custom-file-label" for="uploadFile">{{uploadLabel}}</label> 54 accept=".zip"
55 type="file"
56 @change="fileSelected"
57 class="custom-file-input"
58 id="uploadFile"
59 >
60 <label class="custom-file-label" for="uploadFile">
61 {{
62 uploadLabel
63 }}
64 </label>
50 </div> 65 </div>
51 </div> 66 </div>
52 <div class="buttons text-right"> 67 <div class="buttons text-right">
53 <a 68 <a
54 v-if="editState" 69 v-if="editState"
55 download="meta.json" 70 download="meta.json"
56 :href="dataLink " 71 :href="dataLink"
57 class="btn btn-outline-info pull-left" 72 class="btn btn-outline-info pull-left"
58 >Download Meta.json</a> 73 >Download Meta.json</a>
59 <button 74 <button
60 v-if="editState" 75 v-if="editState"
61 @click="deleteTempData" 76 @click="deleteTempData"
65 <button 80 <button
66 :disabled="disableUpload" 81 :disabled="disableUpload"
67 @click="submit" 82 @click="submit"
68 class="btn btn-info" 83 class="btn btn-info"
69 type="button" 84 type="button"
70 >{{uploadState?"Upload":"Confirm"}}</button> 85 >{{ uploadState ? "Upload" : "Confirm" }}</button>
71 </div> 86 </div>
72 </div> 87 </div>
73 </div> 88 </div>
74 </template> 89 </template>
75 90
97 112
98 export default { 113 export default {
99 name: "imports", 114 name: "imports",
100 data() { 115 data() {
101 return { 116 return {
117 availableBottlenecks: "",
102 importState: IMPORTSTATE.UPLOAD, 118 importState: IMPORTSTATE.UPLOAD,
103 depthReference: "", 119 depthReference: "",
104 bottleneck: "", 120 bottleneck: "",
105 importDate: "", 121 importDate: "",
106 uploadLabel: defaultLabel, 122 uploadLabel: defaultLabel,
161 "X-Gemma-Auth": localStorage.getItem("token"), 177 "X-Gemma-Auth": localStorage.getItem("token"),
162 "Content-Type": "multipart/form-data" 178 "Content-Type": "multipart/form-data"
163 } 179 }
164 }) 180 })
165 .then(response => { 181 .then(response => {
166 const { bottleneck, date } = response.data.meta; 182 if (response.data.meta) {
167 const depthReference = response.data.meta["depth-reference"]; 183 const { bottleneck, date } = response.data.meta;
184 const depthReference = response.data.meta["depth-reference"];
185 this.bottleneck = bottleneck;
186 this.depthReference = depthReference;
187 this.importDate = new Date(date).toISOString().split("T")[0];
188 }
168 this.importState = IMPORTSTATE.EDIT; 189 this.importState = IMPORTSTATE.EDIT;
169 this.bottleneck = bottleneck;
170 this.depthReference = depthReference;
171 this.importDate = new Date(date).toISOString().split("T")[0];
172 this.token = response.data.token; 190 this.token = response.data.token;
173 this.messages = response.data.messages; 191 this.messages = response.data.messages;
174 }) 192 })
175 .catch(error => { 193 .catch(error => {
176 const { status, data } = error.response; 194 const { status, data } = error.response;