<template>
  <div class="vesselBox" >
    <Spin :spinning="loading" size="large">
      <iframe ref="iframeRef" width="100%" height="100%" frameborder="0" :src="src" class="self_iframe"></iframe>
    </Spin>
  </div>
</template>

<script>

import {Spin} from "ant-design-vue";
import { ref, provide } from 'vue';

export default {
  setup() {
    const iframeRef = ref(null);

    // 提供iframe引用给父组件
    provide('iframeRef', iframeRef);

    return {
      iframeRef,
    };
  },
  components: {Spin},
  props:['loading','src']
}
</script>

<style scoped lang="less">
.vesselBox{
  .self_iframe{
    width: 100%;
    min-height: 92vh;
    background: #fff;
    border: none;
  }
  .ant-empty{
    height: 94vh;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-size: 20px;
  }
}

</style>
