aboutsummaryrefslogtreecommitdiff
path: root/viewer/src/views/layout/top
diff options
context:
space:
mode:
authorZéro~Informatique2022-11-06 19:34:26 +0100
committerZéro~Informatique2022-11-06 19:41:44 +0100
commitcfbff75f78963e3d24326f731590e78a4d719e9e (patch)
tree2e5436e819f8e93a1115a8142594ca80fd507bc1 /viewer/src/views/layout/top
parent12eb302bcc93405f81b676b1a29a9731a5fec9be (diff)
downloadldgallery-cfbff75f78963e3d24326f731590e78a4d719e9e.tar.gz
viewer/command: add item download button
Fixed a reactivity issue with props used in a composition function (useItemResource) Fixed crash with null items in LayoutTop Changed how downloadable items are identified: We use the fact they are materialized in the gallery instead of a hardly defined "listing condition". This also simplifies the code.
Diffstat (limited to 'viewer/src/views/layout/top')
-rw-r--r--viewer/src/views/layout/top/LayoutCommand.vue35
-rw-r--r--viewer/src/views/layout/top/LayoutTop.vue5
2 files changed, 17 insertions, 23 deletions
diff --git a/viewer/src/views/layout/top/LayoutCommand.vue b/viewer/src/views/layout/top/LayoutCommand.vue
index d930fd2..85d47b6 100644
--- a/viewer/src/views/layout/top/LayoutCommand.vue
+++ b/viewer/src/views/layout/top/LayoutCommand.vue
@@ -34,14 +34,10 @@
34 /> 34 />
35 </LdLink> 35 </LdLink>
36 36
37 <LayoutCommandSort 37 <LdLink
38 v-if="isListing" 38 v-if="itemResourceUrl"
39 :tabindex="20"
40 />
41 <a
42 v-else
43 :title="t('command.download')" 39 :title="t('command.download')"
44 :download="itemFileName" 40 :download="navigation.getFileName(props.item)"
45 :href="itemResourceUrl" 41 :href="itemResourceUrl"
46 :tabindex="20" 42 :tabindex="20"
47 > 43 >
@@ -49,7 +45,11 @@
49 :icon="faFileDownload" 45 :icon="faFileDownload"
50 size="lg" 46 size="lg"
51 /> 47 />
52 </a> 48 </LdLink>
49 <LayoutCommandSort
50 v-else
51 :tabindex="20"
52 />
53 53
54 <LdLink 54 <LdLink
55 :class="{ disabled: isEntryPoint(), [$style.commandSecondary]: true }" 55 :class="{ disabled: isEntryPoint(), [$style.commandSecondary]: true }"
@@ -83,20 +83,19 @@
83<script setup lang="ts"> 83<script setup lang="ts">
84import { Item } from '@/@types/gallery'; 84import { Item } from '@/@types/gallery';
85import LdLink from '@/components/LdLink.vue'; 85import LdLink from '@/components/LdLink.vue';
86import { useUiStore } from '@/store/uiStore';
87import { useGalleryStore } from '@/store/galleryStore';
88import { useNavigation } from '@/services/navigation'; 86import { useNavigation } from '@/services/navigation';
89import { isDirectory, isDownloadableItem } from '@/services/itemGuards'; 87import { useItemResource } from '@/services/ui/ldItemResourceUrl';
88import { useUiStore } from '@/store/uiStore';
90import { 89import {
91 faAngleDoubleLeft, 90 faAngleDoubleLeft,
92 faArrowLeft, 91 faArrowLeft,
92 faFileDownload,
93 faFolder, 93 faFolder,
94 faLevelUpAlt, 94 faLevelUpAlt,
95 faSearch, 95 faSearch,
96 faFileDownload,
97} from '@fortawesome/free-solid-svg-icons'; 96} from '@fortawesome/free-solid-svg-icons';
98import { computedEager } from '@vueuse/shared'; 97import { computedEager } from '@vueuse/shared';
99import { computed, PropType } from 'vue'; 98import { computed, PropType, toRef } from 'vue';
100import { useI18n } from 'vue-i18n'; 99import { useI18n } from 'vue-i18n';
101import { useRoute, useRouter } from 'vue-router'; 100import { useRoute, useRouter } from 'vue-router';
102import LayoutCommandSort from './LayoutCommandSort.vue'; 101import LayoutCommandSort from './LayoutCommandSort.vue';
@@ -110,16 +109,8 @@ const { t } = useI18n();
110const route = useRoute(); 109const route = useRoute();
111const router = useRouter(); 110const router = useRouter();
112const uiStore = useUiStore(); 111const uiStore = useUiStore();
113const galleryStore = useGalleryStore();
114const navigation = useNavigation(); 112const navigation = useNavigation();
115 113const { itemResourceUrl } = useItemResource(toRef(props, 'item'));
116const isListing = computedEager(() => !props.item || isDirectory(props.item));
117const itemFileName = computed(() => navigation.getFileName(props.item));
118const itemResourceUrl = computed(() =>
119 isDownloadableItem(props.item)
120 ? galleryStore.resourceRoot + props.item.properties.resource
121 : '',
122);
123 114
124const commandToggleSearchPanelIcon = computed(() => uiStore.fullWidth ? faSearch : faAngleDoubleLeft); 115const commandToggleSearchPanelIcon = computed(() => uiStore.fullWidth ? faSearch : faAngleDoubleLeft);
125const isRoot = computedEager(() => props.currentItemPath.length <= 1 && !uiStore.searchMode); 116const isRoot = computedEager(() => props.currentItemPath.length <= 1 && !uiStore.searchMode);
diff --git a/viewer/src/views/layout/top/LayoutTop.vue b/viewer/src/views/layout/top/LayoutTop.vue
index 0362840..02c8b7b 100644
--- a/viewer/src/views/layout/top/LayoutTop.vue
+++ b/viewer/src/views/layout/top/LayoutTop.vue
@@ -18,7 +18,10 @@
18--> 18-->
19 19
20<template> 20<template>
21 <div class="flex"> 21 <div
22 v-if="galleryStore.currentItem"
23 class="flex"
24 >
22 <LayoutCommand 25 <LayoutCommand
23 :current-item-path="galleryStore.currentItemPath" 26 :current-item-path="galleryStore.currentItemPath"
24 :item="galleryStore.currentItem" 27 :item="galleryStore.currentItem"