41 lines
926 B
Vue
41 lines
926 B
Vue
<template>
|
|
<div class="preview" v-if="mimeType">
|
|
<template v-if="mimeType.startsWith('audio')">
|
|
<audio controls :src="`/api/raw/${address}`" />
|
|
</template>
|
|
<template v-if="mimeType.startsWith('image')">
|
|
<a :href="`/api/raw/${address}`">
|
|
<img :src="`/api/raw/${address}`" />
|
|
</a>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { useEntity } from "@/lib/entity";
|
|
import { defineComponent } from "vue";
|
|
|
|
export default defineComponent({
|
|
name: "BlobPreview",
|
|
props: {
|
|
address: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
},
|
|
computed: {
|
|
mimeType(): string | undefined {
|
|
return this.attributes.find(([_, e]) => e.attribute === "FILE_MIME")?.[1]
|
|
.value.c;
|
|
},
|
|
},
|
|
setup(props) {
|
|
const { attributes, backlinks, error } = useEntity(props.address);
|
|
return { attributes };
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
</style>
|