Merge branch 'develop' into redmine-issues/11850

nginx.conf

@@ -44,7 +44,7 @@ server {
     location / {
         root /usr/share/nginx/html;
         index index.html;
-        try_files $uri$args $uri/ /index.html;
+        try_files $uri $uri/ /index.html;
     }
    
 

src/views/feature_type/Feature_type_detail.vue

@@ -86,6 +86,8 @@
               />
             </div>
           </div>
+        </div>
+        <div class="ui styled accordion">
           <div
             @click="toggleShowImport"
             :class="['title', { active: !showImport }]"

src/views/project/Project_detail.vue

@@ -212,6 +212,7 @@
           </div>
           <div class="nouveau-type-signalement">
             <a
+              v-if="permissions && permissions.can_update_project"
               class="
                 ui
                 compact

src/views/project/Project_edit.vue

 <template>
   <div class="fourteen wide column">
+    <div
+      :class="{active: loading}"
+      class="ui inverted dimmer"
+    >
+      <div class="ui text loader">
+        Projet en cours de création. Vous allez être redirigé.
+      </div>
+    </div>
     <form id="form-project-edit" class="ui form">
       <h1>
         <span v-if="action === 'edit'"
@@ -206,6 +214,7 @@ export default {
 
   data() {
     return {
+      loading: false,
       action: "create",
       levelPermissions: [
         { name: "Utilisateur anonyme", value: "anonymous" },
@@ -276,17 +285,44 @@ export default {
       return filename + "." + ext;
     },
 
+    validateImgFile(files, handleFile) {
+      let url = window.URL || window.webkitURL;
+      let image = new Image();
+      image.onload = function () {
+        handleFile(true);
+      };
+      image.onerror = function () {
+        handleFile(false);
+      };
+      image.src = url.createObjectURL(files);
+      URL.revokeObjectURL(image.src);
+    },
+
     onFileChange(e) {
       // * read image file
       const files = e.target.files || e.dataTransfer.files;
-      if (!files.length) return; //* abort if no file
-      this.fileToImport = files[0]; //* stock the file to post later
-      let reader = new FileReader(); //* read the file to display in the page
-      let _this = this; //* 'this' is different in onload function
-      reader.onload = function (e) {
-        _this.thumbnailFileSrc = e.target.result;
-      };
-      reader.readAsDataURL(this.fileToImport);
+
+      const _this = this; //* 'this' is different in onload function
+      function handleFile(isValid) {
+        if (isValid) {
+          _this.fileToImport = files[0]; //* store the file to post later
+          let reader = new FileReader(); //* read the file to display in the page
+          reader.onload = function (e) {
+            _this.thumbnailFileSrc = e.target.result;
+          };
+          reader.readAsDataURL(_this.fileToImport);
+          _this.errorThumbnail = [];
+        } else {
+          _this.errorThumbnail.push(
+            "Transférez une image valide. Le fichier que vous avez transféré n'est pas une image, ou il est corrompu."
+          );
+        }
+      }
+
+      if (files.length) {
+        //* check if file is an image and pass callback to handle file
+        this.validateImgFile(files[0], handleFile);
+      }
     },
 
     checkEmpty() {
@@ -310,31 +346,33 @@ export default {
 
     postProjectThumbnail(projectSlug) {
       //* send img to the backend when feature_type is created
-      let formData = new FormData();
-      formData.append("file", this.fileToImport);
-      const url =
-        this.$store.state.configuration.VUE_APP_DJANGO_API_BASE +
-        "projects/" +
-        projectSlug +
-        "/thumbnail/";
-      return axios
-        .put(url, formData, {
-          headers: {
-            "Content-Type": "multipart/form-data",
-          },
-        })
-        .then((response) => {
-          if (response && response.status === 200) {
-            this.goBackNrefresh(projectSlug);
-          }
-        })
-        .catch((error) => {
-          let err_msg =
-            "Transférez une image valide. Le fichier que vous avez transféré n'est pas une image, ou il est corrompu.";
-          if (error.response.data[0]) err_msg = error.response.data[0];
-          this.errorThumbnail.push(err_msg);
-          throw error;
-        });
+      if (this.isValidImage(this.fileToImport)) {
+        let formData = new FormData();
+        formData.append("file", this.fileToImport);
+        const url =
+          this.$store.state.configuration.VUE_APP_DJANGO_API_BASE +
+          "projects/" +
+          projectSlug +
+          "/thumbnail/";
+        return axios
+          .put(url, formData, {
+            headers: {
+              "Content-Type": "multipart/form-data",
+            },
+          })
+          .then((response) => {
+            if (response && response.status === 200) {
+              this.goBackNrefresh(projectSlug);
+            }
+          })
+          .catch((error) => {
+            let err_msg =
+              "Transférez une image valide. Le fichier que vous avez transféré n'est pas une image, ou il est corrompu.";
+            if (error.response.data[0]) err_msg = error.response.data[0];
+            this.errorThumbnail.push(err_msg);
+            throw error;
+          });
+      }
     },
 
     checkForm() {
@@ -376,6 +414,7 @@ export default {
       };
 
       if (this.action === "create" || this.action === "duplicate") {
+        this.loading = true;
         await axios
           .post(
             `${this.$store.state.configuration.VUE_APP_DJANGO_API_BASE}projects/`,
@@ -390,11 +429,13 @@ export default {
                 this.goBackNrefresh(response.data.slug);
               }
             }
+            this.loading = false;
           })
           .catch((error) => {
             if (error.response.data.title[0]) {
               this.errors.title.push(error.response.data.title[0]);
             }
+            this.loading = false;
             throw error;
           });
       } else if (this.action === "edit") {