<template>
    <div class="table">
      <el-button v-if="!data.type && currentNode===8" size="small" @click="updatef('上传')">发票上传</el-button>
      <el-button v-if="!data.type && currentNode>=8" size="small" @click="updatef('下载')">发票下载</el-button>
      <el-button v-if="!data.type && currentNode===12" size="small" @click="Certificate" :disabled="multipleSelection.length<1" >凭证号生成</el-button>
      <el-button v-if="!data.type && currentNode===4" type="primary" size="small" @click="uploadAmount" :disabled="uploadAmountBtn">填写可用预算</el-button>
      <el-button v-if="!data.type && currentNode===4" type="primary" size="small" @click="batchUploadAmount">批量填写可用预算</el-button>
      <el-button type="primary" size="small" @click="download" class="el-icon-document">导出</el-button>
      <el-table
        v-loading="loading"
        :data="deptList"
        row-key="deptId"
        max-height="350px"
        highlight-current-row
        style="width:140%;margin-top: 10px"
        @selection-change="handleSelectionChange"
        @row-click="rowClick"
      >
        <el-table-column
          type="selection"
          v-if="currentNode===12"
          min-width="55">
        </el-table-column>
        <el-table-column
          prop="seriervs"
          label="序号"
          min-width="60"
        ></el-table-column>
        <el-table-column
          prop="applyDate"
          label="申请日期"
          :show-overflow-tooltip="true"
          min-width="130"
        >
        </el-table-column>
        <el-table-column prop="batchNo" label="批次号" min-width="100" align="center">
        </el-table-column>
        <el-table-column
          label="销售方"
          align="center"
          prop="seller"
          :show-overflow-tooltip="true"
          min-width="130"
        >
        </el-table-column>
        <el-table-column
          label="购买方"
          align="center"
          prop="buyer"
          min-width="130"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="主业WBS编码"
          align="center"
          prop="projectNo"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="主业项目名称"
          align="center"
          prop="projectName"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="产业项目编码"
          align="center"
          prop="ynProjectNo"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="产业项目名称"
          align="center"
          prop="ynProjectName"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="申请单分类"
          align="center"
          prop="applyType"
          min-width="180"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="费用类型"
          align="center"
          prop="costType"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="合同金额"
          align="center"
          prop="contractAmount"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="可用预算金额"
          align="center"
          prop="validBudgetAmount"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="本次开票金额(含税)"
          align="center"
          min-width="150"
          prop="taxAmount"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="税率"
          align="center"
          min-width="150"
          prop="taxRate"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="收票人(业务人员)"
          align="center"
          prop="taker"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="收票人单位(部门)"
          align="center"
          prop="takerUnit"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="联系电话"
          align="center"
          prop="telephone"
          :show-overflow-tooltip="true"
          min-width="150"
        >
        </el-table-column>
        <el-table-column
          label="发票代码"
          align="center"
          prop="invoiceCode"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="开票日期"
          align="center"
          prop="makeInvoiceDate"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="主业入账凭证号"
          align="center"
          prop="voucherCode"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="产业入账凭证号"
          align="center"
          prop="ynVoucherCode"
          min-width="150"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
      </el-table>
      <div style="display:flex;justify-content: center;margin-top: 38px">
        <el-button  @click="out" >取消</el-button>
<!--        <el-button type="danger" @click="sendBackOne" v-if="currentNode==10 && !data.type">退回首岗</el-button>-->
        <el-button type="danger" @click="sendBack" v-if="!data.type" >退回</el-button>
        <el-button type="primary" @click="Receipt(1)" v-if="!data.type && currentNode==10">确认接收</el-button>
        <el-button type="primary" @click="Receipt(2)" v-if="!data.type && currentNode==12">接收报账</el-button>
        <el-button type="primary" @click="handelMon(currentNode)" v-if="!data.type && currentNode!=10 && currentNode!=6">确认</el-button>
        <el-button type="primary" @click="handelMon(currentNode)" v-if="!data.type && currentNode==10">确认报账</el-button>
        <el-button type="primary" @click="handelMon(currentNode)" v-if="!data.type && currentNode==6">已开票</el-button>
      </div>
      <InvoiceUpload ref="InvoiceUpload"/>
      <el-dialog title="退回" :visible.sync="visb" append-to-body>
        <el-form :model="From" ref="dynamicValidateForm" :rules="rulesD" label-width="100px" class="demo-dynamic">
          <el-form-item
            prop="auditMsg"
            label="退回原因"
          >
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入退回原因"
              v-model="From.auditMsg">
            </el-input>
          </el-form-item>
         <div style="display: flex;justify-content: center">
           <el-button type="danger" @click="hasOwn">确认</el-button>
         </div>
        </el-form>
      </el-dialog>
<!--      <el-dialog title="退回首岗" :visible.sync="FromauditVis" append-to-body>-->
<!--        <el-form :model="FromauditMsg" ref="dynamicValidateForm" label-width="100px" class="demo-dynamic">-->
<!--          <el-form-item-->
<!--            prop="auditMsg"-->
<!--            label="退回首岗"-->
<!--            :rules="[-->
<!--            { required: true, message: '请输入退回原因', trigger: 'blur' },-->
<!--            ]"-->
<!--          >-->
<!--            <el-input-->
<!--              type="textarea"-->
<!--              :rows="2"-->
<!--              placeholder="请输入退回原因"-->
<!--              v-model="FromauditMsg.auditMsg">-->
<!--            </el-input>-->
<!--          </el-form-item>-->
<!--          <div style="display: flex;justify-content: center">-->
<!--            <el-button type="danger" @click="hasOwnTn">确认</el-button>-->
<!--          </div>-->
<!--        </el-form>-->
<!--      </el-dialog>-->
      <el-dialog title="确认" :visible.sync="nextAuditVs" append-to-body width="50%" >
            <el-form :model="ruleForm"  :rules="rules" ref="ruleFormdt"  class="demo-ruleForm" >
              <el-row :gutter="24">
                <el-col :span="11" v-if="currentNode!=10" >
                  <el-form-item label="下一岗人员" prop="nextAuditUser" label-width="100" style="display: flex">
                    <el-select v-model="ruleForm.nextAuditUser" filterable placeholder="请选择">
                      <el-option
                        v-for="item in list"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="currentNode==10">
                  <el-form-item label="购买方财务人员" prop="nextAuditUser" style="display: flex"  >
                    <el-select v-model="ruleForm.nextAuditUser" filterable placeholder="请选择">
                      <el-option
                        v-for="item in list"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12" v-if="currentNode==10">
                  <el-form-item label="销售方财务人员" prop="nextAuditUser" style="display: flex">
                    <el-select v-model="ruleForm.nextAuditUser2" filterable placeholder="请选择">
                      <el-option
                        v-for="item in list"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
            <div style="display:flex;justify-content: center">
              <el-button type="primary" @click="submitForm('ruleForm')" >提交</el-button>
            </div>
        </el-dialog>
      <CertificateGeneration ref="CertificateGeneration" @handelData="handelData"/>
      <uploadAmount ref="uploadAmount" @handelData="handelData" @closAmountBtn="closAmountBtn"/>
      <tableDataV ref="tableDataV" @handelData="handelData" @closAmountBtn="closAmountBtn"/>
    </div>
</template>

<script>
import {applyAuditDetail, applyInvoiceExport, applyUpdate, getUserList, Invoiceaudit} from '@/api/utils'
import InvoiceUpload from "@/views/commission/components/InvoiceUpload";
import CertificateGeneration from "@/views/commission/components/CertificateGeneration";
import uploadAmount from "@/views/commission/components/uploadAmount";
import tableDataV from "./tableData.vue";
import moment from "moment";
export default {
  components:{
    InvoiceUpload,CertificateGeneration,uploadAmount,tableDataV
  },
  inject: ["getList"],
  props:{
    data:{
      type:Object,
    }
  },
  data() {
    return {
      deptList:[],
      rules: {
        nextAuditUser: [
          { required: true, message: '请选择', trigger: 'change' },
        ],
        nextAuditUser2: [
          { required: true, message: '请选择', trigger: 'change' }
        ],
      },
      rulesD:{auditMsg:[{ required: true, message: '请输入退回原因', trigger: 'blur' }]},
      loading: false,
      From:{
        auditMsg:'',
      },
      ruleForm:{
        nextAuditUser:'',
        nextAuditUser2:'',
      },
      FromauditMsg:{
        auditMsg:null,
      },
      FromauditVis:false,
      nextAuditVs:false,
      list:[],
      pageNo:1,
      pageSize:10,
      total:0,
      visb:false,
      currentNode:null,
      businessId:null,
      branchType:null,
      taskId:null,
      rowData:null,
      multipleSelection:[],
      uploadAmountBtn:true
    };
  },
  created() {
    this.getData()
    this.getUser()
  },
  methods: {
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    //导出
    async download(){
      let res=await applyInvoiceExport({applyId:this.businessId})
      if(res){
        const elink = document.createElement('a');
        elink.download = `${moment().format('YYYY/MM/DD')}.xls`;
        elink.style.display = 'none';
        const blob = new Blob([res], { type: 'application/x-msdownload' });
        elink.href = URL.createObjectURL(blob);
        document.body.appendChild(elink);
        elink.click();
        document.body.removeChild(elink);
      }else {
        this.$message.error('导出异常请联系管理员');
      }
    },
    //接收报账确认接收
    async Receipt(val){
      if(val==1){
        let res = await applyUpdate({id:this.businessId,isReceiptInvoice:1})
        if(res.code==200){
          this.$message.success('提交成功')
        }else {
          this.$message.success('提交失败')
        }
      }else{
        let res = await applyUpdate({id:this.businessId,isReceiptBz:1})
        if(res.code==200){
          this.$message.success('提交成功')
        }else {
          this.$message.success('提交失败')
        }
      }
    },
    Certificate(){
      debugger
      console.log(this.data.branchType)
      console.log(this.multipleSelection)
      this.$refs.CertificateGeneration.handle(this.multipleSelection,this.data.branchType)
    },
    // 填写可用预算
    uploadAmount() {
      console.log('这一行数据。。。')
      console.log(this.rowData)
      this.$refs.uploadAmount.handle(this.rowData.id, this.rowData.taxAmount, this.rowData.validBudgetAmount)
    },
    batchUploadAmount() {
      console.log('批次单id。。。')
      console.log(this.businessId)
      this.$refs.uploadAmount.batchHandle(this.businessId)
    },
   async upDate(){
      let data={
        auditMsg:this.From.auditMsg,
        auditState:1,
        businessId:this.businessId,
        taskId:this.taskId,
        nextAuditUser:this.ruleForm.nextAuditUser,
        nextAuditUser2:this.ruleForm.nextAuditUser2,
      }
      let res = await Invoiceaudit(data)
      if(res.code==200){
        this.$message.success('提交成功')
        this.nextAuditVs=false
        this.out()
        this.getList()
      }else {
        this.$message.error('提交失败')
      }
    },
    async submitForm(formName){
      this.$refs['ruleFormdt'].validate(async (valid) => {
        if (valid) {
          let data={
            auditMsg:this.From.auditMsg,
            auditState:1,
            businessId:this.businessId,
            taskId:this.taskId,
            nextAuditUser:this.ruleForm.nextAuditUser,
            nextAuditUser2:this.ruleForm.nextAuditUser2,
          }
          let res = await Invoiceaudit(data)
          if(res.code==200){
            this.$message.success('提交成功')
            this.nextAuditVs=false
            this.out()
            this.getList()
          }else {
            this.$message.error('提交失败')
          }
        } else {
          return false;
        }
      });
    },
    async getUser(){
      let res= await getUserList()
      let data=[]
      res.data.forEach(item=>{
        data.push({
          label:item.userName+'_'+item.nickName,
          value:item.userName
        })
      })
      this.list=data
    },
    async hasOwn(){
      this.$refs['dynamicValidateForm'].validate(async (valid) => {
          if (valid) {
            let data={
              auditMsg:this.From.auditMsg,
              auditState:0,
              businessId:this.businessId,
              taskId:this.taskId,
            }
            let res = await Invoiceaudit(data)
            if(res.code==200){
              this.$message.success('退回成功')
              this.visb=false
              this.out()
              this.getList()
            }else {
              this.$message.error('退回失败')
            }
    }
    })
    },
    async hasOwnTn(){
      let data={
        auditMsg:this.FromauditMsg.auditMsg,
        auditState:-1,
        businessId:this.businessId,
        taskId:this.taskId,
      }
      let res = await Invoiceaudit(data)
      if(res.code==200){
        this.$message.success('退回成功')
        this.FromauditVis=false
        this.out()
        this.getList()
      }else {
        this.$message.error('退回失败')
      }
    },
    sendBack(){
       this.visb=true
    },
    sendBackOne(){
      this.FromauditVis=true
    },
    updatef(val){
      console.log(this.rowData)
      let data={
        businessId:this.businessId,
        currentNode:this.currentNode
      }
     this.$refs.tableDataV.handle(data,val)
    },
    handelMon(val){
      this.ruleForm={
        nextAuditUser:'',
        nextAuditUser2:'',
      }
      if(val==12){
        this.upDate()
      }else {
        // this.$refs.ruleForm.resetFields()
        this.nextAuditVs=true
        this.$refs['ruleFormdt'].resetFields();
      }
    },
    rowClick(row){
      console.log(row)
      this.rowData=row
      this.uploadAmountBtn = false;
    },
    out(){
      this.$emit('visblit')
    },
    async getData(val){
      let res= await applyAuditDetail({id:this.data.id || val,businessId:this.data.businessId})
      if (res && res.data && res.data.invoiceList){
        this.currentNode=res.data.currentNode
        this.businessId=res.data.businessId
        this.branchType=res.data.branchType
        this.taskId=res.data.taskId
          res.data.invoiceList.forEach((item,index)=>{
            item.seriervs=index+1
          })
          this.deptList=res.data.invoiceList
      }else {
        this.deptList=[]
      }

    },
    async handelData(val){
      console.log('===================================')
      let res= await applyAuditDetail({id:this.data.id || val,businessId:this.data.businessId})
      if (res && res.data && res.data.invoiceList){
        this.currentNode=res.data.currentNode
        this.businessId=res.data.businessId
        this.taskId=res.data.taskId
        res.data.invoiceList.forEach((item,index)=>{
          item.seriervs=index+1
        })
        this.deptList=res.data.invoiceList
      }else {
        this.deptList=[]
      }
    },
    async closAmountBtn() {
      console.log('closAmountBtn')
      this.uploadAmountBtn = true;
    }
  }
};
</script>

<style lang="scss" scoped>

.table {
  height: 500px !important;
  width: 100%;
  position: relative;
}
</style>
