<template>
  <div class="auto">
    <validator name='v'>
      <form novalidate class="form-horizontal">

        <div class="row" style="margin-top:5px;">
          <span style="color:red ">您进行的业务是【{{model.f_type}}】</span>
        </div>
        <div class="row" style="margin-top:10px;"  v-if='lose'>
          <div class="col-sm-4">
            <label class=" font_normal_body" title="参数名称：付款方式">收款方式</label>
            <v-select v-model="f_payment"
                      placeholder='请选择'
                      :value.sync="model.f_payment"
                      :options='paytype'
                      close-on-select clear-button></v-select>
          </div>

          <div class="col-sm-4" :class="[$v.printstyle.required ? 'select-error' : '']">
            <label for="f_print" class="font_normal_body">打印格式</label>
            <input type="text" v-show="false" v-model="$refs.printstyle.selectedItems"  v-validate:printstyle='{required: true }'>
            <v-select id="print"
                      v-model="f_print"
                      placeholder='请选择'
                      :value.sync="model.f_print"
                      :options='printstyle'
                      close-on-select clear-button v-ref:printstyle>
            </v-select>
          </div>
          <div class="col-sm-4">
            <label class=" font_normal_body">卡&emsp;&emsp;费</label>
            <input class="input_search" style="width:60%" type="number" v-model="model.f_cardfees">
          </div>
        </div>
        <!--<div class="row" style="margin-top:10px;" v-if="model.f_type === '其他'" :class="[$v.f_reason.required ? 'has-error' : 'has-success']">-->
        <!--<label for="f_reason" class=" font_normal_body">*补卡原因</label>-->
        <!--<input class="input_search" style="width:60%" v-model="model.f_reason" v-validate:f_reason='{required: true }'-->
        <!--placeholder="补卡原因" />-->
        <!--</div>-->
        <div class="row" style="margin-top:5px;">
          <label for="f_comments" class=" font_normal_body">备&emsp;&emsp;注</label>
          <input id="f_comments" class="input_search" style="width:87%" v-model="model.f_comments" v-validate:f_comments='{required: true }'
                 placeholder="补卡原因" />

        </div>
      </form>
      <accept-bill :show="acceptprint" :bill-url='acceptUrl' v-on:toggle="close" :data='row' :billdata="printData" @closeaccept="closeAccept" v-ref:acceptbill></accept-bill>
      <validate-bill v-if="hasValidateBill && lose" :data="model" @validate-bill="validateBill"></validate-bill>
      <print-bill :show="print" :bill-config='config' :bill-data='billData' v-on:toggle="close" @printok="printok"  :data='row' v-ref:printbill></print-bill>
      <div style="text-align:right;height:auto;margin-top:30px;margin-right:50px;">
        <button class="button_search btn-gn" @click="confirm()"  :disabled='!$v.valid || validateOk'>确认</button>
        <button class="button_clear btn-gn" @click="clean()" >取消</button>
      </div>
    </validator>
  </div>
  <upload :blodid="blodid" v-if="config.showupload" isremark="true" fusetype="机表发卡"></upload>
</template>
<script>
  /**
   *综合业务
   *补卡管理组件
   */

  let asyncReplaceManage = async function (self) {
    await self.$getConfig(self, 'ReplaceCardManage')
    console.log('补卡config', self)
    self.model.f_print = self.config.printType instanceof Array ? self.config.printType : [self.config.printType]
    self.model.f_payment = [self.config.payment]
    self.model.f_use_type = self.config.billType
    self.model.f_bill_type = self.model.f_print
    if (self.row.f_whether_hairpin == '已发') {
      self.model.f_type = '机表补卡'
    } else {
      self.model.f_type = '机表发卡'
    }
    self.hasValidateBill = self.config.hasBillManage

    self.fillcardChange(self.model.f_type)
  }

  export default {
    title: '机表发卡',
    data () {
      return {
        config: {
          showupload: false, // 默认不显示上传附件
          hasPrint: true,  // 默认打票
          hasBillManage: false,  // 默认不启用发票管理
          billType: '其他费用',   // 票据类型（燃气费，其他费用，调用的发票代码不同）
          printType: '普通收据', // 收据/电子票/专用发票/国税发票
          payment: '现金缴费'
        },
        model: {
          f_comments: '',
          f_cardfees: '',
          f_type: '机表发卡',
          f_cardfees: '',
          f_payment: [],
          f_print: [],
          f_replace_time: ''
        },
        printData: {
          reason: '',
          cardfee: ''
        },
        cardallot: null,
        lose: true,
        blodid: '',

        print: false,
        billData: {
          url: 'rs/report/replace_sell',
          bill: ''
        },
        paytype: this.$appdata.getParam('付款方式') ? this.$appdata.getParam('付款方式') : [],
        // 启用发票管理需要对票号进行验证
        hasValidateBill: false,
        validateOk: false,

        acceptprint: false,
        acceptUrl: ''
      }
    },
    props: ['row', 'cardData'],
    ready () {
      this.blodid = this.row.f_userinfo_id
      asyncReplaceManage(this).then(() => {
        this.$emit(ready())
      }).catch((error) => {
        this.$emit('error', error)
      })
    },
    watch: {
      'model.f_type' (val) {
        this.fillcardChange(val)
      }
    },
    methods: {
      confirm () {
        this.$dispatch('no-button')
        this.writeCard()
      },
      // 写卡保存数据 迁至此处
      writeCard () {
        this.row.cardInfo = this.cardData
        this.row.f_card_id = this.row.f_userinfo_code
        this.$CardService.replaceCardJB(this.model, this.row).then((res) => {
          console.log('补卡返回。。', this.config.hasPrint + '===' + this.lose)
          if (this.config.hasPrint) {
            if (this.config.hasBillManage) {
              this.row.id = res.data.id
              this.row.f_bill_type = '补卡'
              this.row.f_bill_style = this.model.f_print[0]
              this.print = true
            } else {
              console.log('不保存打票记录')
              this.row.id = res.data.id
              this.print = true
            }
          } else {
            console.log('我没走打票')
            this.$dispatch('success', '补卡管理', this.row, res)
          }
        }
        ).catch(
          (error) => {
            if (error.status === 603) {
              this.$error('重复提交')
              return
            }
            this.$dispatch('error', '补卡管理', this.row, error)
          }
        )
      },
      closeAccept () {
        this.acceptprint = false
      },
      clean () {
        this.$dispatch('refresh')
      },
      close () {
        this.print = false
        this.acceptprint = false
        this.clean()
      },
      validateBill (val) {
        this.validateOk = !val.isOk
        this.billData.bill = val.bill
      },
      printok () {
        // 收据打完，判断是否还有其他票据进行请求 TODO
        this.$dispatch('success')
      },
      fillcardChange (val) {
        this.lose = true
      }
    }
  }
</script>

<style>
</style>
