<template>
  <div class="invoice-information">
    <el-form ref="ruleForm" :key="key" :model="ruleForm" :rules="rules" label-width="150px" label-position="top" class="rule-form-orange">
      <cy-info-title>开票信息</cy-info-title>
      <el-form-item label="公司名称" prop="platformName" class="one-form-item">
        <el-input v-model="ruleForm.platformName" class="one-form-item" readonly />
      </el-form-item>
      <el-form-item label="纳税人识别号" prop="socialCreditCode" class="one-form-item">
        <el-input v-model="ruleForm.socialCreditCode" class="one-form-item" />
      </el-form-item>
      <el-form-item label="地址" prop="address" class="one-form-item">
        <el-input v-model="ruleForm.address" class="one-form-item" />
      </el-form-item>
      <el-form-item label="电话" prop="phoneNumber" class="one-form-item">
        <el-input v-model="ruleForm.phoneNumber" class="one-form-item" />
      </el-form-item>
      <el-form-item label="开户行" prop="bankAccount" class="one-form-item">
        <el-input v-model="ruleForm.bankAccount" class="one-form-item" />
      </el-form-item>
      <el-form-item label="账号" prop="account" class="one-form-item">
        <el-input v-model="ruleForm.account" class="one-form-item" />
      </el-form-item>
    </el-form>
    <div class="submit-btn">
      <el-button style="width: 150px;" type="primary" @click="onSubmit">确定</el-button>
      <el-button style="width: 150px;" @click="() => { $router.go(-1) }">取消</el-button>
    </div>
  </div>
</template>

<script>
import { editInvoice, onSubmit } from '@/api/enterpriseManagement/enterpriseManagement'
export default {
  data() {
    return {
      key: 0,
      ruleForm: {
        platformName: '',
        socialCreditCode: '',
        address: '',
        phoneNumber: '',
        id: '',
        bankAccount: '',
        account: ''
      },
      tradingPlatformId: '',
      rules: {
        platformName: [
          { required: true, message: '请输入公司名称', trigger: 'blur' }
        ],
        socialCreditCode: [
          { required: true, message: '请输入纳税人识别号', trigger: 'blur' }
        ],
        address: [
          { required: true, message: '请输入地址', trigger: 'blur' }
        ],
        phoneNumber: [
          { required: true, message: '请输入电话', trigger: 'blur' }
        ],
        bankAccount: [
          { required: true, message: '请输入开户行', trigger: 'blur' }
        ],
        account: [
          { required: true, message: '请输入账号', trigger: 'blur' }
        ]
      }
    }
  },
  created() {
    this.editInvoice()
  },
  methods: {
    editInvoice() {
      const { id } = this.$route.query
      editInvoice({ id: id }).then(response => {
        this.ruleForm = {
          platformName: response.data.platformInfo.platformName,
          socialCreditCode: response.data.platformInvoice.socialCreditCode,
          address: response.data.platformInvoice.address,
          phoneNumber: response.data.platformInvoice.phoneNumber,
          id: response.data.platformInvoice.id,
          bankAccount: response.data.platformInvoice.bankAccount,
          account: response.data.platformInvoice.account
        }
        this.tradingPlatformId = response.data.platformInfo.id
      })
    },
    onSubmit() {
      const { platformName, socialCreditCode, address, phoneNumber, id, bankAccount, account } = this.ruleForm
      const params = {
        platformName,
        socialCreditCode,
        address,
        phoneNumber,
        id,
        bankAccount,
        account,
        tradingPlatformId: this.tradingPlatformId
      }
      onSubmit(params).then(() => {
        this.$message.success('提交成功')
        this.$router.push({ name: 'enterpriseManagement' })
      })
    }
  }
}
</script>

<style  scoped>

</style>
