<script setup lang="ts">
defineProps<{
  resource: ResourceTechnologyInfo
}>()

const open = ref(false)
</script>

<template>
  <Dialog v-model:open="open">
    <DialogTrigger as-child>
      <img :src="resource.craftImage" class="size-[100px]">
    </DialogTrigger>
    <DialogScrollContent class="sm:max-w-[600px]">
      <DialogHeader>
        <DialogTitle>工艺流程</DialogTitle>
        <DialogDescription>
          工艺流程设计图
        </DialogDescription>
      </DialogHeader>

      <div class="flex justify-center items-center w-full">
        <img :src="resource.craftImage" class="size-[600px]">
      </div>
    </DialogScrollContent>
  </Dialog>
</template>
