add ModelDeleteDialog

cateditor/src/components/CatalogContents.vue

@@ -80,7 +80,7 @@
                       <v-btn icon @click.stop="popModelInfo(item.model)">
                         <v-icon small color="grey lighten-1">info</v-icon>
                       </v-btn>
-                      <v-btn icon @click.stop="popDelete(item.id)">
+                      <v-btn icon @click.stop="popModelDelete(item.model)">
                         <v-icon small color="grey lighten-1">delete</v-icon>
                       </v-btn>
                     </span>
@@ -134,6 +134,7 @@
     <SectionInfoDialog v-model="showSectionInfoDialog"/>
     <SectionDeleteDialog v-model="showSectionDeleteDialog"/>
     <ModelInfoDialog v-model="showModelInfoDialog"/>
+    <ModelDeleteDialog v-model="showModelDeleteDialog"/>
 
   </v-container>
 </template>
@@ -150,6 +151,7 @@ import AddSectionDialog from './AddSectionDialog'
 import SectionInfoDialog from './SectionInfoDialog'
 import SectionDeleteDialog from './SectionDeleteDialog'
 import ModelInfoDialog from './ModelInfoDialog'
+import ModelDeleteDialog from './ModelDeleteDialog'
 
 export default {
   components: {
@@ -159,6 +161,7 @@ export default {
     SectionInfoDialog,
     SectionDeleteDialog,
     ModelInfoDialog,
+    ModelDeleteDialog,
     //RawDisplayer,
   },
 
@@ -168,6 +171,7 @@ export default {
     showSectionInfoDialog: false,
     showSectionDeleteDialog: false,
     showModelInfoDialog: false,
+    showModelDeleteDialog: false,
   }),
   computed: {
     ...mapState([
@@ -262,6 +266,11 @@ export default {
       this.showModelInfoDialog = true
     },
 
+    popModelDelete(id) {
+      this.selectModel(id)
+      this.showModelDeleteDialog = true
+    },
+
     ...mapActions([
       'selectSection',
       'selectModel',

cateditor/src/components/ModelDeleteDialog.vue

@@ -0,0 +1,75 @@
+<template>
+  <v-layout row justify-center>
+    <v-dialog v-model="show" max-width="250">
+      <v-card>
+        <DialogHeading title="Remove Model">
+          <v-btn icon @click="show = false" class="ma-0 pa-0">
+            <v-icon color="white">clear</v-icon>
+          </v-btn>
+        </DialogHeading>
+
+        <v-card-text>
+          Really remove model from section?
+          <input class="subheading font-weight-medium mt-2" v-model="name"/>
+        </v-card-text>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn flat @click="show = false">Cancel</v-btn>
+          <v-btn color="primary" flat @click="doDelete()">OK</v-btn>
+          <v-spacer></v-spacer>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </v-layout>
+</template>
+
+<script>
+import DialogHeading from './DialogHeading'
+import { mapGetters, mapActions } from 'vuex'
+
+export default {
+  components: {
+    DialogHeading,
+  },
+  data: () => ({
+  }),
+  props: {
+    value: Boolean,
+  },
+  computed: {
+    show: {
+      get() {
+        return this.value
+      },
+      set(value) {
+        this.$emit('input', value)
+      }
+    },
+    name: {
+      get() {
+        let model = this.selectedModel()
+        return model ? model.name : '(none)'
+      }
+    }
+  },
+  methods: {
+    doDelete() {
+      this.deleteSectionModel({ section: this.selectedSection(),
+                                model: this.selectedModel() })
+      this.show = false
+    },
+    ...mapGetters([
+      'selectedSection',
+      'selectedModel',
+    ]),
+    ...mapActions([
+      'deleteSectionModel',
+    ]),
+  },
+}
+</script>
+
+<style>
+
+</style>

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

@@ -326,6 +326,13 @@ export const store = new Vuex.Store({
       commit('setModelName', payload)
     },
 
+    deleteSectionModel({ commit, getters }, { section, model }) {
+      let models = getters.sectionModels(section)
+      models = models.filter(m => m.model !== model.model)
+      let pages = paginateModels(models)
+      commit('setSectionPages', { section: section, pages: pages })
+    },
+
     setModelMaterials({ commit }, payload) {
       commit('setModelMaterials', payload)
     },