<template>
  <div class="auto">
    <validator name='v'>
      <form novalidate class="form-horizontal">
        <div class="row">
          <div class="col-sm-4 form-group" :class="[$v.f_payment.required ? 'has-error' : 'has-success']">
            <label for="f_paytype" class="font_normal_body ">充值方式</label>
            <input class="input_search"  type="text" v-show="false" v-model="model.f_payment"
                   v-validate:f_payment='{required: true}' >
            <v-select id="f_paytype"
                      v-model="model.f_payment"
                      placeholder='充值方式'
                      :value.sync="model.f_payment"
                      :options='ftype'
                      style="width: 60%"
                      close-on-select></v-select>
          </div>
          <div class="col-sm-4 form-group"
               :class="[$v.f_refund_fee.required || $v.f_refund_fee.dctest ? 'has-error' : 'has-success']">
            <label class="font_normal_body">充值金额</label>
            <input class="input_search" style="width:60%" type="number" v-model="model.recharge" :disabled="dis"
                   v-validate:model.recharge='{required: true}' placeholder="充值金额">
          </div>
        </div>
        <div class=" col-sm-4 form-group">
          <label for="f_print" class="font_normal_body">票据类型</label>
          <v-select id="print"
                    v-model="f_print"
                    placeholder='请选择'
                    :multiple="mulPrint"
                    :value.sync="model.f_print"
                    :options='printstyle'
                    value-single
                    close-on-select clear-button>
          </v-select>
        </div>
        <div class="row">
          <div class="col-sm-8">
            <label for="f_paper_account" class="font_normal_body ">&nbsp;&nbsp;&nbsp;备注&nbsp;&nbsp;&nbsp;</label>
            <input id="f_paper_account" class="input_search" style="width:80%" v-model="model.f_comments">
          </div>
        </div>
      </form>
      <div style="text-align:right;">
        <button class="button_search btn-gn" @click="recharge" :disabled='!$v.valid'>确认</button>
        <button class="button_clear btn-gn" @click="clean()">取消</button>
      </div>
    </validator>
  </div>
</template>


<script>
  export default {
    title: '充值',
    data () {
      return {
        model: {
          recharge:'',
          f_comments: '',
          f_payment:'',
          f_balance_amount:'',
          f_print:[]
        },
        dis: false,
        validateOk: false,
        ftype: this.$appdata.getParam('缴费类型'),
        // ftype: [
        //   {label: '现金充值', value: '现金充值'},
        //   {label: '微信', value: '微信'},
        //   {label: '支付宝', value: '支付宝'},
        //   {label: '银行卡支付', value: '银行卡支付'}
        // ],
        modalData: {
          rows: []
        },
        modalShow: false,
        printstyle: this.$appdata.getParam('打印格式')
      }
    },
    props: ['row'],
    ready () {
    },
    watch: {
    },
    methods: {
      async recharge(){
        let rrr = await this.$showMessage('请确认充值方式和金额', ['confirm', 'cancel'])
        if (rrr != 'confirm') {
          return
        }
        let param = {
          recharge:this.model.recharge,
          f_payment:this.model.f_payment,
          f_comments:this.model.f_comments,
          f_print:this.model.f_print,
          row:this.row
        }
        console.log(this.row)
        await this.$resetpost('rs/logic/recharge', param, {resolveMsg: '充值成功', rejectMsg: '充值失败'})
        this.$dispatch('success')
      },
      clean () {
        this.$dispatch('refresh')
      },
      printok () {
        this.$dispatch('success')
      },
      validateBill (val) {
        this.validateOk = !val.isOk
        this.billData.bill = val.bill
      }
    }
  }
</script>
<style lang="less">
  .modal_class {
  .table > tbody > tr > td {
    text-align: center;
  }
  }
</style>
