diff --git a/src/assets/js/utils.js b/src/assets/js/utils.js
new file mode 100644
index 0000000000000000000000000000000000000000..53bcc6106352aeb538f6af7819f85f7dd3f282ef
--- /dev/null
+++ b/src/assets/js/utils.js
@@ -0,0 +1,13 @@
+export function fileConvertSize(aSize){
+ aSize = Math.abs(parseInt(aSize, 10));
+ const def = [[1, 'octets', 0], [1024, 'ko', 0], [1024*1024, 'Mo', 1], [1024*1024*1024, 'Go', 2], [1024*1024*1024*1024, 'To', 2]];
+ for (let i=0; i<def.length; i++) {
+ if (aSize<def[i][0]) return (aSize/def[i-1][0]).toFixed(def[i-1][2]) + ' ' + def[i-1][1];
+ }
+}
+
+export function fileConvertSizeToMo(aSize){
+ aSize = Math.abs(parseInt(aSize, 10));
+ const def = [1024*1024, 'Mo', 1];
+ return (aSize/def[0]).toFixed(def[2]);
+}
diff --git a/src/components/map-layers/SidebarLayers.vue b/src/components/map-layers/SidebarLayers.vue
index 950f41b95854e32a2bdaae7099eaacbb6d5701c4..2988e4e103eac542a17d83b7cb30233f9a7d1b85 100644
--- a/src/components/map-layers/SidebarLayers.vue
+++ b/src/components/map-layers/SidebarLayers.vue
@@ -156,7 +156,6 @@ export default {
},
updateOpacity(event, layer) {
- console.log(event.target.value, layer);
mapUtil.updateOpacity(layer.id, event.target.value);
layer.opacity = event.target.value;
},
@@ -166,7 +165,6 @@ export default {
},
onQueryLayerChange(layer) {
- console.log(layer);
this.selectedQueryLayer = layer.name;
},
@@ -175,8 +173,7 @@ export default {
return queryableLayer.length > 0;
},
- onlayerMove(event) {
- console.log(event);
+ onlayerMove() {
// Get the names of the current layers in order.
const currentLayersNamesInOrder = Array.from(
document.getElementsByClassName("layer-item transition visible")
@@ -200,7 +197,6 @@ export default {
});
document.dispatchEvent(eventOrder);
// Save the basemaps options into the localstorage
- console.log(this.baseMaps);
this.setLocalstorageMapOptions(this.baseMaps);
},
@@ -307,7 +303,6 @@ export default {
addLayers(baseMap) {
baseMap.layers.forEach((layer) => {
var layerOptions = this.availableLayers.find((l) => l.id === layer.id);
- console.log(layerOptions);
layer = Object.assign(layer, layerOptions);
layer.options.basemapId = baseMap.id;
});
diff --git a/src/views/feature/Feature_detail.vue b/src/views/feature/Feature_detail.vue
index 86b2dfc155475b6b866f3b7ffb046a975ca13113..e5a8eb37067bae2351240c004e8af5a904ed48ee 100644
--- a/src/views/feature/Feature_detail.vue
+++ b/src/views/feature/Feature_detail.vue
@@ -718,7 +718,7 @@ export default {
};
</script>
-<style>
+<style scoped>
#map {
width: 100%;
height: 100%;
diff --git a/src/views/feature/Feature_edit.vue b/src/views/feature/Feature_edit.vue
index 769d558c2ab5d454b3bf1464a5b8832c25b0b960..183929cbf0ff5a4c567a724442353ceb5440fdd1 100644
--- a/src/views/feature/Feature_edit.vue
+++ b/src/views/feature/Feature_edit.vue
@@ -1050,7 +1050,7 @@ export default {
};
</script>
-<style>
+<style scoped>
#map {
height: 70vh;
width: 100%;
diff --git a/src/views/feature_type/Feature_type_detail.vue b/src/views/feature_type/Feature_type_detail.vue
index 795b704925fb5f4fa0793b52396e4af197200273..7e74e6aa5c6e973acefe9d8666909a179f229c36 100644
--- a/src/views/feature_type/Feature_type_detail.vue
+++ b/src/views/feature_type/Feature_type_detail.vue
@@ -66,7 +66,11 @@
Importer des signalements
</div>
<div :class="['content', { active: showImport }]">
- <div id="form-import-features" class="ui form">
+ <div
+ id="form-import-features"
+ class="ui form"
+ :class="loadingImportFile ? 'loading' : ''"
+ >
<div class="field">
<label class="ui icon button" for="json_file">
<i class="file icon"></i>
@@ -222,6 +226,8 @@ import { mapGetters, mapState } from "vuex";
import ImportTask from "@/components/ImportTask";
import featureAPI from "@/services/feature-api";
+import { fileConvertSizeToMo } from '@/assets/js/utils';
+
export default {
name: "Feature_type_detail",
components: {
@@ -237,6 +243,7 @@ export default {
},
showImport: false,
featuresLoading: true,
+ loadingImportFile: false
};
},
@@ -351,18 +358,31 @@ export default {
},
onFileChange(e) {
+ this.loadingImportFile = true;
const files = e.target.files || e.dataTransfer.files;
- if (!files.length) return;
+ if (!files.length) {
+ this.loadingImportFile = false;
+ return;
+ }
let reader = new FileReader();
reader.addEventListener("load", (e) => {
- if (this.checkJsonValidity(JSON.parse(e.target.result))) {
+ // bypass json check for files larger then 10 Mo
+ let jsonValidity;
+ if (parseFloat(fileConvertSizeToMo(files[0])) <= 10) {
+ jsonValidity = this.checkJsonValidity(JSON.parse(e.target.result));
+ } else {
+ jsonValidity = true;
+ }
+
+ if (jsonValidity) {
this.fileToImport = files[0]; // todo : remove this value from state as it stored (first attempt didn't work)
this.$store.commit(
"feature_type/SET_FILE_TO_IMPORT",
this.fileToImport
);
}
+ this.loadingImportFile = false;
});
reader.readAsText(files[0]);
},
diff --git a/src/views/project/Project_detail.vue b/src/views/project/Project_detail.vue
index 4896111441784368797d30ca752faa0b2de367f6..f702da8c5137f7bc55f5a43b458f68a22c13e7da 100644
--- a/src/views/project/Project_detail.vue
+++ b/src/views/project/Project_detail.vue
@@ -561,6 +561,34 @@
</div>
</div>
</div>
+ <div
+ :class="isFileSizeModalOpen ? 'active' : ''"
+ class="ui dimmer"
+ >
+ <div
+ :class="isFileSizeModalOpen ? 'active' : ''"
+ class="ui modal tiny"
+ style="top: 20%"
+ >
+ <div class="header">
+ Fichier trop grand!
+ </div>
+ <div class="content">
+ <p>
+ Impossible de créer un type de signalement à partir d'un fichier GeoJSON
+ de plus de 10Mo (celui importé fait {{ fileSize }} Mo).
+ </p>
+ </div>
+ <div class="actions">
+ <div
+ class="ui button teal"
+ @click="closeFileSizeModal"
+ >
+ Fermer
+ </div>
+ </div>
+ </div>
+ </div>
</div>
</template>
@@ -573,6 +601,8 @@ import featureAPI from "@/services/feature-api";
import axios from "@/axios-client.js";
+import { fileConvertSizeToMo } from '@/assets/js/utils';
+
export default {
name: "Project_details",
@@ -608,7 +638,8 @@ export default {
tempMessage: null,
featureTypeLoading: true,
featureTypeImporting: false,
- featuresLoading: true
+ featuresLoading: true,
+ isFileSizeModalOpen: false
};
},
@@ -634,6 +665,9 @@ export default {
},
API_BASE_URL() {
return this.$store.state.configuration.VUE_APP_DJANGO_API_BASE;
+ },
+ fileSize() {
+ return fileConvertSizeToMo(this.fileToImport.size);
}
},
@@ -781,13 +815,13 @@ export default {
onFileChange(e) {
this.featureTypeImporting = true;
var files = e.target.files || e.dataTransfer.files;
- console.log(files);
if (!files.length) return;
this.fileToImport = files[0];
// TODO : VALIDATION IF FILE IS JSON
- if (this.fileToImport.size > 0) {
+ if (parseFloat(fileConvertSizeToMo(this.fileToImport.size)) > 10) {
+ this.isFileSizeModalOpen = true;
+ } else if (this.fileToImport.size > 0) {
const fr = new FileReader();
-
try {
fr.onload = (e) => {
this.geojsonImport = JSON.parse(e.target.result);
@@ -808,6 +842,12 @@ export default {
}
},
+ closeFileSizeModal() {
+ this.fileToImport = { name: "", size: 0 };
+ this.featureTypeImporting = false;
+ this.isFileSizeModalOpen = false;
+ },
+
subscribeProject() {
projectAPI
.subscribeProject({