Kaynağa Gözat

:recycle: relying on route based sort

tags/0.9.0
J 4 yıl önce
ebeveyn
işleme
65bd2db16d

+ 6
- 20
vue-theme/src/pages/list.vue Dosyayı Görüntüle

73
             if (!this.pType) return
73
             if (!this.pType) return
74
             return this[`all${this.pType}`]
74
             return this[`all${this.pType}`]
75
         },
75
         },
76
-        isWide() {
77
-            const wide = ['exhibition', 'event']
78
-            return wide.includes(this.type)
79
-        }
80
     },
76
     },
81
     methods: {
77
     methods: {
82
-        _getSortBy() {
83
-            return this.sortBy
84
-                ? this.sortBy
85
-                : sortFromRoute(this.$route)
86
-        },
87
-        _getDispatchParams(perPage) {
78
+        _getDispatchParams(perPageOverride) {
88
             return {
79
             return {
89
-                sortType: this._getSortBy(),
80
+                sortType: this.sortBy,
90
                 params: {
81
                 params: {
91
-                    limit: perPage ? perPage : this.perPage,
82
+                    limit: perPageOverride ? perPageOverride : this.perPage,
92
                     page: this.page
83
                     page: this.page
93
                 }
84
                 }
94
             }
85
             }
114
             let params = this._getDispatchParams()
105
             let params = this._getDispatchParams()
115
             
106
             
116
             // For episodes, or material sort we grab EVERYTHING
107
             // For episodes, or material sort we grab EVERYTHING
117
-            const getAllClause = this.type == 'episode' || this.type == 'artist' && this._getSortBy() == sortTypes.material
108
+            const getAllClause = this.type == 'episode' || this.type == 'artist' && this.sortBy == sortTypes.material
118
             if(getAllClause) {
109
             if(getAllClause) {
119
                 dispatchAction = `getAll${this.pType}`
110
                 dispatchAction = `getAll${this.pType}`
120
                 params = this._getDispatchParams(-1)
111
                 params = this._getDispatchParams(-1)
207
         // and the post type has changed
198
         // and the post type has changed
208
         type(newType, oldType) {
199
         type(newType, oldType) {
209
             if(!postTypes.includes(newType)) return console.warn('type not valid...')
200
             if(!postTypes.includes(newType)) return console.warn('type not valid...')
210
-
211
-            // !:Ignore these default sorted types and let the route watcher deal with it
212
-            const ignore = ['event', 'exhibition', 'post']
213
-            if(ignore.includes(this.type)) return
214
-
215
             this.clearAndInitPostList('type watcher')
201
             this.clearAndInitPostList('type watcher')
216
         },
202
         },
217
         // Only fire if the sort type has changed
203
         // Only fire if the sort type has changed
221
             const validSorts = Object.values(sortTypes)
207
             const validSorts = Object.values(sortTypes)
222
             if (
208
             if (
223
                 typeFromRoute(to) == typeFromRoute(from) &&
209
                 typeFromRoute(to) == typeFromRoute(from) &&
224
-                sortFromRoute(to) != sortFromRoute(from) &&
210
+                to.sortBy != from.sortBy &&
225
                 // Post slug sometimes appears as a sort so we check it against known sorts
211
                 // Post slug sometimes appears as a sort so we check it against known sorts
226
-                validSorts.includes(sortFromRoute(to)) && validSorts.includes(sortFromRoute(from))
212
+                validSorts.includes(to.sortBy) && validSorts.includes(from.sortBy)
227
             ) {
213
             ) {
228
                 this.clearAndInitPostList('$route watcher')
214
                 this.clearAndInitPostList('$route watcher')
229
             } 
215
             } 

+ 16
- 42
vue-theme/src/router/routes.js Dosyayı Görüntüle

4
 
4
 
5
 import { sortTypes } from '@/utils/helpers'
5
 import { sortTypes } from '@/utils/helpers'
6
 
6
 
7
+const gridWithSidebar = { sidebar: true, grid: true }
8
+const gridSansSidebar = { sidebar: false, grid: true }
9
+const sansGridWithSidebar = { sidebar: true, grid: false }
10
+
7
 export default [
11
 export default [
8
     // Home Page
12
     // Home Page
9
     { path: '/', component: indexPage },
13
     { path: '/', component: indexPage },
11
     {
15
     {
12
         path: '/episode',
16
         path: '/episode',
13
         component: listPage,
17
         component: listPage,
14
-        props: { sidebar: false, grid: true, sortBy: null },
18
+        props: { ...gridSansSidebar, sortBy: null },
15
     },
19
     },
16
     {
20
     {
17
         path: '/artist',
21
         path: '/artist',
18
         component: listPage,
22
         component: listPage,
19
-        props: { sidebar: true, grid: true, sortBy: null },
23
+        props: { ...gridWithSidebar, sortBy: null },
20
     },
24
     },
21
     // Sorted List Pages
25
     // Sorted List Pages
22
     {
26
     {
23
         path: `/artist/${sortTypes.alpha}`,
27
         path: `/artist/${sortTypes.alpha}`,
24
         component: listPage,
28
         component: listPage,
25
-        props: { sidebar: true, grid: true, sortBy: `${sortTypes.alpha}` },
29
+        props: { ...gridWithSidebar, sortBy: `${sortTypes.alpha}` },
26
     },
30
     },
27
     {
31
     {
28
         path: `/artist/${sortTypes.material}`,
32
         path: `/artist/${sortTypes.material}`,
29
         component: listPage,
33
         component: listPage,
30
-        props: { sidebar: true, grid: true, sortBy: `${sortTypes.material}` },
34
+        props: { ...gridWithSidebar, sortBy: `${sortTypes.material}` },
31
     },
35
     },
32
     {
36
     {
33
         path: `/event`,
37
         path: `/event`,
34
         component: listPage,
38
         component: listPage,
35
-        props: { sidebar: true, sortBy: `${sortTypes.currentAndUpcoming}` },
36
-    },
37
-    {
38
-        path: `/exhibition`,
39
-        component: listPage,
40
-        props: { sidebar: true, sortBy: `${sortTypes.currentAndUpcoming}` },
41
-    },
42
-    {
43
-        path: `/:type/${sortTypes.past}`,
44
-        component: listPage,
45
-        props: { sidebar: true, sortBy: `${sortTypes.past}` },
46
-    },
47
-    {
48
-        path: `/:type/${sortTypes.current}`,
49
-        component: listPage,
50
-        props: { sidebar: true, sortBy: `${sortTypes.current}` },
39
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
51
     },
40
     },
52
     {
41
     {
53
-        path: `/:type/${sortTypes.currentAndUpcoming}`,
42
+        path: `/event/${sortTypes.currentAndUpcoming}`,
54
         component: listPage,
43
         component: listPage,
55
-        props: { sidebar: true, sortBy: `${sortTypes.currentAndUpcoming}` },
44
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
56
     },
45
     },
57
     {
46
     {
58
-        path: `/:type/${sortTypes.upcoming}`,
59
-        component: listPage,
60
-        props: { sidebar: true, sortBy: `${sortTypes.upcoming}` },
61
-    },
62
-    {
63
-        path: `/:type/${sortTypes.alpha}`,
64
-        component: listPage,
65
-        props: { sidebar: true, sortBy: `${sortTypes.alpha}` },
66
-    },
67
-    {
68
-        path: `/:type/${sortTypes.material}`,
69
-        component: listPage,
70
-        props: { sidebar: true, sortBy: `${sortTypes.material}` },
71
-    },
72
-    {
73
-        path: `/:type/${sortTypes.episode}`,
47
+        path: `/exhibition`,
74
         component: listPage,
48
         component: listPage,
75
-        props: { sidebar: true, sortBy: `${sortTypes.episode}` },
49
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
76
     },
50
     },
77
     {
51
     {
78
-        path: `/:type/${sortTypes.artist}`,
52
+        path: `/exhibition/${sortTypes.currentAndUpcoming}`,
79
         component: listPage,
53
         component: listPage,
80
-        props: { sidebar: true, sortBy: `${sortTypes.artist}` },
54
+        props: { ...sansGridWithSidebar, sortBy: `${sortTypes.currentAndUpcoming}`, isWide: true },
81
     },
55
     },
82
     {
56
     {
83
         path: '/:type',
57
         path: '/:type',
84
         component: listPage,
58
         component: listPage,
85
-        props: { sidebar: true, sortBy: null },
59
+        props: { ...sansGridWithSidebar, sortBy: null },
86
     },
60
     },
87
     // Single Pages
61
     // Single Pages
88
     {
62
     {

+ 0
- 6
vue-theme/src/utils/helpers.js Dosyayı Görüntüle

54
     return type
54
     return type
55
 }
55
 }
56
 
56
 
57
-const sortFromRoute = route => {
58
-    return route.sortBy ? route.sortBy : route.fullPath
59
-        .split('/')
60
-        .filter(p => p)
61
-        .pop()
62
-}
63
 
57
 
64
 const ytThumbnail = (url, desiredSize) => {
58
 const ytThumbnail = (url, desiredSize) => {
65
     const remove = [
59
     const remove = [

Loading…
İptal
Kaydet