WIP hooking to backend

Author: supalarry

frontend/src/components/app/onboarding/MainAndSecondaryImagesUpload.vue

@@ -42,24 +42,23 @@ export default {
         this.bus.$emit('clearForNextImage');
         this.imageIndex += 1;
       } else {
-        this.$emit('saveInput', this.slide.key, this.imagesUploaded);
+        this.$emit('nextSlide');
         this.sendImagesToBackend();
       }
     },
     async sendImagesToBackend() {
-      try {
-        for (let i = 0; i < this.imagesUploaded.length; i += 1) {
+      for (let i = 0; i < this.imagesUploaded.length; i += 1) {
+        try {
           const formData = new FormData();
+          formData.append('file[]', this.imagesUploaded[i].content);
           if (i === 0) {
-            formData.append('ProfileImage', this.imagesUploaded[i].content);
             await this.$http.post('/profile/images?is_primary=true', formData);
           } else {
-            formData.append('ExtraImage', this.imagesUploaded[i].content);
             await this.$http.post('/profile/images?is_primary=false', formData);
           }
+        } catch (error) {
+          console.log(error);
         }
-      } catch (error) {
-        console.log(error);
       }
     },
   },

frontend/src/plugins/http.js

@@ -1,16 +1,14 @@
 /* eslint-disable prefer-arrow-callback */
 /* eslint-disable func-names */
 /* eslint-disable no-param-reassign */
-/* eslint-disable max-len */
 
 import Axios from 'axios';
 import Vue from 'vue';
 import { getAccessToken, getRefreshToken, handleAccessTokenExpiration } from '../auth/tokens';
 
 Axios.defaults.baseURL = process.env.VUE_APP_BACKEND_BASE_URL;
-Axios.defaults.headers.common['Access-Control-Allow-Origin'] = '*';
-Axios.defaults.headers.common['Access-Control-Allow-Methods'] = 'DELETE, POST, GET, OPTIONS';
-/* Axios.defaults.headers.common['Access-Control-Allow-Headers'] = 'Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With'; */
+Axios.defaults.headers.common['Content-Type'] = 'application/json';
+Axios.defaults.headers.common.Accept = 'application/json';
 
 Axios.interceptors.request.use(async function (config) {
   if (config.url === '/auth/refresh' || config.url === '/auth/refresh_revoke') {
@@ -25,6 +23,9 @@ Axios.interceptors.request.use(async function (config) {
       return { headers: {}, method: config.method, url: '' };
     }
   }
+  if (config.url.search('/profile/images') !== -1) {
+    config.headers['Content-Type'] = 'multipart/form-data';
+  }
   return config;
 }, function (error) {
   return Promise.reject(error);

frontend/src/views/app/Onboarding.vue

@@ -67,7 +67,7 @@
       secondaryImageExplanation: 'Extra image',
       maxImagesAllowed: 5,
       buttonText}"
-      v-on:saveInput="saveInput"
+      v-on:nextSlide="nextSlide"
       v-if="slideCurrent === 5"></MainAndSecondaryImagesUpload>
     <Textblock
       v-bind:slide="{
@@ -110,10 +110,7 @@ export default {
       if (key === 'birthdate') {
         value = this.formatBirthdate(value);
       }
-      if (key !== 'images') {
-        this.userData[key] = value;
-      }
-      console.log(this.userData);
+      this.userData[key] = value;
       this.nextSlide();
     },
     nextSlide() {