<template>
  <div class="flex-row">
    <div class="span" style="overflow-y: auto;">
      <validator name='v'>
        <form novalidate class="form-horizontal">
          <div class="row" style="margin-top:10px;">
            <div class="col-sm-4">
              <label for="f_brand_spec" class="font_normal_body ">收费类型</label>
                <v-select id="f_brand_spec"
                          v-model="model.f_brand_spec"
                          placeholder='材料'
                          :value.sync="model.f_brand_spec"
                          :options='brandspec'
                          close-on-select clear-button>
                </v-select>
            </div>
            <div class="col-sm-4">
              <label for="f_paytype" class="font_normal_body">付款方式</label>
                <v-select id="f_payment"
                          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">
              <label for="f_print" class="font_normal_body">打印格式</label>
                <v-select id="print"
                          v-model="f_print"
                          placeholder='请选择'
                          :value.sync="model.f_print"
                          :options='printstyle'
                          close-on-select clear-button>
                </v-select>
            </div>

          </div>

          <div class="row" style="margin-top:10px;" v-if="model.f_brand_spec[0]=='其他费用'">
            <div class="col-sm-4" :class="[$v.f_fee_type.required ? 'has-error' : 'has-success']">
              <input v-validate:f_fee_type='{required: true}' v-model="model.f_fee_type" v-show="false"/>
              <label for="f_fee_type" class="font_normal_body ">其他收费类型</label>
                <v-select id="f_fee_type"
                          v-model="model.f_fee_type"
                          placeholder='请选择'
                          :value.sync="model.f_fee_type"
                          :options='feetype'
                          close-on-select clear-button>
                </v-select>
            </div>

            <div class="col-sm-4">
              <label for="f_fee_time" class="font_normal_body">本次购买时间</label>
                <v-select id="f_fee_time"
                          v-model="model.f_fee_time"
                          placeholder='请选择'
                          :value.sync="model.f_fee_time"
                          :options='feetime'
                          close-on-select clear-button>
                </v-select>
            </div>
          </div>
          <div class="row" style="margin-top:10px;">
            <div class="col-sm-4"
                 :class="[$v.f_unitprice.required || $v.f_unitprice.dctest? 'has-error' : 'has-success']">
              <label style="" for="f_unitprice" class=" font_normal_body">&nbsp;&nbsp;&nbsp;单价&nbsp;&nbsp;&nbsp;</label>
                <input class="input_search" style="width:60%" type="number" min="1"
                       v-validate:f_unitprice='{required: true, dctest: [0, ">" ] }'
                       v-model="model.f_unitprice" placeholder="单价" v-next-el='sl'>
            </div>
            <div class="col-sm-4"
                 :class="[$v.f_number.required || $v.f_number.dctest? 'has-error' : 'has-success']">
              <label style="" for="f_number" class="font_normal_body">&nbsp;&nbsp;&nbsp;数量&nbsp;&nbsp;&nbsp;</label>
                <input class="input_search"  style="width:60%" type="number" min='1'
                       v-validate:f_number='{required: true, dctest: [0, ">" ] }'
                       v-model="model.f_number" placeholder="数量" v-next-el='sk' v-el:sl>
            </div>
            <div class="col-sm-4" :class="[$v.f_collection.required ? 'has-error' : 'has-success']">
              <label for="f_collection" class="font_normal_body">&nbsp;&nbsp;&nbsp;收款&nbsp;&nbsp;&nbsp;</label>
                <input class="input_search " style="width:60%" type="number" min="0" v-model="model.f_collection"
                       v-validate:f_collection='{required: true }' placeholder="0" v-el:sk>
            </div>
          </div>
          <div class="row" style="margin-top:10px;" v-if="model.f_payment[0].includes('POS')">
            <div class="col-sm-4">
              <label for="f_voucher_number" class="font_normal_body">&nbsp;&nbsp;&nbsp;凭证号</label>
              <input type="text" class="input_search" style="width:60%" v-model="model.f_voucher_number" placeholder="凭证号">
            </div>
          </div>
          <div class="row" style="margin-top:10px;">
            <div class="col-sm-4">
              <label for="f_voucher_number" class="font_normal_body">服务人员</label>
                <v-select v-model="model.f_service_person"
                          placeholder='请选择'
                          :value.sync="model.f_service_person"
                          :options='services'
                          close-on-select clear-button>
                </v-select>
            </div>
            <div class="col-sm-8" >
              <label for="f_comments" class=" font_normal_body">&nbsp;&nbsp;&nbsp;备注&nbsp;&nbsp;&nbsp;</label>
              <input type="text" class="input_search" style="width:80%" v-model="model.f_comments" rows="1" placeholder="备注"></input>
            </div>
          </div>
        </form>
        <validate-bill v-if="hasValidateBill" :data="model" @validate-bill="validateBill"></validate-bill>
        <print-bill :show="print" :data='row' :bill-config='config' :bill-data='billData' v-on:toggle="close" @printok="printok" v-ref:printbill></print-bill>
        <!-- <print-other-charge-bill :show="print" v-ref:printbill :row='row' :logic='model' v-on:success="close" v-on:toggle="close"></print-other-charge-bill> -->
        <!-- <tax-other-bill :show="taxprint"  v-ref:taxprintbill :row='row' :logic='model' v-on:success="close" v-on:toggle="close"></tax-other-bill> -->
        <div style="text-align:right;height: 25%;">
          <button class="button_search" @click="confirm()" :disabled='!$v.valid || validateOk'>确认</button>
          <button class="button_clear" @click="clean()">取消</button>
        </div>
      </validator>

    </div>
  </div>
</template>
<script>
  let otherChargeGen = async function (self) {
    try {
      let res = await self.$LogicService.otherCharge(self.model, self.row)
      console.log('其他收费返回id', res)
      if (self.config.hasPrint) {
        if (self.model.f_print[0] === '普通收据') {
          if (self.config.hasBillManage) {
            self.row.id = res.data.id
            self.row.f_bill_type = '其他收费'
            self.row.f_bill_style = self.model.f_print[0]
            self.print = true
          } else {
            self.row.id = res.data.id
            self.print = true
          }
        } else if (self.model.f_print[0] === '国税发票') {
          // TODO
          self.$dispatch('success')
        } else if (self.model.f_print[0] === '电子发票') {
          // TODO
          self.$dispatch('success')
        }
      } else {
        self.$dispatch('success')
      }
    } catch (error) {
      self.$showAlert(error, 'danger', 0)
      self.$dispatch('refresh')
    }
  }

  let asyncOtherCharge = async function (self) {
    await self.$getConfig(self, 'OtherCharge')
    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_brand_spec = [self.config.brandspec]

    self.model.f_use_type = self.config.billType
    self.model.f_bill_type = self.model.f_print
    self.hasValidateBill = self.config.hasBillManage
  }
  export default {
    title: '其他收费',
    data () {
      return {
        config: {
          hasPrint: false,  //默认打票
          hasBillManage: false,  //默认不启用发票管理
          billType: '其他费用',   // 票据类型（燃气费，其他费用，调用的发票代码不同）
          printType: '普通收据', // 收据/电子票/专用发票/国税发票
          payment: '现金缴费',  // 付款方式
          brandspec: '材料费' // 收费类型
        },
        model: {
          f_brand_spec: ['材料费'],
          f_print: [],
          f_payment: '现金缴费',
          f_number: 0,
          f_unitprice: 0,
          f_collection: 0,
          f_comments: '',
          f_voucher_number: '',
          f_service_person: '',
          //用户其他费用信息
          t_userfees: '',
          f_fee_type: [],
          f_fee_time: ['12'],
        },
        print: false,
        taxprint: false,
        billData: {
          url: 'rs/report/otherCharge_bill',
          bill: ''
        },

        // 启用发票管理需要对票号进行验证
        hasValidateBill: false,
        validateOk: false,

        brandspec: this.$appdata.getParam('品名及规格'),
        printstyle: this.$appdata.getParam('打印格式'),
        paytype: this.$appdata.getParam('付款方式'),
        feetype: this.$appdata.getParam('其他费用'),
        services: this.$appdata.getParam('服务人员')
      }
    },
    props: ['row'],
    ready () {
      // this.model.f_unitprice = this.$appdata.getSingleValue('置换气费')
      asyncOtherCharge(this)
    },
    watch: {
      'model.f_unitprice' (val) {
        this.model.f_collection = (((val - 0) * (this.model.f_number - 0)) - 0).toFixed(4)
      },
      'model.f_number' (val) {
        this.model.f_collection = (((val - 0) * (this.model.f_unitprice - 0)) - 0).toFixed(4)
      },
      'model.f_brand_spec' (val) {
        if (val[0]) {
          this.model.f_unitprice = this.$appdata.getSingleValue(val[0]) ? this.$appdata.getSingleValue(val[0]) : 0
        }
      },
      'model.f_fee_type'(val){
        if (val[0]) {
          this.userfees(this.row.f_userinfo_id, val[0])
        }
      }
    },
    methods: {
      confirm () {
        otherChargeGen(this)
      },
      clean () {
        this.$dispatch('refresh', this.row)
      },
      close () {
        this.taxprint = false
        this.print = false
        this.clean()
      },
      printok () {
        this.$dispatch('success')
      },
      validateBill (val) {
        this.validateOk = !val.isOk
        this.billData.bill = val.bill
      },
      async userfees(userinfoid, feetype){
        this.model.t_userfees = await this.$resetpost('rs/sql/saleSingleTable', {
          data: {
            tablename: 't_userfees',
            condition: `f_userinfo_id=${userinfoid} and f_fee_type='${feetype}'`
          }
        }, {resolveMsg: null, rejectMsg: '查询客户其他费用失败!'})
      }
    },
    computed: {
      feetime(){
        return [{label: '一个月', value: '1'}, {label: '三个月', value: '3'}, {label: '六个月', value: '6'}, {
          label: '一年',
          value: '12'
        }]
      }
    }
  }
</script>

<style>
</style>
