<template>
  <div id="test" v-if="showReport">
    <XReport
      @updateImg="updateImg"
      ref="main"
      :use-oss-for-img="false"
      config-name="用户户内通气点火工艺流程"
      :server-name="process.env.VUE_APP_SYSTEM_NAME"
      :show-img-in-cell="true"
      :edit-mode="false"
      :show-save-button="false"
      :dont-format="true"/>
    <a-button @click="testExport">导出</a-button>
    <a-button @click="testSave">保存</a-button>
  </div>
</template>

<script>
import XReport from '@vue2-client/base-client/components/common/XReport'
// eslint-disable-next-line no-unused-vars
import { exportHTMLNodeToPDF } from '@vue2-client/utils/htmlToPDFApi'

export default {
  name: 'XReportDemo',
  components: {
    XReport
  },
  mounted () {
    console.log(this.$route)
  },
  data () {
    return {
      total: 1,
      registerMap: [],
      displayOnly: true,
      showReport: true
    }
  },
  methods: {
    updateImg (data) {
      console.warn('demo', data)
    },
    testExport () {
      this.showReport = false
      this.displayOnly = true
      this.$nextTick(() => {
        this.showReport = true
        setTimeout(() => {
          exportHTMLNodeToPDF('123', '#test')
          this.showReport = false
          this.displayOnly = false
          this.$nextTick(() => {
            this.showReport = true
          })
        }, 500)
      })
    },
    testSave () {
      const result = []
      this.registerMap.forEach(item => {
        result.push(item.exportData())
      })
      console.warn('save', result)
    }
  }
}
</script>
<style scoped>

</style>
