aboutsummaryrefslogtreecommitdiff
path: root/viewer/src/components/LdGallery.vue
diff options
context:
space:
mode:
Diffstat (limited to 'viewer/src/components/LdGallery.vue')
-rw-r--r--viewer/src/components/LdGallery.vue16
1 files changed, 9 insertions, 7 deletions
diff --git a/viewer/src/components/LdGallery.vue b/viewer/src/components/LdGallery.vue
index 29c18b9..edd479c 100644
--- a/viewer/src/components/LdGallery.vue
+++ b/viewer/src/components/LdGallery.vue
@@ -18,11 +18,11 @@
18--> 18-->
19 19
20<template> 20<template>
21 <div class="thumbnail-tiles"> 21 <ld-error v-if="hasNoResults" icon="search" :message="noresult" />
22 <router-link v-for="item in items" :key="item.path" :to="item.path"> 22 <div v-else class="thumbnail-tiles">
23 <router-link v-for="item in sortedItems" :key="item.path" :to="item.path">
23 <ld-thumbnail :item="item" /> 24 <ld-thumbnail :item="item" />
24 </router-link> 25 </router-link>
25 <div v-if="hasNoResults()" class="noresult">{{noresult}}</div>
26 </div> 26 </div>
27</template> 27</template>
28 28
@@ -35,7 +35,11 @@ export default class LdPicture extends Vue {
35 @Prop({ type: Array, required: true }) readonly items!: Gallery.Item[]; 35 @Prop({ type: Array, required: true }) readonly items!: Gallery.Item[];
36 @Prop(String) readonly noresult?: string; 36 @Prop(String) readonly noresult?: string;
37 37
38 hasNoResults(): boolean { 38 get sortedItems() {
39 return this.items.sort(this.$uiStore.sort.fn);
40 }
41
42 get hasNoResults(): boolean {
39 return Boolean(this.noresult) && this.items.length === 0; 43 return Boolean(this.noresult) && this.items.length === 0;
40 } 44 }
41} 45}
@@ -47,11 +51,9 @@ export default class LdPicture extends Vue {
47 flex-wrap: wrap; 51 flex-wrap: wrap;
48 align-items: center; 52 align-items: center;
49 justify-content: space-evenly; 53 justify-content: space-evenly;
54
50 & > a { 55 & > a {
51 margin: 2px; 56 margin: 2px;
52 } 57 }
53 & .noresult {
54 margin-top: 40px;
55 }
56} 58}
57</style> 59</style>