diff --git a/src/views/feature_type/Feature_type_detail.vue b/src/views/feature_type/Feature_type_detail.vue index bbe2af3ccb9e608e130023ab4f9f274241188ea9..acd5e177d096c2cd038dabee60feba326008cb04 100644 --- a/src/views/feature_type/Feature_type_detail.vue +++ b/src/views/feature_type/Feature_type_detail.vue @@ -228,7 +228,6 @@ export default { if (this.filenameToImport.size > 0){ var formData = new FormData(); formData.append("json_file", this.filenameToImport); - console.log(formData) let url = process.env.VUE_APP_URL_BASE + 'projet/' + this.$route.params.slug + '/type-signalement/'+this.$route.params.feature_type_slug + '/importer-geojson/' ; axios.post(url, formData, { headers: { 'Content-Type': 'multipart/form-data' @@ -237,7 +236,7 @@ export default { .then((response) => { if (response.status == 200){ this.getImports() - // TODO: RELOAD DERNIER SIGNALEMENTS + // TODO : RELOAD DERNIER SIGNALEMENTS } }) .catch(err => { diff --git a/src/views/project/Project_detail.vue b/src/views/project/Project_detail.vue index 0de08830d0d86586782cd0aeb68c9f26583d2fbc..5c4ae9d2378e5da94bfef10aa4885f5f890ee036 100644 --- a/src/views/project/Project_detail.vue +++ b/src/views/project/Project_detail.vue @@ -150,7 +150,7 @@ <router-link :to="{ name: 'editer-type-signalement', - params: { slug_type_signal: type.title }, + params: { slug_type_signal: type.slug }, }" v-if="project" class=" @@ -176,25 +176,60 @@ </div> </div> <!-- // todo: gérer permissions: {% if project and permissions|lookup:'can_update_project' %} --> - <router-link - :to="{ - name: 'ajouter-type-signalement', - params: { slug: project.slug }, - }" - class="ui compact basic button button-hover-green" - > - <i class="ui plus icon"></i>Créer un nouveau type de signalement - </router-link> - </div> - <div class="seven wide column"> - <router-link - :to="{ name: 'liste-signalements', params: { slug: project.slug } }" - class="item" - > - <div id="map"></div> - </router-link> + <div class="nouveau-type-signalement"> + <router-link + :to="{ + name: 'ajouter-type-signalement', + params: { slug: project.slug }, + }" + class="ui compact basic button button-hover-green" + > + <i class="ui plus icon"></i>Créer un nouveau type de signalement + </router-link> + </div> + <div class="nouveau-type-signalement"> + <div + class="ui compact basic button button-hover-green" + > + <div + onclick="document.getElementById('json_file').click()" + > + <label + class="ui " + for="json_file" + > + <i class="ui plus icon"></i> + <span class="label">Créer un nouveau type de signalement avec un geojson</span> + </label> + <input + type="file" + accept="application/json, .json, .geojson" + style="display: none" + name="json_file" + id="json_file" + @change="onFileChange" + /> + </div> + </div> + <br> + <div id="button-import" v-if="filenameToImport.size>0"> + <button + :disabled="filenameToImport.size == 0" + @click="importGeoJson" class="ui fluid teal icon button"> + <i class="upload icon"></i> Lancer l'import avec le fichier {{filenameToImport.name}} + </button> + </div> </div> </div> + <div class="seven wide column"> + <router-link + :to="{ name: 'liste-signalements', params: { slug: project.slug } }" + class="item" + > + <div id="map"></div> + </router-link> + </div> + </div> <div class="row"> <div class="fourteen wide column"> @@ -418,6 +453,7 @@ </template> <script> +import axios from 'axios'; import frag from "vue-frag"; import { mapGetters, mapState } from "vuex"; @@ -430,6 +466,7 @@ export default { data() { return { + filenameToImport: {name: '', size: 0}, slug: this.$route.params.slug, isModalOpen: false, is_suscriber: false, @@ -459,6 +496,37 @@ export default { }, methods: { + importGeoJson() { + if (this.filenameToImport.size > 0){ + var formData = new FormData(); + formData.append("json_file", this.filenameToImport); + let url = process.env.VUE_APP_URL_BASE + 'projet/' + this.$route.params.slug + '/importer-geojson/' ; + axios.post(url, formData, { headers: { + 'Content-Type': 'multipart/form-data' + } + }) + .then((response) => { + if (response.status == 200){ + console.log(response.data) + // TODO : Router :to="{ + // name: 'ajouter-type-signalement', + // params: { slug: project.slug }, + // }" + + } + }) + .catch(err => { + // TODO : HANDLER ERROR + console.log(err) + }); + } + }, + onFileChange(e) { + var files = e.target.files || e.dataTransfer.files; + if (!files.length) + return; + this.filenameToImport = files[0] + }, subsribeProject() { console.log("Subsribe to project"); }, @@ -483,4 +551,11 @@ export default { float: right; margin: 0 0 0 1em; } +.nouveau-type-signalement{ + padding-top: 1em; +} + +#button-import{ + padding-top: 0.5em; +} </style> \ No newline at end of file