<template>
  <div class="auto form-horizontal" >
    <modal :show.sync="show &&!billConfig.autoPrint"  v-ref:modal large backdrop="false">
      <header slot="modal-header" class="modal-header">
        <h3 style="color:black" class="modal-title">收费发票</h3>
      </header>
      <article slot="modal-body" class="modal-body">
<!--        <div v-if="bill.data">-->
<!--          {{{bill.data}}}-->
<!--        </div>-->
        <validator name='v'>
          <form class="form-horizontal  select-overspread">
            <div class="row" style="display: flex;justify-content: center;" id='normal-bill' v-if="bill.data">
              {{{bill.data}}}
            </div>
          </form>
        </validator>
        <div style="display: flex;justify-content: center;" v-show="newBillShow">
          <iframe :src="url" style="width:100%;height:350px" class="iframe_style"></iframe>
        </div>
      </article>
      <footer slot="modal-footer" class="modal-footer">
        <div v-if="billConfig.hasBillManage">
          <div class="col-sm-2" >
            <span><strong>发票号:{{model.f_using_number}}</strong></span>
          </div>
        </div>
        <button type="button" class="btn btn-success" @click='print(true)'>选择打印机打印</button>
        <button type="button" class="btn btn-success" @click='print()' @keyup.enter="print()" v-el:confirmbutton>打印</button>
        <!--        <report-print id='normal-bill' top='5mm' left='5mm'  width='90%'  height='80%' :notrepeat="true" :showbtn="false" v-ref:reportprint></report-print>-->
        <button type="button" class="btn btn-default"  @click='cancel()' v-if="!billConfig.hasBillManage">取消</button>
      </footer>
    </modal>
  </div>
</template>
<script>
  import { DataModel } from 'vue-client'

  let getBillData = async function (self, val) {
    console.log('temp:', self)
    let temp = {
      reprint: "'正常'",
      operator: `'${self.$login.f.name}'`,
      condition: self.data.id
    }
    if (self.data.fillgasid) {
      temp.condition = `"${self.data.fillgasid}"`
    }
    if (self.data.url) {
      self.url = ''
      self.url = self.data.url + '?id=' + encodeURIComponent(self.data.id)
      self.newBillShow = true
    } else {
      console.log('self.billData.url:', self.billData.url)
      self.bill = new DataModel(self.billData.url, temp)
      await self.bill.search(self.data.id)
      // 获取发票号
      self.model.f_using_number = self.billData.bill.number
    }
  }

  export default {
    title: '收费发票',
    data () {
      return {
        model: {
          f_using_number: null
        },
        bill: {},
        url: '',
        newBillShow: false,
        messShow: false
      }
    },
    props: ['show','data','billData', 'billConfig'],
    ready () {
      console.log('打票', this.billConfig, this.billData)
    },
    methods: {
      // 确认按钮获得焦点
      confirmbuttonfocus () {
        this.$nextTick(() => {
          this.$els.confirmbutton.focus()
        })
      },
      cancel  () {
        this.$dispatch('toggle')
      },
      getbill () {
        this.$refs.reportprint.isPrint = true
        let val = true
        getBillData(this, val).then(() => {
          this.$emit('ready')
        }).catch((error) => {
          this.$emit('error', error)
        })
      },
      async print (select) {
        // 更新系统发票
        try {
          if (this.billConfig.hasBillManage) {
            if (this.data.f_bill_type != '清算单') { await this.$CommonService.openPaperBill(this.data.id, this.data.f_bill_type, this.billConfig.billType, this.billData.bill, '正常') }
          } else {
            await this.$resetpost('rs/logic/sale_billReprint', {data: this.data}, {resolveMsg: null, rejectMsg: '票据补打出错！！'})
          }
          if (select) {
            this.$refs.reportprint.print(true)
          } else {
            this.$refs.reportprint.print()
          }
        } catch (error) {
          this.$dispatch('refresh')
        }
      }
    },
    watch: {
      'show' (val) {
        if (val) {
          getBillData(this, val).then(() => {
            if(this.billConfig.autoPrint){
              this.print()
            }
            this.$emit('ready')
          }).catch((error) => {
            this.$emit('error', error)
          })
          this.confirmbuttonfocus()
        }
      }
    },
    events: {
      'print' () {
        // 对票据明细进行更新或插入操作
        this.$dispatch('printok', '发票打印', this.data)
      },
      'print-error' () {
        this.$dispatch('error', '发票打印', this.data, null)
      }
    }
  }
</script>
<style >
.iframe_style{
  border: medium none;
}
</style>
