mirror of
https://github.com/hay-kot/homebox.git
synced 2025-08-05 09:10:26 +00:00
run linter
This commit is contained in:
parent
27ed919a1c
commit
9178da7f0b
4 changed files with 31 additions and 38 deletions
|
@ -11,10 +11,10 @@
|
|||
</div>
|
||||
<div class="ml-4 flex-shrink-0">
|
||||
<a class="tooltip mr-2" data-tip="Download" :href="attachmentURL(attachment.id)" target="_blank">
|
||||
<Icon class="h-5 w-5" name="mdi-download"/>
|
||||
<Icon class="h-5 w-5" name="mdi-download" />
|
||||
</a>
|
||||
<a class="tooltip" data-tip="Open" :href="attachmentURL(attachment.id)" target="_blank">
|
||||
<Icon class="h-5 w-5" name="mdi-open-in-new"/>
|
||||
<Icon class="h-5 w-5" name="mdi-open-in-new" />
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
@ -37,11 +37,9 @@
|
|||
|
||||
const api = useUserApi();
|
||||
|
||||
function attachmentURL(attachmentId : string) {
|
||||
function attachmentURL(attachmentId: string) {
|
||||
return api.authURL(`/items/${props.itemId}/attachments/${attachmentId}`);
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
|
@ -27,9 +27,9 @@ export function parseDate<T>(obj: T, keys: Array<keyof T> = []): T {
|
|||
|
||||
export class BaseAPI {
|
||||
http: Requests;
|
||||
attachmentToken: string
|
||||
attachmentToken: string;
|
||||
|
||||
constructor(requests: Requests, attachmentToken: string = "") {
|
||||
constructor(requests: Requests, attachmentToken = "") {
|
||||
this.http = requests;
|
||||
this.attachmentToken = attachmentToken;
|
||||
}
|
||||
|
|
|
@ -1,12 +1,6 @@
|
|||
import { BaseAPI, route } from "../base";
|
||||
import { parseDate } from "../base/base-api";
|
||||
import {
|
||||
ItemAttachmentUpdate,
|
||||
ItemCreate,
|
||||
ItemOut,
|
||||
ItemSummary,
|
||||
ItemUpdate,
|
||||
} from "../types/data-contracts";
|
||||
import { ItemAttachmentUpdate, ItemCreate, ItemOut, ItemSummary, ItemUpdate } from "../types/data-contracts";
|
||||
import { AttachmentTypes, PaginationResult } from "../types/non-generated";
|
||||
|
||||
export type ItemsQuery = {
|
||||
|
|
|
@ -35,17 +35,19 @@
|
|||
|
||||
type Photo = {
|
||||
src: string;
|
||||
}
|
||||
};
|
||||
|
||||
const photos = computed<Photo[]>(() => {
|
||||
return item.value?.attachments.reduce((acc, cur) => {
|
||||
if (cur.type === "photo") {
|
||||
acc.push({
|
||||
src: api.authURL(`/items/${item.value.id}/attachments/${cur.id}`),
|
||||
})
|
||||
}
|
||||
return acc;
|
||||
}, [] as Photo[]) || [];
|
||||
return (
|
||||
item.value?.attachments.reduce((acc, cur) => {
|
||||
if (cur.type === "photo") {
|
||||
acc.push({
|
||||
src: api.authURL(`/items/${item.value.id}/attachments/${cur.id}`),
|
||||
});
|
||||
}
|
||||
return acc;
|
||||
}, [] as Photo[]) || []
|
||||
);
|
||||
});
|
||||
|
||||
const attachments = computed<FilteredAttachments>(() => {
|
||||
|
@ -304,7 +306,7 @@
|
|||
const refDialog = ref<HTMLDialogElement>();
|
||||
const dialoged = reactive({
|
||||
src: "",
|
||||
})
|
||||
});
|
||||
|
||||
function openDialog(img: Photo) {
|
||||
refDialog.value.showModal();
|
||||
|
@ -319,30 +321,22 @@
|
|||
onClickOutside(refDialogBody, () => {
|
||||
closeDialog();
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* Style dialog background */
|
||||
dialog::backdrop {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
</style>
|
||||
|
||||
<template>
|
||||
<BaseContainer v-if="item" class="pb-8">
|
||||
<dialog ref="refDialog" class="z-[999] fixed bg-transparent">
|
||||
<div class="relative" ref="refDialogBody">
|
||||
<div ref="refDialogBody" class="relative">
|
||||
<div class="absolute right-0 -mt-3 -mr-3 sm:-mt-4 sm:-mr-4 space-x-1">
|
||||
<a class="btn btn-sm sm:btn-md btn-primary btn-circle" :href="dialoged.src" download>
|
||||
<Icon class="h-5 w-5" name="mdi-download"/>
|
||||
<Icon class="h-5 w-5" name="mdi-download" />
|
||||
</a>
|
||||
<button class="btn btn-sm sm:btn-md btn-primary btn-circle" @click="closeDialog()">
|
||||
<Icon class="h-5 w-5" name="mdi-close" />
|
||||
<Icon class="h-5 w-5" name="mdi-close" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<img class="max-w-[80vw] max-h-[80vh]" :src="dialoged.src"/>
|
||||
<img class="max-w-[80vw] max-h-[80vh]" :src="dialoged.src" />
|
||||
</div>
|
||||
</dialog>
|
||||
<section class="px-3">
|
||||
|
@ -405,8 +399,8 @@
|
|||
<BaseCard>
|
||||
<template #title> Photos </template>
|
||||
<div class="container p-4 flex flex-wrap gap-2 mx-auto max-h-[500px] overflow-scroll">
|
||||
<button v-for="img in photos" @click="openDialog(img)">
|
||||
<img class="rounded max-h-[200px]" :src="img.src"/>
|
||||
<button v-for="(img, i) in photos" :key="i" @click="openDialog(img)">
|
||||
<img class="rounded max-h-[200px]" :src="img.src" />
|
||||
</button>
|
||||
</div>
|
||||
</BaseCard>
|
||||
|
@ -470,3 +464,10 @@
|
|||
</section>
|
||||
</BaseContainer>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
/* Style dialog background */
|
||||
dialog::backdrop {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue