Mercurial > gemma
changeset 2209:7ef7c3fd7383 pdf-export
import_waterwayprofiles: UI etd
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 06 Feb 2019 15:17:42 +0100 |
parents | 763c520a7717 |
children | 0cae90830be0 |
files | client/src/components/ImportWaterwayProfiles.vue |
diffstat | 1 files changed, 99 insertions(+), 8 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/ImportWaterwayProfiles.vue Wed Feb 06 11:20:23 2019 +0100 +++ b/client/src/components/ImportWaterwayProfiles.vue Wed Feb 06 15:17:42 2019 +0100 @@ -10,11 +10,70 @@ </h6> <div class="card-body stretches-card"> <div class="w-95 ml-auto mr-auto mt-4 mb-4"> - <div class="d-flex flex-row input-group mb-4"> - <div class="flex-column w-100"> + <div class="mb-4"> + <div class="d-flex flex-row"> + <div class="flex-column w-100"> + <div class="flex-row text-left"> + <small class="text-muted"> <translate>URL</translate> </small> + </div> + <div class="w-100"> + <input class="form-control" type="url" v-model="url" /> + </div> + </div> + </div> + <div v-if="!url" class="d-flex flex-row"> + <small + ><translate class="text-danger" + >Please enter a URL</translate + ></small + > + </div> + <div class="d-flex flex-row"> + <div class="flex-column mt-3 mr-3 w-50"> + <div class="flex-row text-left"> + <small class="text-muted"> + <translate>Featuretype</translate> + </small> + </div> + <div class="w-100"> + <input + class="form-control" + type="text" + v-model="featureType" + /> + </div> + <div v-if="!featureType" class="d-flex flex-row"> + <small + ><translate class="text-danger" + >Please enter a Featuretype</translate + ></small + > + </div> + </div> + <div class="flex-column mt-3 w-50"> + <div class="flex-row text-left"> + <small class="text-muted"> + <translate>SortBy</translate> + </small> + </div> + <div class="w-100"> + <input class="form-control" type="text" v-model="sortBy" /> + </div> + <div v-if="!sortBy" class="d-flex flex-row"> + <small + ><translate class="text-danger" + >Please enter SortBy</translate + ></small + > + </div> + </div> + </div> + </div> + <div class="d-flex flex-row text-left"> + <div class="mt-3 mb-3 flex-column w-100"> <div class="custom-file"> <input - accept=".zip" + accept=".csv" type="file" @change="fileSelected" class="custom-file-input" @@ -62,12 +121,16 @@ * Thomas Junk <thomas.junk@intevation.de> */ -import { displayInfo } from "@/lib/errors.js"; +import { displayError, displayInfo } from "@/lib/errors.js"; +import { HTTP } from "@/lib/http"; export default { name: "importwaterwayprofiles", data() { return { + url: "", + sortBy: "hydro_scamin", + featureType: "ws-wamos:ienc_wtwprf", disableUploadButton: false, uploadLabel: this.$gettext("choose file to upload"), uploadFile: null @@ -81,10 +144,38 @@ this.uploadFile = files[0]; }, submit() { - displayInfo({ - title: this.$gettext("Import"), - message: this.$gettext("under construction") - }); + if (!this.url || !this.featureType || !this.sortBy || !this.uploadFile) + return; + let formData = new FormData(); + formData.append("wp", this.uploadFile); + formData.append("url", this.url); + formData.append("feature-type", this.featureType); + formData.append("sort-by", this.sortBy); + HTTP.post("/imports/wp", formData, { + headers: { + "X-Gemma-Auth": localStorage.getItem("token"), + "Content-Type": "multipart/form-data" + } + }) + .then(() => { + displayInfo({ + title: this.$gettext("Import"), + message: this.$gettext( + this.uploadLabel + this.$gettext(" was successfully uploaded.") + ) + }); + this.url = ""; + this.uploadFile = null; + this.uploadLabel = this.$gettext("choose file to upload"); + }) + .catch(error => { + const { status, data } = error.response; + const messages = data.messages ? data.messages.join(", ") : ""; + displayError({ + title: this.$gettext("Backend Error"), + message: `${status}: ${messages}` + }); + }); } }, components: {