add DragListHeading for cat contents

cateditor/src/components/CatalogContents.vue

@@ -7,11 +7,9 @@
     </v-layout>
 
     <v-layout row fill-height>
-      <v-flex xs3>
+      <v-flex xs4>
         <v-card>
-          <v-card class="subheading font-weight-bold pa-2" color="grey lighten-2">
-            Sections
-          </v-card>
+          <DragListHeading title="Sections" />
 
           <div id="sections" class="list-group">
             <div v-for="item in sections" :key="item.id">
@@ -32,11 +30,9 @@
         </v-card>
       </v-flex>
 
-      <v-flex xs3>
+      <v-flex xs4>
         <v-card>
-          <v-card class="subheading font-weight-bold pa-2" color="grey lighten-2">
-            Models
-          </v-card>
+          <DragListHeading title="Models" />
 
           <div id="models" class="list-group">
             <div v-for="item in selectedModels" :key="item.model">
@@ -54,11 +50,9 @@
         </v-card>
       </v-flex>
 
-      <v-flex xs3>
+      <v-flex xs4>
         <v-card>
-          <v-card class="subheading font-weight-bold pa-2" color="grey lighten-2">
-            Materials
-          </v-card>
+          <DragListHeading title="Materials" />
 
           <div id="materials" class="list-group">
             <div v-for="item in selectedMaterials" :key="item.id">
@@ -89,12 +83,14 @@
 import Sortable from 'sortablejs'
 import { mapState, mapGetters, mapActions } from 'vuex'
 import arrayMove from 'array-move'
-import RawDisplayer from './RawDisplayer'
+//import RawDisplayer from './RawDisplayer'
 import { paginateModels } from '@/pagination'
+import DragListHeading from './DragListHeading'
 
 export default {
   components: {
-    RawDisplayer,
+    DragListHeading,
+    //RawDisplayer,
   },
 
   data: () => ({

cateditor/src/components/DragListHeading.vue

@@ -0,0 +1,22 @@
+<template>
+  <v-card class="subheading font-weight-bold ma-0 pl-2" color="grey lighten-2">
+    <v-card-title class="">
+      {{ title }}
+      <v-spacer></v-spacer>
+<!--      <v-btn icon>
+        <v-icon class="ma-0 pa-0">add</v-icon>
+      </v-btn>
+      -->
+    </v-card-title>
+  </v-card>
+</template>
+
+<script>
+export default {
+  data: () => ({
+  }),
+  props: {
+    title: String,
+  },
+}
+</script>