mirror of
https://github.com/sysadminsmedia/homebox.git
synced 2025-12-24 06:28:34 +01:00
cbaf483788
* feat: migrate tools page and label generator to shadcn * chore: lint issues * feat: also do profile page * feat: shadcn 404 page * feat: login page shadcn * fix: daisyui ironically breaks the z height for the login page * feat: componentise the language selector and add it to the login page * feat: use nuxtlink * feat: card and table made more shadcn * feat: shadcn statscard * chore: lint * feat: shadcn labelchip and locationcard * feat: shadcn locations page * refactor: remove unused new item page * chore: lint * feat: shadcn item card * fix: wrapping of location and lint * feat: ctrl enter in text area in form submits form * feat: begin shadcn locations page and remove pageqrcode comp in favour of integrating it into labelmaker * chore: lint + remove unused code * fix: remove uneeded margin * feat: shadcn labels page and fix some issues with location * feat: shadcn scanner * chore: lint * feat: begin shadcning item pages * feat: shadcn maintenance page * feat: begin shadcn search page * fix: quick switch blurry text and crashing page when switching + incorrect z height for create menu * feat: finish shadcn search page * chore: lint * feat: shadcn edit item page * fix: quickmenumodal bug * feat: shadcn item details page * feat: remove all non-color related daisyui classes * fix: type error * fix: quick menu modal again :(
67 lines
2.1 KiB
Vue
67 lines
2.1 KiB
Vue
<template>
|
|
<ul role="list" class="divide-y divide-gray-400 rounded-md border border-gray-400">
|
|
<li
|
|
v-for="attachment in attachments"
|
|
:key="attachment.id"
|
|
class="flex items-center justify-between py-3 pl-3 pr-4 text-sm"
|
|
>
|
|
<div class="flex w-0 flex-1 items-center">
|
|
<MdiPaperclip class="size-5 shrink-0 text-gray-400" aria-hidden="true" />
|
|
<span class="ml-2 w-0 flex-1 truncate"> {{ attachment.document.title }}</span>
|
|
</div>
|
|
<div class="ml-4 flex shrink-0 gap-2">
|
|
<TooltipProvider :delay-duration="0">
|
|
<Tooltip>
|
|
<TooltipTrigger as-child>
|
|
<a
|
|
:class="buttonVariants({ size: 'icon' })"
|
|
:href="attachmentURL(attachment.id)"
|
|
:download="attachment.document.title"
|
|
>
|
|
<MdiDownload />
|
|
</a>
|
|
</TooltipTrigger>
|
|
<TooltipContent> Download </TooltipContent>
|
|
</Tooltip>
|
|
<Tooltip>
|
|
<TooltipTrigger as-child>
|
|
<a :class="buttonVariants({ size: 'icon' })" :href="attachmentURL(attachment.id)" target="_blank">
|
|
<MdiOpenInNew />
|
|
</a>
|
|
</TooltipTrigger>
|
|
<TooltipContent> Open in new tab </TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { ItemAttachment } from "~~/lib/api/types/data-contracts";
|
|
import MdiPaperclip from "~icons/mdi/paperclip";
|
|
import MdiDownload from "~icons/mdi/download";
|
|
import MdiOpenInNew from "~icons/mdi/open-in-new";
|
|
import { buttonVariants } from "@/components/ui/button";
|
|
import { Tooltip, TooltipContent, TooltipTrigger, TooltipProvider } from "@/components/ui/tooltip";
|
|
|
|
const props = defineProps({
|
|
attachments: {
|
|
type: Object as () => ItemAttachment[],
|
|
required: true,
|
|
},
|
|
itemId: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const api = useUserApi();
|
|
|
|
function attachmentURL(attachmentId: string) {
|
|
return api.authURL(`/items/${props.itemId}/attachments/${attachmentId}`);
|
|
}
|
|
</script>
|
|
|
|
<style scoped></style>
|