Create basic example using vue-good-table.

Used the group table feature. No styling applied.
pymedusa · Mar 10, 2019 · 90dc8ba · 90dc8ba
1 parent 66d9de5
commit 90dc8ba
Show file tree

Hide file tree

Showing 11 changed files with 4,159 additions and 337 deletions.
diff --git a/medusa/tv/series.py b/medusa/tv/series.py
@@ -2165,7 +2165,12 @@ def to_json(self, detailed=True, fetch=False):
         if detailed:
             episodes = self.get_all_episodes()
             data['size'] = self.size
-            data['seasons'] = [{'episodes': list(v), 'season': season} for season, v in
+            data['seasons'] = [{'children': list(v),
+                                'season': season,
+                                'label': 'Season {season}'.format(season=season),
+                                'mode': 'span',
+                                'html': False}
+                               for season, v in
                                groupby([ep.to_json() for ep in episodes], lambda item: item['season'])]
 
             data['episodeCount'] = len(episodes)

diff --git a/package.json b/package.json
@@ -18,5 +18,8 @@
     "dredd": "11.0.3",
     "execa": "1.0.0",
     "yargs": "13.2.2"
+  },
+  "dependencies": {
+    "vue-good-table": "2.16.3"
   }
 }
diff --git a/themes-default/slim/package.json b/themes-default/slim/package.json
@@ -27,6 +27,7 @@
     }
   },
   "dependencies": {
+    "vue-good-table": "2.16.3",
     "vue-tables-2": "1.4.70"
   },
   "devDependencies": {

diff --git a/themes-default/slim/src/components/display-show.vue b/themes-default/slim/src/components/display-show.vue
@@ -10,31 +10,20 @@
 
         <div class="row">
             <div class="col-md-12 top-15">
-
-                    <v-client-table v-if="show.seasons" :data="show.seasons" :columns="seasonColumns" :options="seasonOptions" class="season-table">
-                        <template slot="season" slot-scope="props">
-                            <div>
-                                <h3 style="display: inline"><app-link :name="'season-'+ props.row.season"></app-link>
-                                    <!-- {'Season ' + str(epResult['season']) if int(epResult['season']) > 0 else 'Specials'} -->
-                                    {{ props.row.season > 0 ? 'Season ' + props.row.season : 'Specials' }}
-                                    <!-- Only show the search manual season search, when any of the episodes in it is not unaired -->
-                                    <app-link v-if="anyEpisodeNotUnaired(props.row)" class="epManualSearch" :href="'home/snatchSelection?indexername=' + show.indexer + '&seriesid=' + show.id[show.indexer] + '&amp;season=' + props.row.season + '&amp;episode=1&amp;manual_search_type=season'">
-                                        <img v-if="config" data-ep-manual-search :src="'images/manualsearch' + (config.themeName === 'dark' ? '-white' : '') + '.png'" width="16" height="16" alt="search" title="Manual Search" />
-                                    </app-link>
-                                </h3>
-                            </div>
-                            <div class="season-scene-exception" :data-season="props.row.season > 0 ? props.row.season : 'Specials'">
-                                <img v-bind="getSeasonExceptions(props.row)" height="16" />
-                            </div>
-                        </template>
-                        <template slot="child_row" slot-scope="props">
-                            <div class="episodes">
-                                <episode-table :show="show" :season="props.row.season" :episodes="props.row.episodes"
-                                    :ref="`episodeTable-${props.row.season}`" @episodeTableSorted="episodeTableSorted($event)">
-                                </episode-table>
-                            </div>
-                        </template>
-                    </v-client-table>
+                <vue-good-table v-if="show.seasons"
+                :columns="columns"
+                :rows="show.seasons"
+                :groupOptions="{ enabled: true }">
+                <template slot="table-row" slot-scope="props">
+                    <span v-if="props.column.field == 'content.hasNfo'">
+                        <img :src="'images/' + (props.row.content.hasNfo ? 'nfo.gif' : 'nfo-no.gif')" :alt="(props.row.content.hasNfo ? 'Y' : 'N')" width="23" height="11" />
+                    </span>
+                    <span v-else>
+                        {{props.formattedRow[props.column.field]}}
+                    </span>
+                </template>
+
+                </vue-good-table>
             </div>
         </div>
 
@@ -125,15 +114,15 @@ import { mapState, mapGetters, mapActions } from 'vuex';
 import { apiRoute } from '../api';
 import { AppLink, PlotInfo } from './helpers';
 import { humanFileSize, attachImdbTooltip } from '../utils';
-import { ClientTable, Event } from 'vue-tables-2';
+import { VueGoodTable  } from 'vue-good-table';
 import EpisodeTable from './episode-table.vue';
 import ShowHeader from './show-header.vue';
 
 export default {
     name: 'show',
     components: {
         AppLink,
-        ClientTable,
+        VueGoodTable,
         EpisodeTable,
         PlotInfo,
         ShowHeader
@@ -169,6 +158,18 @@ export default {
             invertTable: true,
             isMobile: false,
             search: '',
+            columns: [{
+                label: 'nfo',
+                field: 'content.hasNfo'
+            },{
+                label: 'Episode',
+                field: 'episode'
+            }, {
+                label: 'Title',
+                field: 'title'
+            }],
+                // 'content.hasNfo', 'content.hasTbn', 'episode', 'absoluteNumber', 'title', 'file.location',
+                // 'file.size', 'airDate', 'download', 'subtitles', 'status', 'search'
             seasonColumns: ['season'],
             seasonOptions: {
                 headings: {

diff --git a/themes-default/slim/src/components/show-header.vue b/themes-default/slim/src/components/show-header.vue
@@ -417,7 +417,7 @@ export default {
                 Archived: 0
             };
             seasons.forEach(season => {
-                season.episodes.forEach(episode => {
+                season.children.forEach(episode => {
                     summary[episode.status] += 1;
                 });
             });

diff --git a/themes-default/slim/yarn.lock b/themes-default/slim/yarn.lock
@@ -3486,6 +3486,10 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.30.1.tgz#2e71bf0b119153dbb4cc4e88d9ea5acfb50dc05c"
   integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
 
+[email protected]:
+  version "2.0.0-alpha.7"
+  resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.0.0-alpha.7.tgz#245ad16f95764eababfb2c0a41fd5d033c20e57a"
+
 date-now@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"
@@ -3720,6 +3724,10 @@ detect-newline@^2.1.0:
   resolved "https://registry.yarnpkg.com/detect-newline/-/detect-newline-2.1.0.tgz#f41f1c10be4b00e87b5f13da680759f2c5bfd3e2"
   integrity sha1-9B8cEL5LAOh7XxPaaAdZ8sW/0+I=
 
+[email protected]:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/diacriticless/-/diacriticless-1.0.1.tgz#e7dda978c2919609bb48aee1efc5de6a337bd4c3"
+
 diff-sequences@^24.3.0:
   version "24.3.0"
   resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-24.3.0.tgz#0f20e8a1df1abddaf4d9c226680952e64118b975"
@@ -7518,6 +7526,11 @@ lodash.camelcase@^4.1.1:
   resolved "https://registry.yarnpkg.com/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz#b28aa6288a2b9fc651035c7711f65ab6190331a6"
   integrity sha1-soqmKIorn8ZRA1x3EfZathkDMaY=
 
+lodash.clonedeep@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef"
+  integrity sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=
+
 lodash.defaults@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/lodash.defaults/-/lodash.defaults-4.2.0.tgz#d09178716ffea4dde9e5fb7b37f6f0802274580c"
@@ -7528,6 +7541,10 @@ lodash.difference@^4.5.0:
   resolved "https://registry.yarnpkg.com/lodash.difference/-/lodash.difference-4.5.0.tgz#9ccb4e505d486b91651345772885a2df27fd017c"
   integrity sha1-nMtOUF1Ia5FlE0V3KIWi3yf9AXw=
 
+lodash.filter@^4.6.0:
+  version "4.6.0"
+  resolved "https://registry.yarnpkg.com/lodash.filter/-/lodash.filter-4.6.0.tgz#668b1d4981603ae1cc5a6fa760143e480b4c4ace"
+
 lodash.flatten@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/lodash.flatten/-/lodash.flatten-4.4.0.tgz#f31c22225a9632d2bbf8e4addbef240aa765a61f"
@@ -7538,6 +7555,10 @@ lodash.flattendeep@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz#fb030917f86a3134e5bc9bec0d69e0013ddfedb2"
   integrity sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI=
 
+lodash.foreach@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.foreach/-/lodash.foreach-4.5.0.tgz#1a6a35eace401280c7f06dddec35165ab27e3e53"
+
 lodash.get@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
@@ -11939,6 +11960,18 @@ vue-eslint-parser@^5.0.0:
     esquery "^1.0.1"
     lodash "^4.17.11"
 
+[email protected]:
+  version "2.16.3"
+  resolved "https://registry.yarnpkg.com/vue-good-table/-/vue-good-table-2.16.3.tgz#0367bd601583db5659d9c6a803d315c89898f09a"
+  dependencies:
+    date-fns "2.0.0-alpha.7"
+    diacriticless "1.0.1"
+    lodash.assign "^4.2.0"
+    lodash.clonedeep "^4.5.0"
+    lodash.filter "^4.6.0"
+    lodash.foreach "^4.5.0"
+    lodash.isequal "^4.5.0"
+
 vue-hot-reload-api@^2.3.0:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.2.tgz#1fcc1495effe08a790909b46bf7b5c4cfeb6f21b"

diff --git a/themes/dark/assets/js/medusa-runtime.js b/themes/dark/assets/js/medusa-runtime.js
diff --git a/themes/dark/assets/js/vendors.js b/themes/dark/assets/js/vendors.js
diff --git a/themes/light/assets/js/medusa-runtime.js b/themes/light/assets/js/medusa-runtime.js
diff --git a/themes/light/assets/js/vendors.js b/themes/light/assets/js/vendors.js