<template>
  <div>
    <el-button size="small" type="primary" @click="drawer = true">新 建</el-button>
    <el-drawer
      title="新建开票申请单"
      :visible.sync="drawer"
      direction="rtl"
      :show-close="false"
      append-to-body
      size="700px"
      @close="onClose">
      <div class="drawer__panel">
        <el-row :gutter="20">
          <el-form :model="form" :rules="rules" ref="form" class="demo-form-inline" size="small" label-position="right" label-width="110px">
            <el-col :span="12">
              <p class="normal-title normal-margin">企业信息</p>
              <el-form-item label="选择企业" prop="enterprisename">
                <el-popover
                  placement="bottom"
                  trigger="click"
                  v-model="visible">
                  <invoiceCanUseAgent id="20221216145803" :qiyi="true" ref="UseAgent" @selectRow="selectRow"></invoiceCanUseAgent>
                  <el-input readonly slot="reference" v-model="form.enterprisename" @focus="queryAgent" suffix-icon="el-icon-arrow-down" placeholder="企业"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <p class="normal-title normal-margin">财务信息</p>
            </el-col>
            <el-col :span="12">
              <el-form-item label="税号" prop="taxno">
                <el-popover
                  placement="bottom"
                  trigger="click"
                  :disabled="form.enterprisename === ''"
                  v-model="visible1">
                  <invoiceCanUseTax :sys_enterpriseid="form.sys_enterpriseid" ref="UseTax" @selectTaxRow="selectTaxRow">
                    <addInvoice slot="add" @onSuccess="$refs.UseTax.listData()" :data="{sys_enterpriseid:form.sys_enterpriseid}"></addInvoice>
                  </invoiceCanUseTax>
                  <el-input readonly :disabled="form.enterprisename === ''" slot="reference" v-model="form.taxno" @focus="queryTax" suffix-icon="el-icon-arrow-down" placeholder="选择税号"></el-input>
                </el-popover>
              </el-form-item>
              <el-form-item label="开票单位">
                <el-input readonly v-model="form.invo_enterprisename" placeholder="开票单位"></el-input>
              </el-form-item>
              <el-form-item label="开票地址">
                <el-input readonly v-model="form.address" placeholder="开票地址"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="联系电话">
                <el-input readonly v-model="form.phonenumber" placeholder="联系电话"></el-input>
              </el-form-item>
              <el-form-item label="开户行">
                <el-input readonly v-model="form.bank" placeholder="开户行"></el-input>
              </el-form-item>
              <el-form-item label="开户账号">
                <el-input readonly v-model="form.bankcardno" placeholder="开户账号"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="发票种类">
                <el-select v-model="form.invoiceline" placeholder="请选择发票种类">
                  <el-option label="s/专用发票" value="s">
                  </el-option>
                  <el-option label="p/普通发票(电票)" value="p">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="发票限额">
                <el-input  v-model.number="form.quota" placeholder="发票限额"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="发票复核人">
                <el-input  v-model="form.invoicechecker" placeholder="发票复核人"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="发票收款人">
                <el-input  v-model="form.invoicepayee" placeholder="发票收款人"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="发票开票员">
                <el-input  v-model="form.invoiceclerk" placeholder="发票开票员"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注">
                <el-input v-model="form.remarks" type="textarea" :aotusize="{minRows:4}" placeholder="备注"></el-input>
              </el-form-item>
            </el-col>
       
          </el-form>
        </el-row>
      </div>
      <div class="fixed__btn__panel">
        <el-button size="small" @click="drawer = false" class="normal-btn-width">取 消</el-button>
        <el-button size="small" type="primary" @click="onSubmit" class="normal-btn-width">保 存</el-button>
      </div>
    </el-drawer>

  </div>
</template>

<script>
import invoiceCanUseAgent from '@/template/invoiceCanUseAgent/index.vue'
import invoiceCanUseTax from '@/template/invoiceCanUseTax/index.vue'
import addInvoice from '@/components/financialInfo/modules/add'
export default {
  data () {
    var checktaxno = (rule, value, callback) => {
      if (this.form.enterprisename === '') return callback(new Error('请先选择经销商'));
      if (!value) {
        return callback(new Error('请选择税号'));
      }
      callback();
    };
    return {
      drawer:false,
      visible:false,
      visible1:false,
      form:{
        "sa_invoiceapplyid":0,     //sa_brandid<=0时 为新增
        "byhand":false,
        "invoiceline":"s",
        "remarks":"",
        "quota":1000000,
        "invoicepayee":"孙惠吉",
        "invoiceclerk":"冯云霞",
        "invoicechecker":"王蒋雯",

        "enterprisename":"",
        "taxno":"",
        "address":"",
        "bank":"",
        "bankcardno":"",
        "phonenumber":""
      },
      accountAmount:'',
      value:'',
      rules:{
        enterprisename: [
          { required: true, message: '请选择经销商', trigger: 'change' },
        ],
        taxno: [
          { validator: checktaxno,trigger: 'change' }
        ],
        quota:[
          { required: true, message: '发票限额不能为空', trigger: 'blur' },
        ],
      }
    }
  },
  components:{
    invoiceCanUseAgent,
    invoiceCanUseTax,
    addInvoice
  },
  methods:{
    onClose () {
      this.form = {
        enterprisename:'',
        taxno:'',
        sa_invoiceapplyid:0,
        remarks:'',
        byhand:false,
        invoiceline:'p'
      }
    },
    onSubmit () {
      this.$refs['form'].validate(async (valid) => {
        if (valid) {
           const res = await this.$api.requested({
            "id": "20221216142903",
            "version":1,
            "content": this.form
          })
          this.tool.showMessage(res,()=>{
            this.$emit('onSuccess')
            this.drawer = false
            this.form = {
              enterprisename:'',
              taxno:'',
              sa_invoiceapplyid:0,
              remarks:'',
              byhand:false,
              invoiceline:'p'
            }
            this.$store.dispatch('changeDetailDrawer',true)
            this.$router.push({path:'/invoiceDetail',query:{id:res.data.sa_invoiceapplyid,rowindex:res.data.rowindex}})
          })
        } else {
          return false;
        }
      });
     
    },
    // 选择经销商
    selectRow (row) {
      this.visible = false
      console.log(row);
      
      this.form.enterprisename = row.enterprisename
      this.form.sys_enterpriseid = row.sys_enterpriseid
      this.getAccountAmount(row.sys_enterpriseid)
    },
    /* 获取财务信息 */
    async getAccountAmount (id) {
      let res = await this.$api.requested({
        "id": 20221013160602,
        "content": {
            "sys_enterpriseid":id,
            "pageNumber": 1,
            "pageSize": 20,
            "where": {
                "condition": ""
            }
        },
      })
      if (res.data && res.data.length > 0) {
        this.accountAmount = res.data[0]
        this.form.invo_enterprisename = this.accountAmount.enterprisename
        this.form.taxno = this.accountAmount.taxno
        this.form.address = this.accountAmount.address
        this.form.phonenumber = this.accountAmount.phonenumber
        this.form.bank = this.accountAmount.bank
        this.form.bankcardno = this.accountAmount.bankcardno
      }
      console.log(res,'财务信息');
      
    },
    // 选择开票信息
    selectTaxRow (row) {
      this.visible1 = false
      this.form.invo_enterprisename = row.enterprisename
      this.form.taxno = row.taxno
      this.form.address = row.address
      this.form.phonenumber = row.phonenumber
      this.form.bank = row.bank
      this.form.bankcardno = row.bankcardno
    },
    // 查询经销商
    queryAgent () {
      this.$refs['UseAgent'].listData()
    },

    // 查询开票信息
    queryTax () {
      this.$refs['UseTax'].listData()
    }
  }
}

</script>
<style>
</style>