finance-ssr/components/common/upload.vue

<!--upload申请单上传组件-->
<template>
  <div>
    <input type="file" class="com-input" @change="update($event,index,apply.id)" accept="image/jpeg,image/jpg,image/gif,image/bmp,image/png,.pdf,.doc,.docx,.xls,.xlsx" />
    <div style="margin-left: 100px">
      <div v-if="index==0">
        <div v-for="(item,index1) in $store.state.fileList0">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,0,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                        <i class="fa fa-trash"></i>删除
                        </span>
        </div>
      </div>
      <div v-if="index==1">
        <div v-for="(item,index1) in  $store.state.fileList1">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,1,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==2">
        <div v-for="(item,index1) in  $store.state.fileList2">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,2,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==3">
        <div v-for="(item,index1) in  $store.state.fileList3">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,3,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==4">
        <div v-for="(item,index1) in  $store.state.fileList4">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,4,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==5">
        <div v-for="(item,index1) in  $store.state.fileList5">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,5,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==6">
        <div v-for="(item,index1) in  $store.state.fileList6">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,6,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==7">
        <div v-for="(item,index1) in  $store.state.fileList7">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,7,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==8">
        <div v-for="(item,index1) in  $store.state.fileList8">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,8,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==9">
        <div v-for="(item,index1) in  $store.state.fileList9">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,9,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==10">
        <div v-for="(item,index1) in  $store.state.fileList10">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,10,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==11">
        <div v-for="(item,index1) in  $store.state.fileList11">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,11,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==12">
        <div v-for="(item,index1) in $store.state.fileList12">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,12,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==13">
        <div v-for="(item,index1) in $store.state.fileList13">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,13,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==14">
        <div v-for="(item,index1) in $store.state.fileList14">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,14,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==15">
        <div v-for="(item,index1) in $store.state.fileList15">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,15,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==16">
        <div v-for="(item,index1) in $store.state.fileList16">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,16,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==17">
        <div v-for="(item,index1) in $store.state.fileList17">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,17,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==18">
        <div v-for="(item,index1) in $store.state.fileList18">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,18,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==19">
        <div v-for="(item,index1) in $store.state.fileList19">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,19,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==20">
        <div v-for="(item,index1) in $store.state.fileList20">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,20,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==21">
        <div v-for="(item,index1) in $store.state.fileList21">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,21,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
                    </span>
        </div>
      </div>
      <div v-if="index==22">
        <div v-for="(item,index1) in $store.state.fileList22">
          <span v-text="item.name"></span>
          <span  @click="deleteAttach(item.id,22,index1)" class="delete" v-if="apply.status==201 || apply.status==205">
                    <i class="fa fa-trash"></i>删除
           </span>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  export default{
    data(){
      return{
        attach: {id: '', type: '', applyid: '', name: '', path: '', size: ''},
        isShow: false,
        isPdf: false
      }
    },
    props: ['index', 'apply'],
    methods:{
      update: function (e, index, applyid) {
        let file = e.target.files[0]
        this.attach.name = file.name;
        this.attach.applyid = applyid;
        if (index == 0) {
          this.attach.type = '保理业务申请书';
        } else if (index == 1) {
          this.attach.type = '营业执照正副本';
        } else if (index == 2) {
          this.attach.type = '开户许可证';
        } else if (index == 3) {
          this.attach.type = '法人代表身份证';
        } else if (index == 4) {
          this.attach.type = '实际控制人身份证'
        } else if (index == 5) {
          this.attach.type = '法人代表证明书'
        } else if (index == 6) {
          this.attach.type = '公司章程'
        } else if (index == 7) {
          this.attach.type = '实际控制人征信授权书'
        } else if (index == 8) {
          this.attach.type = '租赁合同/房产证'
        } else if (index == 9) {
          this.attach.type = '法定代表人和实际控制人简历（Word版）'
        } else if (index == 10) {
          this.attach.type = '近三年财务报表和近一期月度财报（含资产负债表、损益表、现金流量表）'
        } else if (index == 11) {
          this.attach.type = '前五大上游企业贸易合同（两份）'
        } else if (index == 12) {
          this.attach.type = '前五大下游企业贸易合同（两份）'
        } else if (index == 13) {
          this.attach.type = '近1年税控系统导出的增值税发票清单（Excel版）'
        } else if (index == 14) {
          this.attach.type = '近一年最大的五份贸易合同'
        } else if (index == 15) {
          this.attach.type = '税控系统导出近一年全部发票（Excel版）'
        } else if (index == 16) {
          this.attach.type = '公司人行征信报告及对外担保信息'
        } else if (index == 17) {
          this.attach.type = '上一年度增值税（营业税）、所得税纳税证明'
        } else if (index == 18) {
          this.attach.type = '企业近1年主要结算银行流水'
        } else if (index == 19) {
          this.attach.type = '个人近1年主要结算银行流水'
        } else if (index == 20) {
          this.attach.type = '近三个月水电费单据'
        } else if (index == 21) {
          this.attach.type = '其他'
        } else if (index == 22) {
          this.attach.type = '担保人的人行征信报告及对外担保信息'
        }
        let param = new FormData()
        param.append('file', file)
     //   param.append('attach',JSON.stringify(this.attach))
        param.append('type', this.attach.type)
        param.append('applyId', this.attach.applyid)
        param.append('chunk', '0')
        let _this = this
          let config = {
            headers: {'Content-Type': 'multipart/form-data'}
          }
          return this.$axios.post('/attach/upload', param, config)
            .then(response => {
              if(response.data.type == '保理业务申请书'){
                this.$store.state.fileList0.push(response.data)
              }else if (response.data.type == '营业执照正副本') {
                this.$store.state.fileList1.push(response.data)
              } else if (response.data.type == '开户许可证') {
                this.$store.state.fileList2.push(response.data)
              } else if (response.data.type == '法人代表身份证') {
                this.$store.state.fileList3.push(response.data)
              } else if (response.data.type == '实际控制人身份证') {
                this.$store.state.fileList4.push(response.data)
              } else if (response.data.type == '法人代表证明书') {
                this.$store.state.fileList5.push(response.data)
              } else if (response.data.type == '公司章程') {
                this.$store.state.fileList6.push(response.data)
              } else if (response.data.type == '实际控制人征信授权书' ) {
                this.$store.state.fileList7.push(response.data)
              } else if (response.data.type == '租赁合同/房产证') {
                this.$store.state.fileList8.push(response.data)
              } else if (response.data.type == '法定代表人和实际控制人简历（Word版）'){
                this.$store.state.fileList9.push(response.data)
              } else if (response.data.type == '近三年财务报表和近一期月度财报（含资产负债表、损益表、现金流量表）'){
                this.$store.state.fileList10.push(response.data)
              } else if (response.data.type == '前五大上游企业贸易合同（两份）') {
                this.$store.state.fileList11.push(response.data)
              } else if (response.data.type == '前五大下游企业贸易合同（两份）') {
                this.$store.state.fileList12.push(response.data)
              } else if (response.data.type == '近1年税控系统导出的增值税发票清单（Excel版）') {
                this.$store.state.fileList13.push(response.data)
              } else if (response.data.type == '近一年最大的五份贸易合同') {
                this.$store.state.fileList14.push(response.data)
              } else if (response.data.type ==  '税控系统导出近一年全部发票（Excel版）') {
                this.$store.state.fileList15.push(response.data)
              } else if (response.data.type == '公司人行征信报告及对外担保信息') {
                this.$store.state.fileList16.push(response.data)
              } else if (response.data.type == '上一年度增值税（营业税）、所得税纳税证明') {
                this.$store.state.fileList17.push(response.data)
              } else if (response.data.type == '企业近1年主要结算银行流水') {
                this.$store.state.fileList18.push(response.data)
              } else if (response.data.type == '个人近1年主要结算银行流水') {
                this.$store.state.fileList19.push(response.data)
              } else if (response.data.type == '近三个月水电费单据') {
                this.$store.state.fileList20.push(response.data)
              } else if (response.data.type == '其他') {
                this.$store.state.fileList21.push(response.data)
              } else if (response.data.type == '担保人的人行征信报告及对外担保信息') {
                this.$store.state.fileList22.push(response.data)
              }
            }).catch(function(error){
              alert('上传失败')
            })
      },
      deleteAttach: function (id, index, index1) {
        let _this = this;
        var params = new URLSearchParams();
        params.append('id',id)
        return this.$axios.post('/attach/delete', params)
          .then(function () {
            switch (index) {
              case 0:
                _this.$store.state.fileList0.splice(index1, 1)
                break;
              case 1:
                _this.$store.state.fileList1.splice(index1, 1)
                break;
              case 2:
                _this.$store.state.fileList2.splice(index1, 1)
                break;
              case 3:
                _this.$store.state.fileList3.splice(index1, 1)
                break;
              case 4:
                _this.$store.state.fileList4.splice(index1, 1)
                break;
              case 5:
                _this.$store.state.fileList5.splice(index1, 1)
                break;
              case 6:
                _this.$store.state.fileList6.splice(index1, 1)
                break;
              case 7:
                _this.$store.state.fileList7.splice(index1, 1)
                break;
              case 8:
                _this.$store.state.fileList8.splice(index1, 1)
                break;
              case 9:
                _this.$store.state.fileList9.splice(index1, 1)
                break;
              case 10:
                _this.$store.state.fileList10.splice(index1, 1)
                break;
              case 11:
                _this.$store.state.fileList11.splice(index1, 1)
                break;
              case 12:
                _this.$store.state.fileList12.splice(index1, 1)
                break;
              case 13:
                _this.$store.state.fileList13.splice(index1, 1)
                break;
              case 14:
                _this.$store.state.fileList14.splice(index1, 1)
                break;
              case 15:
                _this.$store.state.fileList15.splice(index1, 1)
                break;
              case 16:
                _this.$store.state.fileList16.splice(index1, 1)
                break;
              case 17:
                _this.$store.state.fileList17.splice(index1, 1)
                break;
              case 18:
                _this.$store.state.fileList18.splice(index1, 1)
                break;
              case 19:
                _this.$store.state.fileList19.splice(index1, 1)
                break;
              case 20:
                _this.$store.state.fileList20.splice(index1, 1)
                break;
              case 21:
                _this.$store.state.fileList21.splice(index1, 1)
                break;
              case 22:
                _this.$store.state.fileList22.splice(index1, 1)
                break;
            }
          }).catch(function (error) {
             alert(error)
          })
      },
      isIdRepeat (arr = [], idx) {
        let flag = false
        for (let i = 0; i < arr.length; i++) {
          if (arr[i].id === arr[idx].id && i < idx) {
            flag = true
            break
          }
        }
        return flag
      }
    }
  }
</script>