<template>
  <div class="auto">
    <validator name='v'>
      <form novalidate class="form-horizontal">
        <div class="row">
          <div class="col-sm-4">
            <label for="f_paytype" class=" font_normal_body">付款方式:</label>
            <input type="text" class="input_search" style="width: 60%" v-model="model.f_payment" disabled/>
          </div>

          <div class="col-sm-4">
            <label for="f_pregas" class=" font_normal_body">预购气量:</label>
            <input type="number" class="input_search" style="width: 60%" v-model="model.f_pregas" disabled>
          </div>

          <div class="col-sm-4">
            <label for="f_preamount" class=" font_normal_body">预购金额:</label>
            <input type="number" class="input_search" style="width: 60%" v-model="model.f_preamount" disabled>
          </div>
        </div>
        <div class="row" style="margin-top:6px;">
          <div class="col-sm-4">
            <label for="f_print" class="font_normal_body">收&ensp;款&ensp;人:</label>
            <input type="text" class="input_search" style="width: 60%" v-model="model.f_operator" disabled>
          </div>
          <div class="col-sm-4">
            <label for="f_print" class="font_normal_body">部&emsp;&emsp;门:</label>
            <input type="text" class="input_search" style="width: 60%" v-model="model.f_depname" disabled>
          </div>
          <div class="col-sm-4">
            <label for="f_print" class="font_normal_body">收费时间:</label>
            <input type="text" class="input_search" style="width: 60%" v-model="model.f_operate_date" disabled>
          </div>
        </div>

        <div class="row" style="margin-top:6px;">

          <div class="col-sm-12">
            <label for="f_comments" class="font_normal_body">备&emsp;&emsp;注</label>
            <input type="text" class="input_search" style="width:87%" v-model="model.f_comments" placeholder="备注"/>
          </div>
        </div>
      </form>
      <print-bill :show="print" :bill-manager='config.hasBillManage' v-ref:printbill :bill-url='billUrl' v-on:toggle="close" @printok="printok" :data='row'></print-bill>
      <div style="text-align:right;margin-top:80px;margin-right:50px;">
        <button class="button_search" @click="confirm()" v-if="jurisdiction.includes('线下写卡')" :disabled='clickConfirm'>写卡</button>
        <button class="button_clear" @click="clean()">取消</button>
      </div>
    </validator>
  </div>
</template>
<script>
  /**
   *综合业务
   *卡表收费组件
   */
  import CardService from './CardService'
  // 执行保存逻辑
  let sellgasGen = async function (self) {
    try {
      self.row.cardInfo = self.cardData
      self.row.f_write_comments = self.model.f_comments
      await CardService.offlineWrite(self.row)
      // 开始打票
      self.clickConfirm = false
      await self.$showAlert('写卡成功', 'success', 2000)
      self.$dispatch('success')
    } catch (error) {
      self.$showAlert(error, 'danger', 0)
      self.$dispatch('refresh')
      self.clickConfirm = false
    }
  }

  export default {
    title: '线下写卡',
    data () {
      return {
        model: {},
        clickConfirm: false,
        jurisdiction: this.$login.r
      }
    },
    props: ['row', 'cardData'],
    ready () {
      if (this.row.unWriteSell) {
        this.model = this.row.unWriteSell[0]
      }
    },
    methods: {
      confirm () {
        if (!this.cardData && this.row.f_alias !== 'ShuMa') {
          this.$showAlert('请先进行读卡再进行线下写卡', 'warning', 3000)
          return
        }

        this.clickConfirm = true
        this.$showMessage(`对用户${this.row.f_user_name}进行写卡操作。该操作只做写卡操作。确定要进行该操作吗？`, ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            sellgasGen(this)
          }
        })
      },
      clean () {
        this.$dispatch('refresh', this.row)
      }
    }
  }
</script>

<style>
</style>
