aboutsummaryrefslogtreecommitdiff
path: root/viewer/src/views/GalleryNavigation.vue
diff options
context:
space:
mode:
authorpacien2020-09-25 16:01:49 +0200
committerpacien2020-09-25 16:01:49 +0200
commite93f7b1eb84c083d67567115284c0002a3a7d5fc (patch)
tree8d373e8f7f571485e1330928f43b090ed004c525 /viewer/src/views/GalleryNavigation.vue
parent8e3ac8fe44bebb38e1882ca7f06b8100078ad88d (diff)
parentfd542f75a1d94ee5f804d0925823276b97f38581 (diff)
downloadldgallery-e93f7b1eb84c083d67567115284c0002a3a7d5fc.tar.gz
Merge branch 'develop' for release v2.0v2.0
Diffstat (limited to 'viewer/src/views/GalleryNavigation.vue')
-rw-r--r--viewer/src/views/GalleryNavigation.vue38
1 files changed, 28 insertions, 10 deletions
diff --git a/viewer/src/views/GalleryNavigation.vue b/viewer/src/views/GalleryNavigation.vue
index 7c6d11b..fd1f19a 100644
--- a/viewer/src/views/GalleryNavigation.vue
+++ b/viewer/src/views/GalleryNavigation.vue
@@ -19,23 +19,20 @@
19 19
20<template> 20<template>
21 <div> 21 <div>
22 <gallery-search v-if="query.length" :path="path" /> 22 <ld-error v-if="isError" icon="folder-open" :message="$t('gallery.unknown-resource')" />
23 <gallery-directory v-else-if="checkType('directory')" :directory="$galleryStore.currentItem" /> 23 <gallery-search v-else-if="isSearch" :path="path" />
24 <ld-picture v-else-if="checkType('picture')" :picture="$galleryStore.currentItem" /> 24 <component :is="componentName" v-else :item="$galleryStore.currentItem" />
25 <div v-else>{{$t("gallery.unknowntype")}}</div>
26 </div> 25 </div>
27</template> 26</template>
28 27
29<script lang="ts"> 28<script lang="ts">
30import { Component, Vue, Prop, Watch } from "vue-property-decorator"; 29import { Component, Vue, Prop, Watch } from "vue-property-decorator";
31import { Operation } from "@/@types/Operation"; 30import { ItemType } from "@/@types/ItemType";
32import Navigation from "@/services/navigation"; 31import Navigation from "@/services/navigation";
33import GalleryDirectory from "./GalleryDirectory.vue";
34import GallerySearch from "@/views/GallerySearch.vue"; 32import GallerySearch from "@/views/GallerySearch.vue";
35 33
36@Component({ 34@Component({
37 components: { 35 components: {
38 GalleryDirectory,
39 GallerySearch, 36 GallerySearch,
40 }, 37 },
41}) 38})
@@ -43,20 +40,41 @@ export default class GalleryNavigation extends Vue {
43 @Prop(String) readonly path!: string; 40 @Prop(String) readonly path!: string;
44 @Prop(Array) readonly query!: string[]; 41 @Prop(Array) readonly query!: string[];
45 42
43 readonly COMPONENT_BY_TYPE: Record<ItemType, string> = {
44 directory: "ld-directory",
45 picture: "ld-picture",
46 plaintext: "ld-plain-text-viewer",
47 pdf: "ld-pdf-viewer",
48 video: "ld-video-viewer",
49 audio: "ld-audio-viewer",
50 other: "ld-download",
51 };
52
46 mounted() { 53 mounted() {
47 this.pathChanged(); 54 this.pathChanged();
48 } 55 }
49 56
57 get isError() {
58 return this.checkType(null);
59 }
60
61 get isSearch() {
62 return this.checkType(ItemType.DIRECTORY) && this.query.length > 0;
63 }
64
65 get componentName() {
66 return this.COMPONENT_BY_TYPE[this.$galleryStore.currentItem?.properties.type ?? ItemType.OTHER];
67 }
68
50 @Watch("path") 69 @Watch("path")
51 pathChanged() { 70 pathChanged() {
52 this.$galleryStore.setCurrentPath(this.path); 71 this.$galleryStore.setCurrentPath(this.path);
53 } 72 }
54 73
55 private checkType(type: Gallery.ItemType): boolean { 74 checkType(type: ItemType | null): boolean {
56 return Navigation.checkType(this.$galleryStore.currentItem, type); 75 return Navigation.checkType(this.$galleryStore.currentItem, type);
57 } 76 }
58} 77}
59</script> 78</script>
60 79
61<style lang="scss"> 80<style lang="scss"></style>
62</style>