Files
nl-um-vue-ts/src/components/chat/bubble/Image.vue
2025-12-03 12:56:57 +08:00

30 lines
670 B
Vue

<template>
<img
:src="imageUrl"
class="rounded-lg max-w-full cursor-zoom-in hover:brightness-90 transition border border-white/10"
@click="previewImage"
/>
</template>
<script setup lang="ts">
import { computed } from 'vue'
import type { ChatMessage } from '@/types/api'
const props = defineProps<{
message: ChatMessage
}>()
const imageUrl = computed(() => {
const extra = typeof props.message.extra === 'object' ? props.message.extra : {}
return extra.url || props.message.content
})
function previewImage() {
const w = window.open('')
if (w) {
w.document.write(`<img src="${imageUrl.value}" style="max-width:100%">`)
}
}
</script>