From 01b63128477c3ac5fce41a51f7a946decb688d8b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Timoth=C3=A9e=20Poussard?= <tpoussard@neogeo.fr>
Date: Wed, 22 Sep 2021 11:14:31 +0200
Subject: [PATCH] Import attachment file
---
.../feature/FeatureAttachmentForm.vue | 38 ++++++++++++-------
src/store/modules/feature.js | 34 ++++++++++++-----
2 files changed, 49 insertions(+), 23 deletions(-)
diff --git a/src/components/feature/FeatureAttachmentForm.vue b/src/components/feature/FeatureAttachmentForm.vue
index 89d15280..898bb52d 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 10858ac1..9dc5cd4c 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;
--
GitLab