Mercurial > gemma
changeset 1161:e15850b3a9d1
feat: import of sounding results upload
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Tue, 13 Nov 2018 17:22:16 +0100 |
parents | f498494fceb5 |
children | fae17a9dee9e |
files | client/src/imports/Imports.vue |
diffstat | 1 files changed, 38 insertions(+), 4 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/imports/Imports.vue Tue Nov 13 14:44:20 2018 +0100 +++ b/client/src/imports/Imports.vue Tue Nov 13 17:22:16 2018 +0100 @@ -55,9 +55,9 @@ type="file" @change="fileSelected" class="custom-file-input" - id="inputGroupFile04" + id="uploadFile" > - <label class="custom-file-label" for="inputGroupFile04">{{uploadLabel}}</label> + <label class="custom-file-label" for="uploadFile">{{uploadLabel}}</label> </div> </div> <div class="downloadbtn"> @@ -66,7 +66,12 @@ :href="dataLink " class="btn btn-outline-info" >Generate Meta.json</a> - <button class="btn btn-info" type="button">Upload!</button> + <button + :disabled="disableUpload" + @click="submitUpload" + class="btn btn-info" + type="button" + >Upload!</button> </div> </div> </div> @@ -75,6 +80,9 @@ </template> <script> +import { HTTP } from "../application/lib/http"; +import { displayError, displayInfo } from "../application/lib/errors.js"; + const defaultLabel = "Choose file"; export default { @@ -84,7 +92,9 @@ depthReference: "", bottleneck: "", importDate: "", - uploadLabel: defaultLabel + uploadLabel: defaultLabel, + uploadFile: null, + disableUpload: false }; }, methods: { @@ -92,6 +102,30 @@ const files = e.target.files || e.dataTransfer.files; if (!files) return; this.uploadLabel = files[0].name; + this.uploadFile = files[0]; + }, + submitUpload() { + if (!this.uploadFile || this.disableUpload) return; + let formData = new FormData(); + formData.append("files[0]", this.uploadFile); + HTTP.post("/imports/soundingresult", formData, { + headers: { + "X-Gemma-Auth": localStorage.getItem("token"), + "Content-Type": "multipart/form-data" + } + }) + .then(() => { + displayInfo({ + title: "Import success" + }); + }) + .catch(error => { + const { status, data } = error.response; + displayError({ + title: "Backend Error", + message: `${status}: ${data.message || data}` + }); + }); } }, computed: {