<template>
  <el-form
    inline
    :model="form"
    ref="form"
    class="form-wrap"
    label-width="150px"
  >

    <div class="dialog-info">
      <el-form-item
        verify
        label="销售方名称"
        prop="invoiceSellerName">
        <el-input v-model="form.invoiceSellerName"></el-input>
      </el-form-item>
      <el-form-item
        verify
        label="纳税人识别号"
        prop="invoiceSellerTaxpayerNum">
        <el-input v-model="form.invoiceSellerTaxpayerNum"></el-input>
      </el-form-item>
      <el-form-item
        verify
        label="销售方地址"
        prop="invoiceSellerAddress">
        <el-input v-model="form.invoiceSellerAddress"></el-input>
      </el-form-item>
      <el-form-item
        verify
        label="销售方联系电话"
        prop="invoiceSellerPhone">
        <el-input v-model="form.invoiceSellerPhone"></el-input>
      </el-form-item>
      <el-form-item
        verify
        label="销售方开户银行"
        prop="invoiceSellerBank">
        <el-input v-model="form.invoiceSellerBank"></el-input>
      </el-form-item>
      <el-form-item
        verify
        label="销售方银行账号"
        prop="invoiceSellerBankAccount">
        <el-input v-model="form.invoiceSellerAccount"></el-input>
      </el-form-item>
    </div>

    <div class="dialog-btn-wrap">
      <el-button
        @click="reset"
        v-if="dialogType==='add'">
        重置
      </el-button>
      <el-button
        @click="handleClose"
        v-if="dialogType==='edit'">
        关闭
      </el-button>
      <el-button
        @click="submit"
        type="primary">
        保存
      </el-button>
    </div>
  </el-form>
</template>

<script>
import { updateInvoiceSeller } from '@/api/invoice'

export default {
  props: {
    currentItem: {
      type: Object,
      default: () => {}
    },
    dialogType: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      visible: false,
      form: {
        invoiceSellerName: '',
        invoiceSellerTaxpayerNum: '',
        invoiceSellerAddress: '',
        invoiceSellerPhone: '',
        invoiceSellerBank: '',
        invoiceSellerAccount: ''
      }
    }
  },
  watch: {
    visible (val) {
      this.reset()
      this.form = Object.assign({}, this.currentItem)
    }
  },
  methods: {
    handleClose () {
      this.$parent.handleClose()
    },
    reset () {
      this.$refs.form.resetFields()
    },
    submit () {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.updateTicket()
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    updateTicket () {
      updateInvoiceSeller(this.form).then(res => {
        this.$message.success('保存成功')
        this.reset()
        this.handleClose()
        this.$emit('updateList')
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.el-alert{
   margin-bottom: 20px;
   p{
      margin: 0;margin: 0;
   }
}

  .el-tag + .el-tag {
    margin-left: 10px;
  }
  .button-new-tag {
    margin-left: 10px;
    height: 32px;
    line-height: 30px;
    padding-top: 0;
    padding-bottom: 0;
  }
  .input-new-tag {
     ::v-deep .el-input{
      width: 90px;
      margin-left: 10px;
      vertical-align: bottom;
    }
  }
</style>
