big pagination update - split models into pages

cateditor/src/pages/editor/store/index.js

@@ -2,7 +2,7 @@ import Vue from 'vue'
 import Vuex from 'vuex'
 import arrayMove from 'array-move'
 import axios from 'axios'
-import { paginateModels, sectionTitle, extendModelFromMaterial } from '@/pagination'
+import { modelsFromSection, paginateModels, sectionTitle, extendModelFromMaterial } from '@/pagination'
 
 Vue.use(Vuex)
 
@@ -47,35 +47,25 @@ export const store = new Vuex.Store({
     },
 
     selectedModel: (state, getters) => {
-      if (state.catalog && state.selectedModelID) {
+      if (state.selectedModelID) {
         let section = getters.selectedSection
-        let models = getters.sectionModels(section)
-        return models.find(s => s.model === state.selectedModelID)
+        return getters.sectionModel(section, state.selectedModelID)
       } else {
         return null
       }
     },
 
+    // find a model within a section
+    // NOTE: returns copies of the original catalog data
+    sectionModel: (state, getters) => (section, model) => {
+      let modelID = (typeof model === 'object') ? model.model : model
+      let models = getters.sectionModels(section)
+      return models.find(m => m.model === modelID)
+    },
+
+    // NOTE: returns copies of the original catalog data
     sectionModels: (state, getters) => (section) => {
-      // remove pages, return models (blocks) in order
-      let models = []
-      if (section && section.pages) {
-        for (let page of section.pages) {
-          for (let model of page) {
-            if (model.ids && model.ids.length > 0) {
-              // add extra info from a material
-              let material = getters.material(model.ids[0])
-              if (material) {
-                model = extendModelFromMaterial(material, model)
-              } else {
-                console.log('no material found for id', model.ids[0])
-              }
-              models.push(model)
-            }
-          }
-        }
-      }
-      return models
+      return modelsFromSection(section, getters)
     },
 
     modelMaterials: (state, getters) => (model) => {
@@ -150,6 +140,7 @@ export const store = new Vuex.Store({
       section.name = name
     },
 
+    // move a section in the section list
     reorderSection(state, { from, to }) {
       if (from === to) return
       state.catalog.sections = arrayMove(state.catalog.sections, from, to)
@@ -157,7 +148,13 @@ export const store = new Vuex.Store({
 
     setSectionPages(state, { section, pages }) {
       if (section) {
-        section.pages = pages
+        // update actual catalog data (we might be passed a copy)
+        let catSection = state.catalog.sections.find(s => s.id === section.id)
+        if (catSection) {
+          catSection.pages = pages
+        } else {
+          console.error('couldn\'t find catalog section', section.id)
+        }
       }
     },
 
@@ -165,12 +162,6 @@ export const store = new Vuex.Store({
       model.name = name
     },
 
-    setModelMaterials(state, { model, materials }) {
-      if (model) {
-        model.ids = materials.map(m => (typeof m === 'object') ? m.id : m)
-      }
-    },
-
     addMaterialsToLibrary(state, materials) {
       console.log('adding', materials.length, 'materials')
       let map = {}
@@ -247,10 +238,29 @@ export const store = new Vuex.Store({
       commit('setSectionName', payload)
     },
 
+    // move a section in the section list
     reorderSection({ commit }, payload) {
       commit('reorderSection', payload)
     },
 
+    // move a model in the section's model list
+    reorderModel({ commit, getters }, { section, fromIndex, toIndex }) {
+      let models = getters.sectionModels(section)
+      arrayMove.mutate(models, fromIndex, toIndex)
+      let pages = paginateModels(models)
+      commit('setSectionPages', { section: section, pages: pages })
+    },
+
+    // move a material in the models's material list
+    reorderMaterial({ commit, getters }, { section, model, fromIndex, toIndex }) {
+      let models = getters.sectionModels(section)
+      let updateModel = models.find(m => m.model === model.model)
+      updateModel.ids = model.ids
+      arrayMove.mutate(updateModel.ids, fromIndex, toIndex)
+      let pages = paginateModels(models)
+      commit('setSectionPages', { section: section, pages: pages })
+    },
+
     setSectionPages({ commit }, payload) {
       commit('setSectionPages', payload)
     },
@@ -266,10 +276,6 @@ export const store = new Vuex.Store({
       commit('setSectionPages', { section: section, pages: pages })
     },
 
-    setModelMaterials({ commit }, payload) {
-      commit('setModelMaterials', payload)
-    },
-
     moveModelToSection({ commit, getters }, { model, oldSection, newSection }) {
       // remove model from old section
       let oldModels = getters.sectionModels(oldSection)
@@ -295,15 +301,18 @@ export const store = new Vuex.Store({
       commit('setSectionPages', { section: newSection, pages: newPages })
     },
 
-    moveMaterialToSection({ commit, getters }, { material, oldModel, newSection }) {
+    moveMaterialToSection({ commit, getters }, { material, oldSection, oldModel, newSection }) {
       // ensure material, not just id
       if (typeof material === 'string' || typeof material === 'number') {
         material = getters.material(material)
       }
 
       // remove material from old model
-      let mats = oldModel.ids.filter(id => id !== material.id)
-      commit('setModelMaterials', { model: oldModel, materials: mats })
+      let oldModels = getters.sectionModels(oldSection)
+      let realOldModel = oldModels.find(m => m.model === oldModel.model)
+      realOldModel.ids = realOldModel.ids.filter(id => id !== material.id)
+      let oldPages = paginateModels(oldModels)
+      commit('setSectionPages', { section: oldSection, pages: oldPages })
 
       // add material to new section
       let newModels = getters.sectionModels(newSection)
@@ -338,12 +347,10 @@ export const store = new Vuex.Store({
         let models = getters.sectionModels(section)
         let existingModel = models.find(m => m.model === material.model)
         if (existingModel) {
-          // console.log('section', section.id, 'found existing model', existingModel)
           // NOTE prevent duplicates here, but also allow adding the same
           // id again to a catalog.  put in a new section so it can be
           // placed elsewhere?  handle later.
           let existingMaterial = existingModel.ids.find(m => m === material.id)
-          // console.log('model', existingModel.model, 'existing material', existingMaterial)
           foundSection = section
           foundModels = models
           if (!existingMaterial) {
@@ -386,13 +393,10 @@ export const store = new Vuex.Store({
       commit('setSectionPages', { section: foundSection, pages: pages })
     },
 
-    deleteModelMaterial({ commit, getters }, { section, model, material }) {
-      let mats = model.ids.filter(id => id !== material.id)
-
-      commit('setModelMaterials', { model: model, materials: mats })
-
-      // repaginate section
+    deleteModelMaterial({ commit, getters }, { section, material }) {
       let models = getters.sectionModels(section)
+      let catalogModel = models.find(m => m.model === material.model)
+      catalogModel.ids = catalogModel.ids.filter(id => id !== material.id)
       let pages = paginateModels(models)
       commit('setSectionPages', { section: section, pages: pages })
     },