<template>
  <div>
    <!--    <p>{{ excelUrl }}</p>-->
    <vue-office-excel :src="excelUrl" :style="containerStyle" @rendered="rendered" />
  </div>

</template>

<script>
// 引入VueOfficeExcel组件
import VueOfficeExcel from '@vue-office/excel'
// 引入相关样式
import '@vue-office/excel/lib/index.css'

export default {
  name: 'OfficeExcel',
  components: {
    VueOfficeExcel
  },
  props: {
    excelUrl: {
      type: String,
      default: null
    },
    containerStyle: {
      type: Object,
      default: () => ({
        width: '800px',
        height: '500px'
      })
    }
  },
  data() {
    return {
    }
  },
  methods: {
    rendered() {
      this.$emit('ok')
    }
  }
}
</script>
<style lang="scss">
.x-spreadsheet-bottombar {
  display: none;
}
</style>
