<template>
  <div style="pointer-events: none">
    <div class="custom-node">
      <div class="area"
           :style='`width:${props.pageData?.width || "1920px"};height:${props.pageData?.height || "1080px"};border: 1px solid #fff;background-image:url(${props.pageData?.bg})`'></div>
    </div>
  </div>
</template>

<script setup>
import { defineProps } from 'vue';

const props = defineProps({
  pageData: {
    type: Object,
    required: false
  }
});
</script>
<style scoped>
.area {
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
</style>
