客户信息文件上传添加百分比展示

.env.production

@@ -2,7 +2,7 @@
 ENV = 'production'
 
 #Jeeplus快速开发平台/后台地址
-VUE_APP_SERVER_URL = 'http://pg.xgccpm.com:8081/jeeplus-vue'
+VUE_APP_SERVER_URL = 'http://pg.xgccpm.com/jeeplus-vue'
 #单点登录设置
 VUE_APP_SSO_LOGIN  = 'false'
 VUE_APP_CAS_SERVER = 'https://www.cainiao.com:8443/cas'

src/api/sys/OSSService.js

@@ -84,7 +84,6 @@ export function handleRemove (e, files) {
 }
 
 export function fileName (file) {
-  console.log('文件名称处理')
   const tmpcnt = file.file.name.lastIndexOf('.')
   let fileName = file.file.name.substring(0, tmpcnt)
   // 将单引号‘’都转换成'，将双引号“”都转换成"
@@ -103,7 +102,6 @@ export function fileName (file) {
   fileName = fileName.replace(/Π/g, '')
   fileName = fileName.replace(/π/g, '')
   fileName = fileName.replace(/·/g, '.')
-  console.log('文件名处理结果', fileName)
   return fileName
 }
 
@@ -117,7 +115,6 @@ export function beforeAvatarUpload (file) {
 }
 
 export function exnameFix (file, isShow, names) {
-  console.log('格式校验')
   const tmpcnt = file.name.lastIndexOf('.')
   const exname = file.name.substring(tmpcnt + 1) // 获取后缀名
   if (names.indexOf(exname) < 0) {
@@ -130,19 +127,15 @@ export function exnameFix (file, isShow, names) {
 }
 
 export async function httpRequest (file, name, type) { // 阿里云OSS上传
-  console.log('开始上传')
   // 判断扩展名
   const tmpcnt = file.file.name.lastIndexOf('.') // 获取.的下标
   const exname = file.file.name.substring(tmpcnt + 1) // 获取后缀名
-  console.log(exname, '后缀名')
   const now = new Date()
   const year = now.getFullYear()
   const month = now.getMonth() + 1
   const day = now.getDate() > 10 ? now.getDate() : '0' + now.getDate()
   const filePath = '/attachment-file/assess/' + type + '/' + year + '/' + month + '/' + day + '/' + now.getTime()
-  console.log(filePath, '文件存储路径')
   const fileName = filePath + name + '.' + exname
-  console.log(fileName, '文件名')
 
   client.multipartUpload(fileName, file.file, {
     progress: function (p, checkpoint) {
@@ -150,7 +143,6 @@ export async function httpRequest (file, name, type) { // 阿里云OSS上传
     }
     // mime: type,
   }).then(function (result) {
-    console.log(result)
     if (result.res.status === 200) {
       // file.onSuccess(result) // 触发el-upload组件的onSuccess方法
       file.file.url = fileName

src/views/modules/sys/project/AssessForm.vue

@@ -521,7 +521,6 @@
             // 这里是将url转成blob地址，
             fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
               link.href = URL.createObjectURL(blob)
-              console.log(link.href)
               link.download = row.name || '' // 下载文件的名字
               // a.download = url.split('/')[url.split('/').length -1] //  // 下载文件的名字
               document.body.appendChild(link)
@@ -536,7 +535,6 @@
           // 这里是将url转成blob地址，
           fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
             link.href = URL.createObjectURL(blob)
-            console.log(link.href)
             link.download = row.name || '' // 下载文件的名字
             // a.download = url.split('/')[url.split('/').length -1] //  // 下载文件的名字
             document.body.appendChild(link)
@@ -652,7 +650,6 @@
           if (valid) {
             this.loading = true
             this.inputForm.itemType = '1'
-            console.log(this.dataListNew)
             this.inputForm.workAttachments = []
             this.dataListNew.forEach((item) => {
               if (item.id === null || item.id === undefined || item.id === '') {
@@ -691,8 +688,6 @@
         this.fileList = handleRemove()
       },
       changes (file, fileList) {
-        console.log('file', file)
-        console.log('22', fileList)
         this.dataListNew = []
         this.dataList.forEach((item) => {
           this.dataListNew.push(item)
@@ -702,8 +697,6 @@
           item.createBy = this.$store.state.user.name
           this.dataListNew.push(item)
         })
-        console.log('11', this.dataList)
-        console.log('33', this.dataListNew)
         const isLt2M = file.size / 1024 / 1024 < 300
         if (isLt2M === false) {
           this.$message.error('文件大小不能超过 ' + 300 + 'M !')
@@ -717,7 +710,6 @@
         }
       },
       async showFile (row) {
-        console.log('row', row)
         let suffix = row.name.substring(row.name.lastIndexOf('.') + 1)
         if (suffix === 'jpg' || suffix === 'png' || suffix === 'gif' || suffix === 'bmp' || suffix === 'jpeg') {
           if (row.url !== null && row.url !== undefined && row.url !== '') {
@@ -760,7 +752,6 @@
         this.refreshList()
       },
       deleteMsgById (row, index) {
-        console.log(index)
         this.dataListNew.splice(index, 1)
         if (row.id !== null && row.id !== '' && row.id !== undefined) {
           this.ossService.deleteMsgById(row.id)

src/views/modules/sys/workClient/WorkClientForm.vue

@@ -329,10 +329,13 @@
                    :on-remove="handleRemove"
                    :show-file-list="false"
                    :on-change="changes"
+                    :on-progress="uploadVideoProcess"
                    :file-list="filesArra2">
           <el-button type="info" size="mini" v-if="inputForm.permissionFlag&&showVi">点击上传</el-button>
           </el-upload>
           <div style="height: calc(100% - 80px);margin-top: 10px">
+            <!-- 进度条 -->
+            <el-progress style="margin-left: 5em" v-if="progressFlag" :percentage="loadProgress"></el-progress>
           <vxe-table
             style="margin-left: 5em"
             border="inner"
@@ -508,7 +511,9 @@
         src: '',
         showVi: true,
         onedit: false,
-        type: ''
+        type: '',
+        loadProgress: 0, // 动态显示进度条
+        progressFlag: false // 关闭进度条
       }
     },
     components: {
@@ -522,6 +527,14 @@
       this.workClientService = new WorkClientService()
     },
     methods: {
+      uploadVideoProcess (event, file, fileList) {
+        this.progressFlag = true // 显示进度条
+        this.loadProgress = parseInt(event.percent) // 动态获取文件上传进度
+        if (this.loadProgress >= 100) {
+          this.loadProgress = 100
+          setTimeout(() => { this.progressFlag = false }, 1000) // 一秒后关闭进度条
+        }
+      },
       async toHref (row) {
         const link = document.createElement('a')
         if (row.id === null || row.id === undefined || row.id === '') {
@@ -530,7 +543,6 @@
             // 这里是将url转成blob地址，
             fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
               link.href = URL.createObjectURL(blob)
-              console.log(link.href)
               link.download = row.name || '' // 下载文件的名字
               // a.download = url.split('/')[url.split('/').length -1] //  // 下载文件的名字
               document.body.appendChild(link)
@@ -545,7 +557,6 @@
           // 这里是将url转成blob地址，
           fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
             link.href = URL.createObjectURL(blob)
-            console.log(link.href)
             link.download = row.name || '' // 下载文件的名字
             // a.download = url.split('/')[url.split('/').length -1] //  // 下载文件的名字
             document.body.appendChild(link)
@@ -694,6 +705,9 @@
       },
       // 表单提交
       doSubmit () {
+        if (this.progressFlag === true) {
+          this.$message.warning('文件正在上传中,请稍等')
+        }
         this.$refs['inputForm'].validate((valid) => {
           if (valid) {
             this.loading = true
@@ -798,8 +812,6 @@
         this.fileList = handleRemove()
       },
       changes (file, fileList) {
-        console.log('file', file)
-        console.log('22', fileList)
         this.dataListNew = []
         this.dataList.forEach((item) => {
           this.dataListNew.push(item)
@@ -809,8 +821,6 @@
           item.createBy = this.$store.state.user.name
           this.dataListNew.push(item)
         })
-        console.log('11', this.dataList)
-        console.log('33', this.dataListNew)
         const isLt2M = file.size / 1024 / 1024 < 300
         if (isLt2M === false) {
           this.$message.error('文件大小不能超过 ' + 300 + 'M !')
@@ -819,7 +829,6 @@
         }
       },
       async showFile (row) {
-        console.log('row', row)
         let suffix = row.name.substring(row.name.lastIndexOf('.') + 1)
         if (suffix === 'jpg' || suffix === 'png' || suffix === 'gif' || suffix === 'bmp' || suffix === 'jpeg') {
           if (row.url !== null && row.url !== undefined && row.url !== '') {
@@ -862,7 +871,6 @@
         this.refreshList()
       },
       deleteMsgById (row, index) {
-        console.log(index)
         this.dataListNew.splice(index, 1)
         if (row.id !== null && row.id !== '' && row.id !== undefined) {
           this.ossService.deleteMsgById(row.id)
@@ -961,7 +969,6 @@
       async rowClick (event) {
         let id = this.gridData[event.rowIndex].companyid
         await this.workClientService.enterpriseTicketInfo(id).then((data) => {
-          console.log(data)
           this.inputForm.workClientInfo.name = data.data.ENTNAME
           this.inputForm.workClientInfo.uscCode = data.data.UNCID
           this.inputForm.workClientInfo.registerAddress = data.data.OPLOC