invoiceInfo.vue 4.6 KB
Newer Older
李晓兵's avatar
李晓兵 committed
1 2 3 4 5 6
<template>
  <list-item :item-height="44">
    <item :showArrow="true">
      <div slot="name">纳税人类型</div>
      <input
        slot="content"
linxin's avatar
linxin committed
7
        v-model="invoiceInfo.taxpayer_type_n"
李晓兵's avatar
李晓兵 committed
8 9 10 11 12 13 14 15 16 17 18
        type="text"
        readonly
        placeholder="请选择"
        onfocus="this.blur()"
        @click="selectTaxpayer"
      >
    </item>
    <item :showArrow="true">
      <div slot="name">发票类型</div>
      <input
        slot="content"
linxin's avatar
linxin committed
19
        v-model="invoiceInfo.invoice_kind_n"
李晓兵's avatar
李晓兵 committed
20 21 22 23 24 25 26 27 28 29 30 31 32
        type="text"
        readonly
        placeholder="请选择"
        onfocus="this.blur()"
        @click="selectInvoiceType"
      >
    </item>
    <item>
      <div slot="name">发票抬头</div>
      <input slot="content" v-model="invoiceInfo.invoice_title" type="text" placeholder="请输入发票抬头" >
    </item>
    <item>
      <div slot="name">发票地址及电话</div>
linxin's avatar
linxin committed
33 34 35 36 37 38
      <textarea
        slot="content"
        ref="myTestarea"
        v-model="invoiceInfo.invoice_bp_address_phone_num"
        cols="30" rows="1" type="text" placeholder="请输入发票地址及电话"
        @input="addRows(invoiceInfo.invoice_bp_address_phone_num)" />
李晓兵's avatar
李晓兵 committed
39 40 41
    </item>
    <item>
      <div slot="name">发票开户行及账号</div>
linxin's avatar
linxin committed
42
      <textarea
李晓兵's avatar
李晓兵 committed
43
        slot="content"
linxin's avatar
linxin committed
44
        ref="myTestareaLive"
李晓兵's avatar
李晓兵 committed
45
        v-model="invoiceInfo.invoice_bp_bank_account"
linxin's avatar
linxin committed
46 47
        cols="30"
        rows="1"
李晓兵's avatar
李晓兵 committed
48 49
        type="text"
        placeholder="请输入发票开户行及账号"
linxin's avatar
linxin committed
50 51
        @input="addRowsLive(invoiceInfo.invoice_bp_bank_account)"
      />
李晓兵's avatar
李晓兵 committed
52 53 54 55 56
    </item>
  </list-item>
</template>
<script>
export default {
linxin's avatar
linxin committed
57 58 59 60 61 62 63 64 65 66
  props: {
    'baseInfo': {
      type: Object,
      default: {},
    },
    'tabNum': {
      type: Number,
      default: 0,
    },
  },
李晓兵's avatar
李晓兵 committed
67 68 69 70 71
  data () {
    return {
      invoicList: [],
      taxpayerList: [],
      invoiceInfo: {
linxin's avatar
linxin committed
72 73
        taxpayer_type_n: '',
        invoice_kind_n: '',
李晓兵's avatar
李晓兵 committed
74 75 76 77 78 79 80 81
        taxpayer_type: '',
        invoice_kind: '',
        invoice_title: '',
        invoice_bp_address_phone_num: '',
        invoice_bp_bank_account: '',
      },
    }
  },
linxin's avatar
linxin committed
82 83 84 85 86 87 88
  watch: {
    tabNum (newVal, oldVal) {
      if (newVal === 2) {
        Object.assign(this.invoiceInfo, this.baseInfo)
      }
    },
  },
李晓兵's avatar
李晓兵 committed
89 90 91 92 93 94 95 96
  created () {
    this.getInvoiceType()
    this.getTaxpayer()
  },
  updated () {
    this.sendList()
  },
  methods: {
linxin's avatar
linxin committed
97
    addRows (e) {
linxin's avatar
linxin committed
98
      let addNum = parseInt(e.length / 16)
linxin's avatar
linxin committed
99 100 101 102 103 104 105
      if (addNum === 0) {
        this.$refs.myTestarea.rows = 1
      } else if (addNum >= addNum - 1 && addNum < addNum + 1) {
        this.$refs.myTestarea.rows = addNum + 1
      }
    },
    addRowsLive (e) {
linxin's avatar
linxin committed
106
      let addNum = parseInt(e.length / 16)
linxin's avatar
linxin committed
107 108 109 110 111 112
      if (addNum === 0) {
        this.$refs.myTestareaLive.rows = 1
      } else if (addNum >= addNum - 1 && addNum < addNum + 1) {
        this.$refs.myTestareaLive.rows = addNum + 1
      }
    },
李晓兵's avatar
李晓兵 committed
113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154
    getInvoiceType () {
      let vm = this
      let url = process.env.basePath + 'bp_invoice_kind_query'
      let param = {}
      vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.invoicList = res.lists.map(item => {
            return {
              code: item.invoice_kind,
              code_name: item.invoice_kind_n,
            }
          })
        }
      })
    },
    getTaxpayer () {
      let vm = this
      let url = process.env.basePath + 'bp_taxpayer_type_query'
      let param = {}
      vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.taxpayerList = res.lists.map(item => {
            return {
              code: item.taxpayer_type,
              code_name: item.taxpayer_type_n,
            }
          })
        }
      })
    },
    selectInvoiceType (e) {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.invoicList,
        code: 'bp_type',
        object: {},
        returnItem: function (index, obj) {
          vm.invoiceInfo.invoice_kind = obj.bp_type
linxin's avatar
linxin committed
155
          vm.invoiceInfo.invoice_kind_n = obj.bp_type_n
李晓兵's avatar
李晓兵 committed
156 157 158 159 160 161 162 163 164 165 166
        },
      })
    },
    selectTaxpayer (e) {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.taxpayerList,
        code: 'bp_type',
        object: {},
        returnItem: function (index, obj) {
          vm.invoiceInfo.taxpayer_type = obj.bp_type
linxin's avatar
linxin committed
167
          vm.invoiceInfo.taxpayer_type_n = obj.bp_type_n
李晓兵's avatar
李晓兵 committed
168 169 170 171 172 173 174 175 176 177 178 179 180 181
        },
      })
    },
    sendList () {
      this.$emit('getinvoiceList', this.invoiceInfo)
    },
  },
}
</script>
<style scoped>
input::placeholder{
    color: #B4B4B5;
}
</style>