mirror of
https://github.com/acepanel/panel.git
synced 2026-02-04 18:27:13 +08:00
44 lines
967 B
Vue
44 lines
967 B
Vue
<script setup lang="ts">
|
|
import file from '@/api/panel/file'
|
|
|
|
const show = defineModel<boolean>('show', { type: Boolean, required: true })
|
|
const path = defineModel<string>('path', { type: String, required: true })
|
|
|
|
const mime = ref('')
|
|
const content = ref('')
|
|
const img = computed(() => {
|
|
return `data:${mime.value};base64,${content.value}`
|
|
})
|
|
|
|
watch(
|
|
() => path.value,
|
|
() => {
|
|
content.value = ''
|
|
useRequest(file.content(path.value)).onSuccess(({ data }) => {
|
|
mime.value = data.mime
|
|
content.value = data.content
|
|
})
|
|
}
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<n-modal
|
|
v-model:show="show"
|
|
preset="card"
|
|
:title="'预览 - ' + path"
|
|
style="width: 60vw"
|
|
size="huge"
|
|
:bordered="false"
|
|
:segmented="false"
|
|
>
|
|
<n-image width="100%" :src="img" preview-disabled :show-toolbar="false">
|
|
<template #placeholder>
|
|
<n-spin />
|
|
</template>
|
|
</n-image>
|
|
</n-modal>
|
|
</template>
|
|
|
|
<style scoped lang="scss"></style>
|