refactor, fix: split 'components/collections/saveRequest.vue' to 'editRequest', 'saveRequestAs'; fix saving bugs

store/postwoman.js

@@ -1,3 +1,5 @@
+import Vue from 'vue'
+
 export const SETTINGS_KEYS = [
     /**
      * The CSS class that should be applied to the root element.
@@ -42,14 +44,14 @@ export const SETTINGS_KEYS = [
 ];
 
 export const state = () => ({
-    settings: {},
-    collections: [{
-        name: 'My First Collection',
-        folders: [],
-        requests: [],
+    settings        : {},
+    collections     : [{
+        name     : 'My First Collection',
+        folders  : [],
+        requests : [],
     }],
-    selectedRequest: {},
-    editingRequest: {},
+    selectedRequest : {},
+    editingRequest  : {},
 });
 
 export const mutations = {
@@ -112,8 +114,7 @@ export const mutations = {
 
     editFolder (state, payload) {
         const { collectionIndex, folder, folderIndex } = payload;
-        state.collections[collectionIndex].folders[folderIndex] = folder;
-        state.collections[collectionIndex].folders = [...state.collections[collectionIndex].folders]  // mark updated
+        Vue.set(state.collections[collectionIndex].folders, folderIndex, folder)
     },
 
     removeFolder (state, payload) {
@@ -133,6 +134,67 @@ export const mutations = {
         state.collections[request.collection].folders[request.folder].requests.push(request);
     },
 
+    editRequest (state, payload) {
+        const {
+            requestOld,
+            requestOldCollectionIndex,
+            requestOldFolderIndex,
+            requestOldIndex,
+            requestNew,
+            requestNewCollectionIndex,
+            requestNewFolderIndex,
+        } = payload
+
+        const changedCollection = requestOldCollectionIndex !== requestNewCollectionIndex
+        const changedFolder     = requestOldFolderIndex     !== requestNewFolderIndex
+        const changedPlace      = changedCollection || changedFolder
+
+        // set new request
+        if (requestNewFolderIndex !== undefined)
+            Vue.set(state.collections[requestNewCollectionIndex].folders[requestNewFolderIndex].requests, requestOldIndex, requestNew)
+        else
+            Vue.set(state.collections[requestNewCollectionIndex].requests, requestOldIndex, requestNew)
+
+        // remove old request
+        if (changedPlace) {
+            if (requestOldFolderIndex !== undefined)
+                state.collections[requestOldCollectionIndex].folders[requestOldFolderIndex].requests.splice(requestOldIndex, 1)
+            else
+                state.collections[requestOldCollectionIndex].requests.splice(requestOldIndex, 1)
+        }
+    },
+
+    saveRequestAs (state, payload) {
+        const {
+            request,
+            collectionIndex,
+            folderIndex,
+            requestIndex,
+        } = payload
+
+        const specifiedCollection = collectionIndex !== undefined
+        const specifiedFolder     = folderIndex     !== undefined
+        const specifiedRequest    = requestIndex    !== undefined
+
+        if      (specifiedCollection && specifiedFolder && specifiedRequest)
+            Vue.set(state.collections[collectionIndex].folders[folderIndex].requests, requestIndex, request)
+        else if (specifiedCollection && specifiedFolder && !specifiedRequest) {
+            const requests         = state.collections[collectionIndex].folders[folderIndex].requests
+            const lastRequestIndex = requests.length - 1;
+            Vue.set(requests, lastRequestIndex + 1, request)
+        }
+        else if (specifiedCollection && !specifiedFolder && specifiedRequest) {
+            const requests         = state.collections[collectionIndex].requests
+            Vue.set(requests,requestIndex, request)
+        }
+        else if (specifiedCollection && !specifiedFolder && !specifiedRequest) {
+            const requests         = state.collections[collectionIndex].requests
+            const lastRequestIndex = requests.length - 1;
+            Vue.set(requests, lastRequestIndex + 1, request)
+        }
+
+    },
+
     saveRequest (state, payload) {
         const { request } = payload;
 
@@ -153,11 +215,11 @@ export const mutations = {
 
         // Request that is directly attached to collection
         if (request.folder === -1) {
-            state.collections[request.collection].requests[request.requestIndex] = request;
+            Vue.set(state.collections[request.collection].requests, request.requestIndex, request)
             return
         }
 
-        state.collections[request.collection].folders[request.folder].requests[request.requestIndex] = request;
+        Vue.set(state.collections[request.collection].folders[request.folder].requests, request.requestIndex, request)
     },
 
     removeRequest (state, payload) {
@@ -176,8 +238,4 @@ export const mutations = {
         state.selectedRequest = Object.assign({}, payload.request);
     },
 
-    editRequest (state, payload) {
-        state.editingRequest = Object.assign({}, payload.request);
-    },
-
 };