From 47261e0816b554d876d6aded747ea9ede099cc19 Mon Sep 17 00:00:00 2001
From: Seth Ladygo <alx-git@arclight.industries>
Date: Tue, 1 Oct 2019 15:45:50 -0700
Subject: [PATCH] CatalogList: update for vuetify 2 data table

---
 cateditor/src/components/CatalogList.vue | 79 ++++++++++++------------
 1 file changed, 38 insertions(+), 41 deletions(-)

diff --git a/cateditor/src/components/CatalogList.vue b/cateditor/src/components/CatalogList.vue
index 098142f..60a0f36 100644
--- a/cateditor/src/components/CatalogList.vue
+++ b/cateditor/src/components/CatalogList.vue
@@ -18,6 +18,7 @@
             <v-tab key="mine">My Catalogs</v-tab>
             <v-tab key="public">Public Catalogs</v-tab>
 
+            <!-- my catalogs -->
             <v-tab-item key="mine">
               <v-card text>
 
@@ -35,29 +36,27 @@
                 <v-data-table
                   :headers="myHeaders"
                   :items="myCatalogs"
+                  :items-per-page="15"
                   :search="search"
                   :loading="loadingMyCatalogs"
-                  disable-initial-sort
+                  @click:row="selectCatalog"
                   class="scroll-area"
                 >
-                  <template v-slot:items="cats">
-                    <tr @click="selectCatalog(cats.item.id)">
-                      <td v-if="cats.item.master" class="px-2 py-0">
-                        <v-tooltip top>
-                          <template v-slot:activator="{ on }">
-                            <v-icon small color="red" v-on="on">stars</v-icon>
-                          </template>
-                          <span>Season master</span>
-                        </v-tooltip>
-                      </td>
-                      <td v-else class="pa-0"></td>
-                      <td class="px-2 py-0">{{ cats.item.seasonCode }}</td>
-                      <td class="px-2 py-0">{{ cats.item.name }}</td>
-                      <td class="px-2 py-0">{{ cats.item.updatedPretty }}</td>
-                      <td class="px-2 py-0">
-                        <PDFProgress :percentDone="cats.item.build_progress" />
-                      </td>
-                    </tr>
+                  <template v-slot:item.master="{ item }">
+                    <v-tooltip top v-if="item.master">
+                      <template v-slot:activator="{ on }">
+                        <v-icon small color="red" v-on="on">stars</v-icon>
+                      </template>
+                      <span>Season master</span>
+                    </v-tooltip>
+                  </template>
+
+                  <template v-slot:item.updated="{ item }">
+                    {{ item.updatedPretty }}
+                  </template>
+
+                  <template v-slot:item.build_progress="{ item }">
+                    <PDFProgress :percentDone="item.build_progress" />
                   </template>
 
                   <template v-slot:no-results>
@@ -72,6 +71,7 @@
               </v-card>
             </v-tab-item>
 
+            <!-- public catalogs -->
             <v-tab-item key="public">
               <v-card text>
 
@@ -89,30 +89,27 @@
                 <v-data-table
                   :headers="pubHeaders"
                   :items="publicCatalogs"
+                  :items-per-page="15"
                   :search="search"
                   :loading="loadingPublicCatalogs"
-                  disable-initial-sort
+                  @click:row="selectCatalog"
                   class="scroll-area"
                 >
-                  <template v-slot:items="cats">
-                    <tr @click="selectCatalog(cats.item.id)">
-                      <td v-if="cats.item.master" class="px-2 py-0">
-                        <v-tooltip top>
-                          <template v-slot:activator="{ on }">
-                            <v-icon small color="red" v-on="on">stars</v-icon>
-                          </template>
-                          <span>Season master</span>
-                        </v-tooltip>
-                      </td>
-                      <td v-else class="pa-0"></td>
-                      <td class="px-2 py-0">{{ cats.item.seasonCode }}</td>
-                      <td class="px-2 py-0">{{ cats.item.ownerName }}</td>
-                      <td class="px-2 py-0">{{ cats.item.name }}</td>
-                      <td class="px-2 py-0">{{ cats.item.updatedPretty }}</td>
-                      <td class="px-2 py-0">
-                        <PDFProgress :percentDone="cats.item.build_progress" />
-                      </td>
-                    </tr>
+                  <template v-slot:item.master="{ item }">
+                    <v-tooltip top v-if="item.master">
+                      <template v-slot:activator="{ on }">
+                        <v-icon small color="red" v-on="on">stars</v-icon>
+                      </template>
+                      <span>Season master</span>
+                    </v-tooltip>
+                  </template>
+
+                  <template v-slot:item.updated="{ item }">
+                    {{ item.updatedPretty }}
+                  </template>
+
+                  <template v-slot:item.build_progress="{ item }">
+                    <PDFProgress :percentDone="item.build_progress" />
                   </template>
 
                   <template v-slot:no-results>
@@ -316,8 +313,8 @@ export default {
       'loadMyCatalogs',
       'loadPublicCatalogs',
     ]),
-    selectCatalog(id) {
-      this.setSelectedCatalog(id)
+    selectCatalog(cat) {
+      this.setSelectedCatalog(cat.id)
     },
   },
   mounted: function() {