<template>
  <div>
<!--    <Modal v-model="showDiagramModal" title="检定（校准）证书编制" width="100%" class="footer-hidden iframeOne">-->
<!--      <div id="iframeOne" style="text-align:center;align-content:center;width: 100%;height: 790px">-->
<!--      </div>-->
<!--      <div slot="footer">-->
<!--      </div>-->
<!--    </Modal>-->
    <div v-show="showDiagramModal">
      <RecordIframe ref="iframeModal"></RecordIframe>
    </div>
  </div>
</template>
<script>
import global from '../../api/config'
import { meterSample } from '../../api'
import RecordIframe from '../meter-out/personal-task/RecordIframe'
/**
 * 原始记录填写
 */
export default {
  components: {
    RecordIframe
  },
  data() {
    return {
      showDiagramModal: false,
      templateId: '',
      again: false,
      sampleId: ''
    }
  },
  mounted() {
    // 监听原始记录消息
    window.addEventListener('message', this._saveOriginal)
  },
  methods: {
    async _saveOriginal(data) {
      console.log('data11111', data)
      if (this.again) {
        this.again = false
        if (undefined !== data.data.msg && data.data.msg === true) {
          this._cancel()
        } else if (
          undefined === data.data.templateId &&
          data.data.msg !== undefined
        ) {
          const result = await meterSample.certificateOk({
            sampleId: this.sampleId,
            formId: data.data.msg
          })
          if (result) {
            this._cancel()
          }
        } else {
          // this.$store
          //   .dispatch('FoodItem/saveModelForTestBasis', {
          //     ids: this.itemIds,
          //     templateId: data.data.templateId
          //   })
          //   .then(() => {
          //     this._cancel()
          //   })
        }
      }
    },
    _cancel() {
      this.$Message.success('保存成功！')
      this.$refs.iframeModal._closeIframe()
      this.showDiagramModal = false
      this.$emit('on-result-change')
    },
    _open(sampleId, modelId, dataSource) {
      const client = undefined === dataSource.client ? '' : dataSource.client
      const name = undefined === dataSource.name ? '' : dataSource.name
      const cc = undefined === dataSource.cc ? '' : dataSource.cc
      const spec = undefined === dataSource.spec ? '' : dataSource.spec
      const factoryNumber =
        undefined === dataSource.factoryNumber ? '' : dataSource.factoryNumber
      const manufacturer =
        undefined === dataSource.manufacturer ? '' : dataSource.manufacturer
      const verification =
        undefined === dataSource.verification ? '' : dataSource.verification
      this.again = true
      this.sampleId = sampleId
      this.showDiagramModal = true
      let baseUrl = global.baseURL
      baseUrl +=
        '/meter/v1/sample/certificate_record_data_bind?sampleId=' +
        this.sampleId +
        '&modelId=' +
        modelId
      const url =
        'http://record.patzn.com:7000/print/v1/eln/template_meter_' +
        modelId +
        '?client=' +
        client +
        '&spec=' +
        spec +
        '&cc=' +
        cc +
        '&factoryNumber=' +
        factoryNumber +
        '&manufacturer=' +
        manufacturer +
        '&verification=' +
        verification +
        '&name=' +
        name +
        '&bindUri=' +
        encodeURIComponent(baseUrl)
      // $('#iframeOne').html(
      //   '<iframe style="padding: 0px;width:100%;height:100%" frameborder="0" src=' +
      //     url +
      //     '></iframe>'
      // )
      const param = {
        sampleId: this.sampleId,
        tempId: modelId,
        client: client,
        spec: spec,
        cc: cc,
        name: name,
        factoryNumber: factoryNumber,
        manufacturer: manufacturer,
        verification: verification,
        bindUri: encodeURIComponent(baseUrl)
      }
      this.$refs.iframeModal._createIframe(url, param)
    }
  }
}
</script>
<style >
.iframeOne .ivu-modal {
  position: relative !important;
  top: 0px !important;
}
</style>
