<template>
  <div>

    <div>
      <divider>抬头类型({{ active }})</divider>

      <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
                       :disabled="disabledStatus"></x-input>
              <x-input title="电子邮箱" v-model="personemail" type="email" placeholder="用于向您发送电子邮箱" required
                       is-type="email" :disabled="disabledStatus"></x-input>
              <x-input title="备注信息" v-model="personremark" type="text" placeholder="请填写备注信息"
                       :disabled="disabledStatus"></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
                       :disabled="disabledStatus"></x-input>
              <x-input title="纳税人识别号" v-model="num" type="text" placeholder="请填写纳税人识别号" required
                       :disabled="disabledStatus"></x-input>
              <x-input title="注册地址" v-model="address" type="text" placeholder="请填写公司注册地址"
                       :disabled="disabledStatus"></x-input>
              <x-input title="注册电话" v-model="iphone" type="text" placeholder="请填写公司注册电话"
                       :disabled="disabledStatus"></x-input>
              <x-input title="开户行" v-model="bankName" type="text" placeholder="请填写公司开户账户"
                       :disabled="disabledStatus"></x-input>
              <x-input title="开户账号" v-model="bankNum" type="text" placeholder="请填写公司开户账号"
                       :disabled="disabledStatus"></x-input>
              <x-input title="电子邮箱" v-model="email" type="email" placeholder="用于向您发送电子邮箱" required
                       :disabled="disabledStatus"
                       is-type="email"></x-input>
              <x-input title="备注信息" v-model="remark" type="text" placeholder="请填写备注信息"
                       :disabled="disabledStatus"></x-input>
            </group>
          </div>
        </swiper-item>
      </swiper>

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

    </div>


  </div>
</template>

<script>


import { updateCustInvoiceInfo } from "@/api/invoice/invoice.js";
export default {
  name: "checkEdit",
  data() {
    return {
      active: "个人",
      index: 1,  // 个人是0  企业是1
      disabledStatus: false, // 是编辑还是查看状态
      btnShow: true, // 是编辑还是查看状态
      personname: "",
      personemail: "",
      personremark: "",
      name: "",//企业发票抬头
      email: "",//企业邮箱
      remark: "",//企业备注信息
      num: "",//企业纳税人识别号
      address: "",//企业注册地址
      iphone: "",//企业注册电话
      bankName: "",
      bankNum: "",
      id: "",
      isDefault: ""
    };
  },
  mounted() {
    let status = this.$route.query.status;
    console.log(status);  // 0 查看  1编辑
    let type = this.$route.query.type;
    console.log(type);  // 0 是个人  1是企业
    let data = JSON.parse(sessionStorage.getItem("invoiceData"));
    console.log(data);
    this.isDefault = data.isDefault;
    this.id = data.id;
    if (status == 0) {
      this.disabledStatus = true;
      this.btnShow = false;
    }
    if (status == 1) {
      this.disabledStatus = false;
      this.btnShow = true;
    }
    if (type == 0) {
      this.index = 0;
      this.active = "个人";
      this.personname = data.name;
      this.personemail = data.email;
      this.personremark = data.remark;
    }
    if (type == 1) {
      this.index = 1;
      this.active = "企业";
      this.name = data.name;
      this.email = data.email;
      this.remark = data.remark;
      this.num = data.taxid;
      this.address = data.address;
      this.iphone = data.phone;
      this.bankName = data.bankName;
      this.bankNum = data.cardNo;
    }
  },
  methods: {
    // 编辑更新发票信息
    updateHandle: 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: this.isDefault,
          id: this.id
        };
        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,
          phone: this.iphone,//企业注册电话
          address: this.address,//企业注册地址
          phone: this.iphone,//企业注册电话
          taxid: this.num,//企业纳税人识别号
          bankName: this.bankName,
          cardNo: this.bankNum,
          isDefault: this.isDefault,
          id: this.id
        };
        jsondata = Object.assign(obj,this.$utils.commonParams())
      }
      jsondata.sign = this.$utils.signObject(jsondata);
      updateCustInvoiceInfo(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>
