<template>
  <base-dialog v-model="visible" title="试卷预览" :footer="false" :modal="false" draggable class="preview-dialog">
    <div class="preview-content">
      <img v-show="!!url" :src="url" alt="" />
    </div>
  </base-dialog>
</template>

<script setup lang="ts" name="ImagePreview">
import BaseDialog from '../element/BaseDialog.vue'
import useVModel from '@/hooks/useVModel'

const props = defineProps<{
  modelValue: boolean
  url?: string
}>()
const visible = useVModel(props)
</script>

<style scoped lang="scss">
.preview-dialog {
  margin-left: 70%;
  .preview-content {
    width: 100%;
    min-width: 200px;
    max-width: 400px;
    text-align: center;
    min-height: 400px;
    max-height: 600px;
    img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
  }
}
</style>
