diff --git a/src/components/feature/FeatureAttachmentForm.vue b/src/components/feature/FeatureAttachmentForm.vue index 89d15280418ab341e4bbd3056ac461e6d4ab7398..898bb52d09377d47e3c42e4e7d035acce7ca5565 100644 --- a/src/components/feature/FeatureAttachmentForm.vue +++ b/src/components/feature/FeatureAttachmentForm.vue @@ -34,27 +34,24 @@ <div class="required field"> <label>Fichier (PDF, PNG, JPEG)</label> <!-- // todo : mettre en place la sélection de fichier --> - <label - @click="selectFile" - class="ui icon button" - :for="form.attachment_file.id_for_label" - > + <!-- @click="selectFile" --> + <label class="ui icon button" for="attachment_file"> <i class="file icon"></i> <span v-if="form.attachment_file.value" class="label">{{ form.attachment_file.value }}</span> - <span v-else class="label">Sélectionner un fichier ...</span> + <span v-else class="label">Sélectionner un fichier ... </span> </label> - <!-- // todo: récupérer la valeur :accept="IMAGE_FORMAT" --> - <!-- @change="processImgData" --> <input + @change="onFileChange" type="file" style="display: none" :name="form.attachment_file.html_name" - class="image_file" - :id="form.attachment_file.id_for_label" - @change="updateStore" + id="attachment_file" /> + + <!-- // todo: récupérer la valeur :accept="IMAGE_FORMAT" --> + <!-- @change="processImgData" --> {{ form.attachment_file.errors }} </div> </div> @@ -81,6 +78,7 @@ export default { data() { return { + fileToImport: null, form: { title: { errors: null, @@ -94,7 +92,6 @@ export default { }, attachment_file: { errors: null, - id_for_label: "titre", html_name: "titre", label: "Titre", value: "", @@ -116,9 +113,13 @@ export default { methods: { initForm(attachmentForm) { + console.log("initForm"); for (let el in attachmentForm) { if (el && this.form[el]) { - this.form[el].value = attachmentForm[el]; + this.form[el].value = + el === "attachment_file" + ? attachmentForm[el].split("/").pop() //* keep only the file name + : attachmentForm[el]; } } }, @@ -128,15 +129,24 @@ export default { this.attachmentForm.dataKey ); }, - selectFile() {}, updateStore() { this.$store.commit("feature/UPDATE_ATTACHMENT_FORM", { dataKey: this.attachmentForm.dataKey, title: this.form.title.value, attachment_file: this.form.attachment_file.value, info: this.form.info.value, + fileToImport: this.fileToImport, }); }, + onFileChange(e) { + const files = e.target.files || e.dataTransfer.files; + console.log(e, files); + if (!files.length) return; + this.fileToImport = files[0]; + this.form.attachment_file.value = files[0].name; + this.updateStore(); + //this.$store.commit("feature_type/SET_FILE_TO_IMPORT", this.fileToImport); + }, }, mounted() { diff --git a/src/store/modules/feature.js b/src/store/modules/feature.js index 10858ac1dab559f3a902f072d89a0e4b6cf367ee..9dc5cd4ca848a3bffec4be26d9de98a22cf2f3c9 100644 --- a/src/store/modules/feature.js +++ b/src/store/modules/feature.js @@ -58,9 +58,11 @@ const feature = { axios .get(`${this.state.configuration.VUE_APP_DJANGO_API_BASE}projects/${project_slug}/feature/`) .then((response) => { - const features = response.data.features; - commit("SET_FEATURES", features); - //dispatch("map/ADD_FEATURES", null, { root: true }); //todo: should check if map was initiated + if (response.status === 200 && response.data) { + const features = response.data.features; + commit("SET_FEATURES", features); + //dispatch("map/ADD_FEATURES", null, { root: true }); //todo: should check if map was initiated + } }) .catch((error) => { throw error; @@ -90,7 +92,9 @@ const feature = { axios .put(`${this.state.configuration.VUE_APP_DJANGO_API_BASE}features/${state.form.feature_id}/`, geojson) .then((response) => { - console.log(response, response.data) + if (response.status === 200 && response.data) { + console.log(response, response.data) + } }) .catch((error) => { throw error; @@ -99,8 +103,10 @@ const feature = { axios .post(`${this.state.configuration.VUE_APP_DJANGO_API_BASE}features/`, geojson) .then((response) => { - console.log(response, response.data) - dispatch("SEND_ATTACHMENTS", response.data.id) + if (response.status === 201 && response.data) { + console.log(response, response.data) + dispatch("SEND_ATTACHMENTS", response.data.id) + } }) .catch((error) => { throw error; @@ -109,11 +115,21 @@ const feature = { }, SEND_ATTACHMENTS({ state }, featureId) { - for (let attachment of state.attachmentFormset) { + for (let attacht of state.attachmentFormset) { + let formdata = new FormData(); + formdata.append("file", attacht.fileToImport, attacht.fileToImport.name); + const data = { + title: attacht.title, + info: attacht.info, + } + formdata.append("data", JSON.stringify(data)); axios - .post(`${this.state.configuration.VUE_APP_DJANGO_API_BASE}features/${featureId}/attachments/`, attachment) + .post(`${this.state.configuration.VUE_APP_DJANGO_API_BASE}features/${featureId}/attachments/`, formdata) .then((response) => { - console.log(response, response.data) + if (response.status === 200 && response.data) { + console.log(response, response.data) + return "La pièce jointe a bien été ajouté" + } }) .catch((error) => { throw error;