add material selection

cateditor/src/components/CatalogContents.vue

@@ -101,6 +101,7 @@
             <div v-for="item in selectedMaterials" :key="item.id">
               <v-hover :key="item.id">
                 <v-list-tile
+                  @click="selectMaterial(item.id)"
                   slot-scope="{ hover }"
                   :class="materialListItemClasses(item.id, hover)"
                 >
@@ -179,12 +180,14 @@ export default {
       'materials',
       'selectedSectionID',
       'selectedModelID',
+      'selectedMaterialID',
     ]),
     ...mapGetters([
       'section',
       'sections',
       'selectedSection',
       'selectedModel',
+      'selectedMaterial',
       'sectionModels',
       'modelMaterials',
       'material',
@@ -231,7 +234,9 @@ export default {
     },
 
     materialListItemClasses(id, hovering) {
-      if (hovering) {
+      if (id === this.selectedMaterialID) {
+        return 'list-item primary'
+      } else if (hovering) {
         return 'list-item grey lighten-4'
       } else {
         return 'list-item'
@@ -274,6 +279,7 @@ export default {
     ...mapActions([
       'selectSection',
       'selectModel',
+      'selectMaterial',
       'reorderSection',
       'setSectionPages',
       'setModelMaterials',

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

@@ -12,7 +12,7 @@ export const store = new Vuex.Store({
     materials: {},
     selectedSectionID: null,
     selectedModelID: null,
-    selectedMaterial: null,
+    selectedMaterialID: null,
     loadingCatalog: false,
     savingCatalog: false,
     loadingProducts: false,
@@ -100,6 +100,10 @@ export const store = new Vuex.Store({
       return []
     },
 
+    selectedMaterial: (state, getters) => (id) => {
+      return getters.material(id)
+    },
+
     /// OLD STUFF
     //
     // catalog info
@@ -181,6 +185,10 @@ export const store = new Vuex.Store({
       state.selectedModelID = id
     },
 
+    selectMaterial(state, id) {
+      state.selectedMaterialID = id
+    },
+
     //
     // manipulation
     //
@@ -293,6 +301,10 @@ export const store = new Vuex.Store({
       context.commit('selectModel', id)
     },
 
+    selectMaterial(context, id) {
+      context.commit('selectMaterial', id)
+    },
+
     //
     // manipulation
     //