<template>
  <div>
    <el-button  v-if="tool.checkAuth($route.name,'editBlueInvioce')" :disabled="status" size="small" type="text" @click="onShow">修 改</el-button>
    <el-dialog title="修改明细信息" :visible.sync="dialogFormVisible" append-to-body width="400px">
      <el-form :model="form" size="small" :rules="rules" ref="form" label-position="right" label-width="90px">
        <el-form-item label="含税金额">
          <el-input v-model="form.invoiceamount" disabled autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="含税单价" prop="price">
          <el-input v-model="form.price" @change="countInvoiceamount" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="数量" prop="invoiceaqty">
          <el-input v-model="form.invoiceaqty" @change="countInvoiceamount" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="税率" prop="taxrate">
          <el-input v-model="form.taxrate" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="dialogFormVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="onSubmit">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props:['data','sa_invoicebillid','status'],
  data () {
    return {
      dialogFormVisible:false,
      form:{},
      rules: {
        price: [
          { required: true, message: '含税单价不能为空', trigger: 'blur' }
        ],
        invoiceaqty: [
          { required: true, message: '数量不能为空', trigger: 'blur' }
        ],
        taxrate: [
          { required: true, message: '税率不能为空', trigger: 'blur' }
        ],
      }
    }
  },
  methods:{
    onShow () {
      this.form = {
        "sa_invoicebill_itemid": this.data.sa_invoicebill_itemid, 
        "sa_invoiceapply_orderid":this.data.sa_invoiceapply_orderid,
        "itemno": this.data.itemno, 
        "itemname": this.data.itemname, 
        "spec": this.data.spec,
        "price": this.data.price, 
        "invoiceaqty": this.data.num, 
        "invoiceamount": this.data.price * this.data.num,
        "taxrate":this.data.taxrate
      }
      this.dialogFormVisible = true
    },
    countInvoiceamount () {
      this.form.invoiceamount = this.form.invoiceaqty * this.form.price
    },
    onSubmit () {
      this.$refs['form'].validate(async (valid) => {
        if (!valid) return false
        const res = await this.$api.requested({
          "id": "20221227152903",
          "content": {
            "sa_invoicebillid":this.sa_invoicebillid,
            "sa_invoiceapplyid":this.$route.query.id,
            "iteminfos":[{
              "sa_invoicebill_itemid": this.form.sa_invoicebill_itemid, 
              "sa_invoiceapply_orderid":this.form.sa_invoiceapply_orderid,
              "itemno": this.form.itemno, 
              "itemname": this.form.itemname, 
              "spec": this.form.spec,
              "price": this.form.price, 
              "invoiceaqty": this.form.invoiceaqty, 
              "invoiceamount": 0,
              "taxrate":this.form.taxrate
            }]
          }
        })
        this.tool.showMessage(res,()=>{
          this.$emit('onSuccess',true)
          this.dialogFormVisible = false
        })
      });
    }
  }
}

</script>
<style>
</style>