Removed event bus and switched to vuex. Implemented vue dropzone.

assets/js/store/index.js

@@ -2,13 +2,15 @@ import Vue from 'vue'
 import Vuex from 'vuex'
 import booksmodule from './modules/books';
 import bookprogressmodule from './modules/bookprogress';
+import filemodule from './modules/filemodule';
 
 Vue.use(Vuex)
 
 export default new Vuex.Store({
     modules:{
         booksmodule,
-        bookprogressmodule
+        bookprogressmodule,
+        filemodule
     }
 })
 

assets/js/store/modules/filemodule.js

@@ -0,0 +1,68 @@
+import FileApi from "../../api/file";
+import {
+    REMOVE_FILE_FROM_LIST,
+    FETCHING_FILES,
+    FETCHING_FILES_SUCCESS,
+    FETCHING_FILES_ERROR
+} from '../mutation-types.js'
+
+export default {
+    namespaced: true,
+    state: {
+        isLoading: false,
+        error: null,
+        files: []
+    },
+    getters: {
+        isLoading(state) {
+            return state.isLoading;
+        },
+        hasError(state) {
+            return state.error !== null;
+        },
+        error(state) {
+            return state.error;
+        }
+    },
+    mutations: {
+        [FETCHING_FILES](state) {
+            state.isLoading = true;
+            state.error = null;
+        },
+        [FETCHING_FILES_SUCCESS](state, files) {
+            state.isLoading = false;
+            state.error = null;
+            state.files = files;
+        },
+        [FETCHING_FILES_ERROR](state, error) {
+            state.isLoading = false;
+            state.error = error;
+            state.files = [];
+        },
+        [REMOVE_FILE_FROM_LIST](state, fileId) {
+
+            const index = state.files.findIndex(file => file.id === fileId);
+            state.files.splice(index, 1);
+        }
+    },
+    actions: {
+        async deleteFile({commit}, fileId) {
+            try {
+                await FileApi.deleteFile(fileId);
+                commit(REMOVE_FILE_FROM_LIST, fileId)
+            } catch (error) {
+                commit(FETCHING_FILES_ERROR, error);
+            }
+        },
+        async getFiles({commit}, bookId) {
+            commit(FETCHING_FILES);
+            try {
+                let response = await FileApi.getFiles(bookId);
+                commit(FETCHING_FILES_SUCCESS, response.data);
+                return response.data;
+            } catch (error) {
+                commit(FETCHING_FILES_ERROR, error);
+            }
+        },
+    }
+};

assets/js/store/mutation-types.js

@@ -3,5 +3,10 @@ export const
     UPDATING_PROGRESS_SUCCESS = "UPDATING_PROGRESS_SUCCESS",
     UPDATING_PROGRESS_ERROR = "UPDATING_PROGRESS_ERROR",
     TURN_ON_EDIT_MODE = "TURN_ON_EDIT_MODE",
-    TURN_OFF_EDIT_MODE = "TURN_OFF_EDIT_MODE"
+    TURN_OFF_EDIT_MODE = "TURN_OFF_EDIT_MODE",
+
+    FETCHING_FILES = "FETCHING_FILES",
+    FETCHING_FILES_SUCCESS = "FETCHING_FILES_SUCCESS",
+    FETCHING_FILES_ERROR = "FETCHING_FILES_ERROR",
+    REMOVE_FILE_FROM_LIST = "REMOVE_FILE_FROM_LIST"
 ;