<template>
  <div>

    <div>
      <divider>抬头类型</divider>
      <tab :line-width=2 active-color='#fc378c' v-model="index">
        <tab-item class="vux-center" :selected="active === item" v-for="(item, index) in list2" @click="active = item"
                  :key="index">{{item}}
        </tab-item>
      </tab>
      <swiper v-model="index" :show-dots="false" height="400px">
        <swiper-item :key="0">
          <div class="tab-swiper vux-center">
            <group title="发票详情">
              <x-input title="发票抬头" v-model="personname" type="text" placeholder="请填写抬头名称" required></x-input>
              <x-input title="电子邮箱" v-model="personemail" type="email" placeholder="用于向您发送电子邮箱" required
                       is-type="email"></x-input>
              <x-input title="备注信息" v-model="personremark" type="text" placeholder="请填写备注信息"></x-input>
            </group>
          </div>
        </swiper-item>
        <swiper-item :key="1">
          <div class="tab-swiper vux-center">
            <group title="发票详情" label-width="120px">
              <x-input title="发票抬头" v-model="name" type="text" placeholder="请填写抬头名称" required></x-input>
              <x-input title="纳税人识别号" v-model="num" type="text" placeholder="请填写纳税人识别号" required></x-input>
              <x-input title="注册地址" v-model="address" type="text" placeholder="请填写公司注册地址"></x-input>
              <x-input title="注册电话" v-model="iphone" type="text" placeholder="请填写公司注册电话"></x-input>
              <x-input title="开户行" v-model="bankName" type="text" placeholder="请填写公司开户账户"></x-input>
              <x-input title="开户账号" v-model="bankNum" type="text" placeholder="请填写公司开户账号"></x-input>
              <x-input title="电子邮箱" v-model="email" type="email" placeholder="用于向您发送电子邮箱" required
                       is-type="email"></x-input>
              <x-input title="备注信息" v-model="remark" type="text" placeholder="请填写备注信息"></x-input>
            </group>
          </div>
        </swiper-item>
      </swiper>

      <div style="padding: 15px">
        <x-button type="warn" @click.native="fillBtn">确定</x-button>
      </div>

    </div>

    <toast v-model="showToast" type="text" :time="800" is-show-mask :text="showVal" position="top" width="15em"></toast>
  </div>
</template>

<script>

import { insertCustInvoiceInfo } from "@/api/invoice/invoice.js";
export default {
  name: "fill",
  data() {
    return {
      list2: ["个人", "企业"],
      active: "个人",
      index: 0,
      personname: "",
      personemail: "",
      personremark: "",
      name: "",//企业发票抬头
      email: "",//企业邮箱
      remark: "",//企业备注信息
      num: "",//企业纳税人识别号
      address: "",//企业注册地址
      iphone: "",//企业注册电话
      bankName: "",
      bankNum: "",
      showToast: false,
      showVal: "" // 提示内容
    };
  },
  mounted() {
  },
  methods: {
    fillBtn: function() {
      let jsondata = {}
      if (this.index == 0) {
        if (!this.personname) {
          this.showToast = true;
          this.showVal = "请填写个人发票抬头名称";
          return false;
        }
        if (!this.personemail) {
          this.showToast = true;
          this.showVal = "请填写个人发票邮箱";
          return false;
        }
        let obj = {
          invoiceType: "0",//  0 ：个人  ， 1:企业   ，3:非营业单位
          name: this.personname,
          email: this.personemail,
          remark: this.personremark,
          isDefault: "1"
        };
        jsondata = Object.assign(obj,this.$utils.commonParams())
      }
      if (this.index == 1) {
        if (!this.name) {
          this.showToast = true;
          this.showVal = "请填写企业发票抬头名称";
          return false;
        }
        if (!this.email) {
          this.showToast = true;
          this.showVal = "请填写个人发票邮箱";
          return false;
        }
        if (!this.num) {
          this.showToast = true;
          this.showVal = "请填写企业纳税人识别号";
          return false;
        }
        let obj = {
          invoiceType: "1",//  0 ：个人  ， 1:企业   ，3:非营业单位
          name: this.name,
          email: this.email,
          remark: this.remark,
          isDefault: "1",
          phone: this.iphone,//企业注册电话
          address: this.address,//企业注册地址
          phone: this.iphone,//企业注册电话
          taxid: this.num,//企业纳税人识别号
          bankName: this.bankName,
          cardNo: this.bankNum
        };
        jsondata = Object.assign(obj,this.$utils.commonParams())
      }
      jsondata.sign = this.$utils.signObject(jsondata);
      insertCustInvoiceInfo(jsondata).then(response => {
        console.log(jsondata);
        console.log(response);
        if(response.code == 0){
          this.$router.push({
            path: "invoiceOpt"
          });
        }else{
          alert(response.message)
        }

      });
    }
  }
};
</script>

<style scoped>

</style>
