store/resources/js/components/media/MediaPreviewDialog.vue

28 lines
714 B
Vue

<script setup lang="ts">
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
} from '@/components/ui/dialog';
const open = defineModel<boolean>('open', { default: false });
defineProps<{
url: string | null;
title?: string;
}>();
</script>
<template>
<Dialog v-model:open="open">
<DialogContent class="sm:max-wd p-2 sm:p-4">
<DialogHeader class="sr-only">
<DialogTitle>{{ title ?? 'Pratinjau Gambar' }}</DialogTitle>
</DialogHeader>
<img v-if="url" :src="url" :alt="title ?? 'Pratinjau gambar'"
class="max-h-[80vh] w-full rounded-md object-contain">
</DialogContent>
</Dialog>
</template>