1

src/components/FinancialModule/FinancialDocuments.vue

@@ -691,7 +691,53 @@
     width: 830px;
     position: relative;
   }
-
+  .UploadMsg-box{
+    display: flex;
+    flex-wrap: wrap;
+  }
+  .UploadMsg-list{
+    width: 110px;
+    /* height: 80px; */
+    position: relative;
+    border-radius: 3px;
+    /* overflow: hidden; */
+    margin: 0 6px 13px 6px;
+  }
+  .UploadMsg-text{
+    width: 100%;
+    height: 20px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    cursor: pointer;
+  }
+  .UploadMsg-icon{
+    color: #409eff;
+    position: absolute;
+    right: 0;
+    top: -10px;
+    z-index: 2;
+    cursor: pointer;
+    font-size: 20px;
+  }
+  .UploadMsgGrow{
+    width: 100%;
+  }
+  /deep/.UploadMsg-box .el-upload-dragger{
+    width: 110px;
+    height: 80px;
+    padding: 0 5px;
+  }
+  /deep/.UploadMsg-box .el-upload-dragger .el-icon-upload{
+    margin: 0;
+  }
+  /deep/.UploadMsg-box .el-upload__tip{
+    margin-top: 0;
+    margin-bottom: 7px;
+  }
+  /deep/.UploadMsg-box .el-upload-dragger .el-icon-upload{
+    line-height: 35px;
+  }
 </style>
 
 <template>
@@ -1561,7 +1607,7 @@
         <button v-loading="matchBtn" class="normalBtn" @click="sureMatchTransfer()"
           style="margin-left: 150px;margin-bottom: 10px">确认转移</button>
       </el-dialog>
-
+      <!--工资单信息-->
       <div v-if="fillShow" class="btmAddStore" :class="{'fillShow':fillShow}">
         <div class="btmTitle">{{$t('objFill.daorugzdxx')}}</div>
         <div style="color:red;padding:10px 0" v-if="BatchAddWagesMessage">提示：{{BatchAddWagesMessage}}</div>
@@ -1599,7 +1645,6 @@
                           <el-image style="height:16px;" :src="file.Url?file.Url:file.Content"
                             :preview-src-list="[file.Url?file.Url:file.Content]">
                           </el-image>
-                          <!-- <img :src="file.Url?file.Url:file.Content" @click="showUpLoadFile(file,index)" style="height:16px;"> -->
                         </div>
                         <span class="iconfont icon-guanbi1" style="font-size:12px;"
                           @click="deleteInvoiceUploadFile(fIndex,index)"></span>
@@ -1642,10 +1687,12 @@
           </table>
         </div>
         <div class="btmBtn impotBtn" style="padding:10px 0">
+          <input type="button" class="normalBtn" value="批量上传附件" @click="isUploadAttachment=true;" />
           <input type="button" class="normalBtn" @click="importInfo" :value="$t('ground.qrdr')" />
           <input type="button" class="hollowFixedBtn" @click="hideFill" :value="$t('pub.cancelBtn')" />
         </div>
       </div>
+      <!--工资单导入弹窗-->
       <el-dialog custom-class='w700' :title="$t('objFill.daoruyinxiaosj')" :visible.sync="outerVisible" center>
         <el-upload drag class="upload-demo" :action="importFileUrl2" :on-success="handleAvatarSuccess"
           :before-upload="beforeAvatarUpload">
@@ -1653,6 +1700,48 @@
           <div class="el-upload__text">{{$t("tips.tuodongwenjian")}}<em>{{$t('tips.dianjishanhcuan')}}</em></div>
           <div slot="tip" class="el-upload__tip">{{$t("ground.znscexcel")}}</div>
         </el-upload>
+      </el-dialog>
+      <el-dialog :title="saveUploadMsg.length>0?'批量上传附件/已传'+saveUploadMsg.length:'批量上传附件'"
+      :visible.sync="isUploadAttachment" width="780px"
+    :close-on-click-modal="false"
+    :show-close="false" @close="cancel">
+    <!--工资单附件导入弹窗-->
+    <div class="UploadMsg-box">
+      <div :class="[saveUploadMsg.length>0?'':'UploadMsgGrow']" style="text-align: center;">
+        <el-upload
+        class="upload-demo"
+        drag
+        accept="image/jpeg,image/jpg, image/png, image/bmp"
+        action=""
+        :http-request="uploadGZFileBtn"
+        multiple
+        :show-file-list="false">
+        <i class="el-icon-upload" style="font-size: 30px;"></i>
+        <div class="el-upload__text">文件拖到此处，或<em>{{$t('tips.dianjishanhcuan')}}</em></div>
+        <div class="el-upload__tip" slot="tip">只能上传jpg/png文件</div>
+      </el-upload>
+      </div>
+        <template v-for="(item,index) in saveUploadMsg">
+          <div class="UploadMsg-list">
+            <el-image
+            style="width: 100%; height: 80px;border-radius: 5px;"
+            :src="item.DMCOPCredentials"
+            fit="cover"
+            :initial-index="index"
+            :preview-src-list="saveUploadMsg.map(x=>{return x.DMCOPCredentials})"></el-image>
+            <div class="UploadMsg-text">
+              <el-tooltip class="item" effect="dark" :content="item.BrandName" placement="top">
+                <p>{{item.BrandName}}</p>
+              </el-tooltip>
+            </div>
+            <i class="UploadMsg-icon el-icon-circle-close" @click="handleGZRemove(index)"></i>
+          </div>
+        </template>
+    </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button class="hollowFixedBtn" @click="cancel" :disabled="loading">{{$t('pub.cancelBtn')}}</el-button>
+        <el-button class="normalBtn" type="primary" @click="saveAttachments" :loading="loading">{{$t('pub.sureBtn')}}</el-button>
+      </div>
     </el-dialog>
       <el-dialog custom-class='w700' title="导入车行ETC差额" :visible.sync="outerVisible3" center>
         <el-upload drag class="upload-demo" :action="importFileUrl5+'&EmployeeId='+userId" :on-success="handleAvatarSuccess3"
@@ -2072,6 +2161,12 @@
           CurrencyName: ''
         },
         isQueryHistoryData: false,
+        //工资单附件开始
+        saveUploadMsg: [],
+        loadingGZPic: false,
+        isUploadAttachment: false,
+        imgLength: 0,
+        //工资单附件结束
       };
     },
     created() {
@@ -2211,6 +2306,73 @@
         } else {
           this.$refs.multipleTable.clearSelection();
         }
+      },
+      //工资单附件方法：
+      cancel() {
+      this.imgLength = 0;
+      this.saveUploadMsg = [];
+      this.isUploadAttachment = false;
+      this.loading = false;
+    },
+    saveAttachments() {
+      if(this.saveUploadMsg.length==0) return this.$message.error('请上传附件');
+      this.loading = true;
+              this.importData.forEach(x => {
+                this.saveUploadMsg.forEach(y => {
+                  if (x.BrandName == y.BrandName) {
+                    if(x.vorcherInos&&x.vorcherInos.length==0){
+                      x.vorcherInos=[];
+                    }
+                    x.vorcherInos.push({
+                      Content: y.Content,
+                      ID:0,
+                      Type:y.Type,
+                      Url: y.DMCOPCredentials,
+                      });
+                  }
+                })
+              })
+              this.$forceUpdate();
+              this.cancel();
+    },
+
+    uploadGZFileBtn(file) { //上传
+        //  1 文档  2 数据 3 图片
+        if(file) this.imgLength++
+        let typeArr=[
+          {stringArr:'GIF|JPG|JPEG|PNG|BMP',type:3},
+          {stringArr:'DOCX|DOC|XLSX|XLS|PPT|PPTX|PDF',type:1},
+        ]
+        let ft=file.file.name.substring(file.file.name.lastIndexOf('.')+1,file.file.name.length).toUpperCase();
+        let fileTypeNumber = 2;
+        let typeOk  = false;
+        typeArr.forEach(x=>{
+          if(x.stringArr.indexOf(ft)!='-1')
+          {
+            fileTypeNumber=x.type;
+            typeOk = true;
+          }
+        })
+        if (!typeOk) return this.$message.error('请上传图');
+        let newArr = [];
+        newArr.push(file.file)
+        let path = "/Upload/Temporary/"
+        if(this.imgLength==1) this.$message.info(this.$t('tips.shangchuanzhong'))
+        this.UploadSelfFileT(path, newArr, x => {
+          let fileSize = file.file.size<1024? file.file.size:(file.file.size / 1024).toFixed(0);
+          let SourceFileName = x.data.SourceFileName.split('.')
+          this.saveUploadMsg.push({
+            Content:x.data.FilePath,
+            Type: fileTypeNumber,
+            DMCOPCredentials: this.domainManager().ViittoFileUrl + x.data.FilePath,
+            BrandName: SourceFileName[0]
+          })
+          if(this.imgLength>0) this.imgLength--
+          if(!this.imgLength) this.$message.success(this.$t('tips.scchenggong'))
+        });
+    },
+    handleGZRemove(index) {
+      this.saveUploadMsg.splice(index,1)
     },
       uploadFileExpressFeeBtn(file) { //上传
         if (file.file.size > 1024 * 1024 * 10) {
@@ -3965,7 +4127,9 @@
         );
       }
     },
-    watch: {}
+    watch: {
+      
+    }
   };
 
 </script>