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: () => ({