no message

src/components/Common/imageUpload.vue

@@ -1,346 +0,0 @@
-<template>
-  <div>
-    <el-upload
-      class="uploader"
-      :action="oss_url + 'common/upload'"
-      :data="dataObj"
-      :multiple="multiple"
-      name="file"
-      :accept="accept"
-      :show-file-list="false"
-      :on-success="uploadSuccess"
-      :before-upload="beforeUpload"
-    />
-    <div class="images">
-      <div v-for="(item, index) in fileList" :key="index" class="item">
-        <div v-if="item.url" class="img" @mouseover="item.hover = true" @mouseout="item.hover = false">
-          <el-image
-            v-if="checkFileType(item.url) == 'image'"
-            ref="img"
-            :src="imageURL + item.url"
-            :preview-src-list="previewImages"
-            style="width: 120px; height: 120px"
-            fit="cover"
-          />
-          <el-image v-else ref="img" :src="imageURL + item.url" style="width: 120px; height: 120px" fit="cover">
-            <div slot="error" class="image-slot">
-              <img v-if="checkFileType(item.url) == 'word'" class="file" src="@/assets/common/word.png" />
-              <img v-if="checkFileType(item.url) == 'excel'" class="file" src="@/assets/common/excel.png" />
-              <img v-if="checkFileType(item.url) == 'ppt'" class="file" src="@/assets/common/ppt.png" />
-              <img v-if="checkFileType(item.url) == 'pdf'" class="file" src="@/assets/common/pdf.png" />
-              <img v-if="checkFileType(item.url) == 'file'" class="file" src="@/assets/common/zip.jpeg" />
-            </div>
-          </el-image>
-          <div v-show="item.hover" class="mask">
-            <i v-if="checkFileType(item.url) == 'image'" class="el-icon-zoom-in" @click="previewImage(item.url)" />
-            <i class="el-icon-upload2" @click="uploadImage(item.url)" />
-            <i class="el-icon-delete" @click="deleteImage(item.url)" />
-          </div>
-        </div>
-      </div>
-      <div v-if="multiple || (!multiple && fileList.length < 1)" class="add" @click="uploadImage()">
-        <i class="el-icon-plus" />
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-import request from '@/utils/request'
-import { findElem } from '@/utils/util'
-
-export default {
-  name: 'FileUpload',
-  props: {
-    // 接受上传的文件列表
-    fileList: Array,
-
-    // 接受上传的文件类型
-    fileType: {
-      type: Array,
-      default: () => ['image', 'word', 'excel', 'ppt', 'pdf', 'file']
-    },
-
-    // 是否支持多选文件
-    multiple: {
-      type: Boolean,
-      default: false
-    },
-    startRestricting: {
-      type: Boolean,
-      default: false
-    },
-    restrictFilename: {
-      type: Array,
-      default: () => {
-        return []
-      }
-    }
-  },
-  data() {
-    return {
-      imageURL: this.$imageUrl,
-      oss_url: '',
-      aliosstoken: '',
-      dataObj: {},
-      uploadImageUrl: '',
-      waitUploadList: [],
-      fileName: ''
-    }
-  },
-  computed: {
-    isShowFileList: {
-      get: function () {
-        if (this.fileList.length > 0 && this.fileList[0].url) {
-          return true
-        } else {
-          return false
-        }
-      },
-      set: function (newValue) {}
-    },
-    accept() {
-      const imageList = ['.jpg', '.jpeg', '.png']
-      const videoList = ['.mp4']
-      const wordList = ['.doc', '.docx', '.dot', '.wps', '.wpt']
-      const excelList = ['.xls', '.xlsx', '.xlt', '.et', '.ett']
-      const pptList = ['.ppt', '.pptx', '.dps', '.dpt', '.pot', '.pps']
-      const pdfList = ['.pdf']
-      const fileList = ['.zip', '.rar', '.gz', '.apk']
-      let whiteList = []
-      this.fileType.includes('image') && (whiteList = whiteList.concat(imageList))
-      this.fileType.includes('video') && (whiteList = whiteList.concat(videoList))
-      this.fileType.includes('word') && (whiteList = whiteList.concat(wordList))
-      this.fileType.includes('excel') && (whiteList = whiteList.concat(excelList))
-      this.fileType.includes('ppt') && (whiteList = whiteList.concat(pptList))
-      this.fileType.includes('pdf') && (whiteList = whiteList.concat(pdfList))
-      this.fileType.includes('file') && (whiteList = whiteList.concat(fileList))
-      return whiteList.join(',')
-    },
-    previewImages() {
-      const fileList = []
-      if (this.fileList && this.fileList.length > 0) {
-        this.fileList.forEach(item => {
-          if (this.checkFileType(item.url) == 'image') {
-            fileList.push(this.imageURL + item.url)
-          }
-        })
-      }
-      return fileList
-    }
-  },
-  created() {
-    request({
-      url: '/qviKHUYsyN.php/index/getAliOssToken',
-      method: 'get',
-      params: {}
-    }).then(res => {
-      this.aliosstoken = res.data.aliosstoken
-      this.oss_url = res.data.host
-    })
-  },
-  methods: {
-    getUUID() {
-      return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
-        return (c === 'x' ? (Math.random() * 16) | 0 : 'r&0x3' | '0x8').toString(16)
-      })
-    },
-    createName(name) {
-      const date = Date.now()
-      const uuid = this.getUUID()
-      const fileSuffix = name.substring(name.lastIndexOf('.') + 1)
-      return `${date}${uuid}.${fileSuffix}`
-    },
-
-    // 检查文件类型
-    checkFileType(url) {
-      if (!url) return ''
-      const fileSuffix = url.substring(url.lastIndexOf('.') + 1)
-
-      if (['jpg', 'jpeg', 'png'].includes(fileSuffix)) {
-        return 'image'
-      } else if (['doc', 'docx', 'dot', 'wps', 'wpt'].includes(fileSuffix)) {
-        return 'word'
-      } else if (['xls', 'xlsx', 'xlt', 'et', 'ett'].includes(fileSuffix)) {
-        return 'excel'
-      } else if (['ppt', 'pptx', 'dps', 'dpt', 'pot', 'pps'].includes(fileSuffix)) {
-        return 'ppt'
-      } else if (['pdf'].includes(fileSuffix)) {
-        return 'pdf'
-      } else if (['zip', 'rar', 'gz', 'apk'].includes(fileSuffix)) {
-        return 'file'
-      }
-      {
-        return 'pdf'
-      }
-    },
-
-    // 获取oss配置
-    async getOssConfig(fileName) {
-      const result = await new Promise((resolve, reject) => {
-        getOssConfig()
-          .then(res => {
-            const fileKey = this.createName(fileName)
-
-            res.data.name = fileName
-            res.data.key = res.data.dir + fileKey
-
-            resolve(res.data)
-          })
-          .catch(res => {
-            resolve({})
-          })
-      })
-      return result
-    },
-
-    // 预览图片
-    previewImage(url) {
-      const index = findElem(this.fileList, 'url', url)
-      this.$refs.img[index].showViewer = true
-    },
-
-    // 删除图片
-    deleteImage(url) {
-      const index = findElem(this.fileList, 'url', url)
-      this.fileList.splice(index, 1)
-    },
-
-    // 点击上传
-    uploadImage(url) {
-      this.uploadImageUrl = url
-      document.querySelector('.uploader input').click()
-    },
-
-    // 上传文件之前
-    async beforeUpload(file) {
-      const loading = this.$loading({
-        lock: true,
-        text: 'Loading',
-        spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.7)'
-      })
-
-      // this.getFileName(file.name);
-      // this.$emit("handleIsFileName", this.fileName);
-      this.dataObj = await this.getOssConfig(this.fileName)
-      console.log(this.dataObj, 'ppp')
-      this.waitUploadList.push(this.dataObj)
-    },
-
-    // 文件上传成功
-    uploadSuccess(res, file) {
-      const loading = this.$loading({
-        lock: true,
-        text: 'Loading',
-        spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.7)'
-      })
-
-      if (this.uploadImageUrl) {
-        const index = findElem(this.fileList, 'url', this.uploadImageUrl)
-        this.$set(this.fileList, index, {
-          name: this.dataObj.name,
-          url: this.dataObj.key,
-          hover: false
-        })
-        this.waitUploadList = []
-      } else {
-        this.getFileName(file.name)
-        const index = findElem(this.waitUploadList, 'name', this.fileName)
-
-        this.fileList.push({
-          name: this.waitUploadList[index].name,
-          url: this.waitUploadList[index].key,
-          hover: false
-        })
-
-        this.waitUploadList.splice(index, 1)
-      }
-      this.showFileList = true
-      loading.close()
-    },
-
-    getFileName(name) {
-      const fileName = name.substring(0, name.lastIndexOf('.'))
-      let suffix = name.match(/.[^.]+$/)[0]
-      console.log(suffix, fileName)
-      // 押金申请上传限制
-      this.fileName = name
-      if (this.startRestricting) {
-        // 检查是否存在相应文字，否filterKeywords.length = 0
-        const filterKeywords = this.restrictFilename.filter(k => fileName.includes(k))
-        // filterKeywords = 0 || 'zip', 'rar', 'gz', 'apk' 归为 其他文件
-        if (!filterKeywords.length || suffix.includes('zip', 'rar', 'gz', 'apk')) {
-          this.fileName = `其他文件${suffix}`
-        }
-        // 限制照片/相片名称统一为照片 ， restrictFilename[restrictFilename.length-1|restrictFilename.length-1]为照片、相片
-        if (fileName.includes('相片') || fileName.includes('照片')) {
-          this.fileName = `照片${suffix}`
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-.images {
-  display: flex;
-  flex-wrap: wrap;
-  .item {
-    margin-right: 20px;
-    .img {
-      width: 120px;
-      height: 120px;
-      border-radius: 5px;
-      overflow: hidden;
-      position: relative;
-      border: 1px dashed #eaeaea;
-      display: flex;
-      .el-image {
-        display: block;
-      }
-      .file {
-        width: 120px;
-        height: 120px;
-        display: block;
-        padding: 30px;
-      }
-      .mask {
-        position: absolute;
-        left: 0;
-        top: 0;
-        width: 120px;
-        height: 120px;
-        background: rgba($color: #000000, $alpha: 0.3);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        i {
-          font-size: 20px;
-          color: #ffffff;
-          cursor: pointer;
-          margin: 0 8px;
-        }
-      }
-    }
-  }
-  .add {
-    width: 120px;
-    height: 120px;
-    border: 1px dashed #eaeaea;
-    border-radius: 5px;
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    i {
-      font-size: 30px;
-      color: #999;
-    }
-  }
-}
-.uploader {
-  height: 0;
-}
-</style>

src/components/Common/imageUploadPhp.vue

@@ -1,318 +0,0 @@
-<template>
-	<div>
-		<el-upload
-			:action="upload_host"
-			:data="dataObj"
-			:multiple="uploadNum > 1?true:false"
-			:show-file-list="false"
-
-			:before-upload="beforeUpload"
-			:on-remove="handleRemove"
-			:on-success="handleUploadSuccess"
-			:on-preview="handlePreview"
-			:disabled="!isDisabled"
-			:class="name"
-			class="avatar-uploader2"
-		>
-		</el-upload>
-		<div class="images">
-		  <div class="item" v-for="(item, index) in fileList" :key="index">
-		    <div class="img" @mouseover="item.hover = true;" @mouseout="item.hover = false;">
-		      <el-image @click.stop="handleClickItem" ref="img" v-if="isImageUrl(item.url)" :src="item.url" :preview-src-list="previewImages()" style="width: 120px; height: 120px" fit="cover"></el-image>
-		      <video v-else :src="item.url" controls style="width: 120px; height: 120px; display: block"></video>
-		      <div class="mask" v-show="item.hover">
-		        <i class="el-icon-zoom-in" @click="previewImage(item.url)" v-if="isImageUrl(item.url)"></i>
-		        <i class="el-icon-zoom-in" @click="previewVideo(item.url)" v-else></i>
-		        <i class="el-icon-upload2" @click="uploadImage(item.url)" v-if="!isDisabled"></i>
-		        <i class="el-icon-delete" @click="deleteImage(item.url)" v-if="!isDisabled"></i>
-		      </div>
-		    </div>
-		  </div>
-		  <div class="add" v-if="fileList.length < uploadNum" @click="uploadImage()"><i class="el-icon-plus"></i></div>
-		</div>
-		<!-- <el-dialog :visible.sync="dialogVisible" :append-to-body="true"><img width="100%" :src="showImage" alt="" /></el-dialog> -->
-	</div>
-</template>
-<script>
-import request from '@/utils/request';
-import { findElem } from '@/utils/util'
-export default {
-	name: 'ImageUploadPhp',
-	props: {
-		isDisabled: Boolean,
-		fileType: String,
-		name: String,
-		// fileList: Array,
-		uploadNum: {
-			type: Number,
-			default: 1,
-		},
-		index: {
-			type: Number,
-			default: 0,
-		},
-	},
-	data() {
-		return {
-			dataObj: {
-				policy: '',
-				signature: '',
-				key: '',
-				ossaccessKeyId: '',
-			},
-			aliosstoken: '',
-			upload_host: '',
-			showImage: '',
-			dialogVisible: false,
-			uploadImageId: '',
-			fileList: [],
-			list: []
-		};
-	},
-	created() {
-		request({
-			url: '/qviKHUYsyN.php/index/getAliOssToken',
-			method: 'get',
-			params: {}
-		}).then(res => {
-			this.aliosstoken = res.data.aliosstoken;
-			this.upload_host = res.data.upload_host
-		});
-	},
-	computed: {
-		showFileList: {
-			get: function() {
-				if (this.fileList.length > 0 && this.fileList[0].url) {
-					return true;
-				} else {
-					return false;
-				}
-			},
-			set: function(newValue) {}
-		}
-	},
-	methods: {
-		emitInput(val) {
-			this.$emit('input', val);
-		},
-		handleClickItem(){
-			// 获取遮罩层dom
-			setTimeout(function(){
-			  let domImageMask = document.querySelector(".el-image-viewer__wrapper");
-			  if (!domImageMask) {
-			    return;
-			  }
-			  domImageMask.addEventListener("click", (e) => {
-			    if(e.target.parentNode.className == 'el-image-viewer__actions__inner') {
-			      return;  //如果点击底部菜单，不关闭
-			    }
-			    // 点击遮罩层时调用关闭按钮的 click 事件
-			    document.querySelector(".el-image-viewer__close").click();
-			  });
-			},300)
-		},
-		handleRemove(file, fileList) {
-			if (fileList.length == 0) {
-				this.fileList = [{ name: '', url: '' }];
-				// this.showFileList = false;
-			} else {
-				this.fileList = fileList;
-			}
-		},
-		handlePreview(file) {
-			// const fileExtension = file.name.substring(file.name.lastIndexOf('.') + 1);
-			// if (fileExtension == 'png' || fileExtension == 'jpg' || fileExtension == 'jpeg') {
-			// 	this.showImage = file.url;
-			// 	// this.showImage = file.full_url;
-			// 	this.dialogVisible = true;
-			// } else {
-			// 	window.open(file.url);
-			// 	// window.open(file.full_url);
-			// }
-		},
-		getUUID() {
-			return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
-				return (c === 'x' ? (Math.random() * 16) | 0 : 'r&0x3' | '0x8').toString(16);
-			});
-		},
-		beforeUpload(file) {
-			if(this.fileType == 'image'){
-				if(!file.type.includes('image')){
-					return this.$message.warning('该选项只支持上传图片格式的文件！');
-				}
-			}else if(this.fileType == 'video'){
-				if(!file.type.includes('video')){
-					return this.$message.warning('该选项只支持上传视频格式的文件！');
-				}
-			}else if(this.fileType == 'image/video'){
-				if(!file.type.includes('image') && !file.type.includes('video')){
-					return this.$message.warning('该选项只支持上传视频或图片格式的文件！');
-				}
-			}
-			
-			this.list.push(file.name)
-			if(this.list.length > this.uploadNum){
-				this.$message.warning('最多上传' + this.uploadNum +'个文件!');
-				return false
-			}
-			const that = this;
-			return new Promise((resolve, reject) => {
-				request({
-					url: '/addons/alioss/index/params',
-					method: 'post',
-					data: {
-						method: 'POST',
-						md5: file.name.substring(0, file.name.indexOf('.')),
-						name: file.name,
-						type: file.type,
-						size: file.size,
-						aliosstoken: this.aliosstoken
-					}
-				})
-					.then(res => {
-						that.dataObj = res.data;
-						resolve(true);
-					})
-					.catch(err => {
-						reject(false);
-					});
-			});
-		},
-		handleUploadSuccess(res, file, fileList) {
-			console.log(this.fileList)
-			// if (this.fileList.length == 1 && !this.fileList[0].url) {
-			// 	this.fileList.pop();
-			// }
-			// this.showFileList = true;
-			this.fileList.push({
-				name: file.name,
-				hover: false,
-				url: process.env.VUE_APP_BASE_API + 'qviKHUYsyN.php/index/getOssSign?object=' + this.dataObj.key.replace('${filename}', file.name)
-			});
-			
-			this.$emit('editUrl', {
-				name: file.name,
-				hover: false,
-				url: this.dataObj.key.replace('${filename}', file.name)
-			},this.name,this.index);
-			// this.fileList.push({
-			// 	name: file.name,
-			// 	url: this.dataObj.key.replace('${filename}', file.name),
-			// 	full_url: process.env.VUE_APP_BASE_API + 'qviKHUYsyN.php/index/getOssSign?object=' + this.dataObj.key.replace('${filename}', file.name)
-			// });
-		},
-		previewImages() {
-		  let images = [];
-		  if(this.fileList && this.fileList.length > 0) {
-		    this.fileList.forEach(item => {
-		      if(this.isImageUrl(item.url)) {
-		        images.push(item.url);
-		      }
-		    })
-		  }
-		  return images;
-		},
-		// 预览图片
-		previewImage(url) {
-		  let images = [];
-		  this.fileList.forEach(item => {
-		    if(this.isImageUrl(item.url)) {
-		      images.push(item);
-		    }
-		  })
-		  let index = findElem(images, 'url', url);
-		  this.$refs.img[index].showViewer = true;
-		},
-		// 预览视频
-		previewVideo(url) {
-		  // this.previewVideoUrl = url;
-		  // this.previewVideoDialog = true;
-		},
-		isImageUrl(url) {
-			const fileSuffix = url.substring(url.lastIndexOf(".") + 1);
-			const whiteList = ['jpg', 'jpeg', 'png'];
-			if (whiteList.indexOf(fileSuffix) === -1) {
-				return false;
-			}else {
-				return true;
-			}
-		},
-		uploadImage(id) {
-		    this.list = []
-		    this.uploadImageId = id;
-		    document.querySelector(`.${this.name} input`).click();
-		},
-		// 删除图片
-		deleteImage(url) {
-		  let index = findElem(this.fileList, 'url', url);
-		  this.fileList.splice(index, 1);
-		},
-	}
-};
-</script>
-<style type="text/css" lang="scss">
-	.images {
-	  display: flex;
-	  flex-wrap: wrap;
-	  .item {
-	    display: flex;
-	    flex-direction: column;
-	    justify-content: center;
-	    align-items: center;
-	    width: 120px;
-	    margin-right: 20px;
-	    .img {
-	      border: 1px dashed #eaeaea;
-	      border-radius: 5px;
-	      overflow: hidden;
-	      position: relative;
-	      .el-image {
-	        display: block;
-	      }
-	      .mask {
-	        position: absolute;
-	        left: 0;
-	        top: 0;
-	        width: 120px;
-	        height: 120px;
-	        background: rgba($color: #000000, $alpha: 0.3);
-	        display: flex;
-	        align-items: center;
-	        justify-content: center;
-	        i {
-	          font-size: 20px;
-	          color: #ffffff;
-	          cursor: pointer;
-	          margin: 0 8px;
-	        }
-	      }
-	    }
-	    .add {
-	      border: 1px solid #dddddd;
-	      border-radius: 5px;
-	      cursor: pointer;
-	    }
-	    .text {
-	      font-size: 14px;
-	      color: #666666;
-	    }
-	  }
-	  .add {
-	    width: 120px;
-	    height: 120px;
-	    border: 1px solid #dddddd;
-	    border-radius: 5px;
-	    cursor: pointer;
-	    display: flex;
-	    align-items: center;
-	    justify-content: center;
-	    i {
-	      font-size: 30px;
-	      color: #999;
-	    }
-	  }
-	}
-	.avatar-uploader2 {
-	  height: 0;
-	}
-</style>

src/components/Common/importUpload.vue

@@ -1,124 +0,0 @@
-<template>
-	<div>
-		<el-upload
-			:action="oss_url"
-			:data="dataObj"
-			:multiple="false"
-			:show-file-list="showFileList"
-			:file-list="fileList"
-			:before-upload="beforeUpload"
-			:on-remove="handleRemove"
-			:on-success="handleUploadSuccess"
-		>
-			<el-button size="small" type="primary">{{fileList.length == 0 ? '点击上传':'重新上传'}}</el-button>
-		</el-upload>
-	</div>
-</template>
-<script>
-import request from '@/utils/request';
-export default {
-	name: 'importUpload',
-	props: {
-		fileList: Array
-	},
-	data() {
-		return {
-			oss_url: '',
-			dataObj: {
-				policy: '',
-				signature: '',
-				key: '',
-				ossaccessKeyId: '',
-			},
-			aliosstoken: '',
-		};
-	},
-	created() {
-		request({
-			url: '/qviKHUYsyN.php/index/getAliOssToken',
-			method: 'get',
-			params: {}
-		}).then(res => {
-			this.aliosstoken = res.data.aliosstoken;
-			this.oss_url = res.data.upload_host;
-		});
-	},
-	computed: {
-		showFileList: {
-			get: function() {
-				if (this.fileList.length > 0 && this.fileList[0].url) {
-					return true;
-				} else {
-					return false;
-				}
-			},
-			set: function(newValue) {}
-		}
-	},
-	methods: {
-		getUUID() {
-			return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
-				return (c === 'x' ? (Math.random() * 16) | 0 : 'r&0x3' | '0x8').toString(16);
-			});
-		},
-		createName(name) {
-			const date = Date.now();
-			const uuid = this.getUUID();
-			const fileSuffix = name.substring(name.lastIndexOf(".") + 1);
-			return `${date}${uuid}.${fileSuffix}`;
-		},
-		handleRemove(file, fileList) {
-			this.fileList = [{ name: '', url: '' }];
-		},
-		beforeUpload(file) {
-			const that = this;
-			const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1);
-      const whiteList = ['xls', 'xlsx', 'xlsm'];
-      if (whiteList.indexOf(fileSuffix) === -1) {
-        return this.$errorMsg('只支持上传excel表格文件!');
-      }
-			const fileName = this.createName(file.name);
-			const loading = this.$loading({
-        lock: true,
-        text: 'Loading',
-        spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.7)'
-      });
-			return new Promise((resolve, reject) => {
-				request({
-					url: '/addons/alioss/index/params',
-					method: 'post',
-					data: {
-						method: 'POST',
-						md5: fileName.substring(0, fileName.indexOf('.')),
-						name: fileName,
-						type: file.type,
-						size: file.size,
-						aliosstoken: this.aliosstoken
-					}
-				}).then(res => {
-					that.dataObj = res.data;
-					resolve(true);
-				}).catch(err => {
-					reject(false);
-				});
-			});
-		},
-		handleUploadSuccess(res, file, fileList) {
-			const loading = this.$loading({
-        lock: true,
-        text: 'Loading',
-        spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.7)'
-      });
-			this.fileList.pop();
-			this.fileList.push({
-				name: file.name,
-				url: this.dataObj.key
-			});
-			this.showFileList = true;
-			loading.close();
-		}
-	}
-};
-</script>

src/components/Common/importUploadPhp.vue

@@ -1,206 +0,0 @@
-<template>
-	<block>
-		<el-upload style="display: inline-block; margin: 0 10px;" :action="upload_host" :data="dataObj" :multiple="false" :before-upload="beforeUpload" :on-success="handleUploadSuccess" :file-list="importFileList">
-			<el-button @click="upload" size="small" type="primary" :loading="importLoading">{{ importLoading ? '导入中...' : title }}</el-button>
-		</el-upload>
-		<el-dialog title="错误提示" :visible.sync="isShowMsg" width="50%" :close-on-click-modal="false" :destroy-on-close="true">
-			<div class="html" v-html="html"></div>
-			<div slot="footer" class="dialog-footer">
-				<el-button type="primary" @click="isShowMsg = false">确定</el-button>
-			</div>
-		</el-dialog>
-	</block>
-</template>
-<script>
-import request from '@/utils/request';
-import SparkMD5 from 'spark-md5'
-export default {
-	name: 'importUploadPhp',
-	props: {
-		requestUrl: {
-			type: String,
-			default: ''
-		},
-		title: {
-			type: String,
-			default: '导入'
-		},
-		batch_month: {
-			type: String,
-			default: ''
-		},
-	},
-	data() {
-		return {
-			importFileList: [],
-			importLoading: false,
-			timer: '',
-			aliosstoken: '',
-			upload_host: '',
-			dataObj: {
-				policy: '',
-				signature: '',
-				key: '',
-				ossaccessKeyId: '',
-			},
-			md5: '',
-			isShowMsg: false,
-			html: ''
-		};
-	},
-	created() {
-		
-	},
-	methods: {
-		getAliOssToken(){
-			const that = this;
-			request({
-				url: '/qviKHUYsyN.php/index/getAliOssToken',
-				method: 'get',
-				params: {}
-			}).then(res => {
-				that.aliosstoken = res.data.aliosstoken;
-				that.upload_host = res.data.upload_host
-			});
-		},
-		close(){
-			this.isShowMsg = false
-		},
-		emitInput(val) {
-			this.$emit('input', val);
-		},
-		upload(){
-			this.getAliOssToken()
-		},
-		beforeUpload(file) {
-			const that = this;
-			return new Promise((resolve, reject) => {
-				var fileReader = new FileReader();
-				//此处打印file可看到file下的raw为文件属性
-				let blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice
-				var spark = new SparkMD5.ArrayBuffer();
-				//获取文件二进制数据
-				fileReader.readAsArrayBuffer(file)
-						
-				//异步执行函数
-				fileReader.onload = function(e){
-					spark.append(e.target.result);
-					var md5 = spark.end()
-					that.md5 = md5
-					console.log(md5)
-					request({
-						url: '/addons/alioss/index/params',
-						method: 'post',
-						data: {
-							method: 'POST',
-							md5: md5,
-							name: md5 + file.name.substring(file.name.lastIndexOf(".")),
-							type: file.type,
-							size: file.size,
-							aliosstoken: that.aliosstoken
-						}
-					})
-						.then(res => {
-							that.dataObj = res.data;
-							resolve(true);
-						})
-						.catch(err => {
-							reject(false);
-						});
-				}
-			});
-		},
-		handleUploadSuccess(res, file, fileList) {
-			this.getNotify(file)
-			this.toLead()
-		},
-		toLead() {
-			let params = {
-				file: this.dataObj.key.replace('${filename}')
-			}
-			request({
-				url: this.requestUrl,
-				method: 'post',
-				params
-			}).then(res => {
-				if(res.data.key){
-					this.timer = setInterval(()=> {
-						this.$message({
-							type: 'success',
-							message: '导入中，请等待...'
-						});
-						this.getCache(res.data.key)
-					},3000)
-				}else if(res.data.length > 0){
-					this.$emit('importSuccess',res.data)
-				} else {
-					this.$message.error(res.msg);
-				}
-				this.importLoading = false;
-				this.importFileList = [];
-			})
-		},
-		getNotify(file){
-			request({
-				url: '/addons/alioss/index/notify',
-				method: 'post',
-				data: {
-					method: 'POST',
-					url: this.dataObj.key.replace('${filename}'),
-					md5: this.md5,
-					name: this.md5 + file.name.substring(file.name.lastIndexOf(".")),
-					type: file.type,
-					size: file.size,
-					aliosstoken: this.aliosstoken
-				}
-			}).then(res => {
-				resolve(true);
-			}).catch(err => {
-				reject(false);
-			});
-		},
-		getCache(key){
-			let params = {
-				key: key
-			}
-			if(this.batch_month){
-				params.batch_month = this.batch_month
-			}
-			request({
-				url: '/qviKHUYsyN.php/index/getCache',
-				method: 'get',
-				params
-			}).then(res => {
-				if(res.data.import_bool){
-					clearInterval(this.timer)
-					this.$emit('importSuccess')
-					this.$message({
-						type: 'success',
-						message: '导入成功!'
-					});
-				}else if(res.code != 1){
-					clearInterval(this.timer)
-					// let html = ''
-					// let arr = res.msg.split('<br />\n')
-					// arr.forEach(item => {
-					// 	html += `<div>${item}</div>`
-					// })
-					this.html = res.msg
-					this.isShowMsg = true
-					if(res.msg.length < 500){
-						setTimeout(() => {
-							this.isShowMsg = false
-						},5000)
-					}
-				}
-			});
-		},
-	}
-};
-</script>
-<style type="text/css" scoped="scoped">
-	.html{
-		font-size: 16px;
-		line-height: 20px;
-	}
-</style>

src/components/Common/singleUpload.vue

@@ -1,156 +0,0 @@
-<template>
-	<div>
-		<el-upload
-			:action="upload_host"
-			:data="dataObj"
-			:multiple="false"
-			:show-file-list="showFileList"
-			:file-list="fileList"
-			:before-upload="beforeUpload"
-			:on-remove="handleRemove"
-			:on-success="handleUploadSuccess"
-			:on-preview="handlePreview"
-			:disabled="!isDisabled"
-		>
-			<el-button v-if="isDisabled" size="small" type="primary">点击上传</el-button>
-			<div v-if="isDisabled" slot="tip" class="el-upload__tip">可上传多个附件，不限制格式！</div>
-		</el-upload>
-		<el-dialog :visible.sync="dialogVisible" :append-to-body="true"><img width="100%" :src="showImage" alt="" /></el-dialog>
-	</div>
-</template>
-<script>
-import request from '@/utils/request';
-export default {
-	name: 'SingleUpload',
-	props: {
-		isDisabled: Boolean,
-		fileList: Array,
-		uploadNum: {
-			type: Number,
-			default: 1,
-		},
-		uploadType: {
-			type: Number,
-			default: 1,
-		}
-	},
-	data() {
-		return {
-			dataObj: {
-				policy: '',
-				signature: '',
-				key: '',
-				ossaccessKeyId: '',
-			},
-			aliosstoken: '',
-			upload_host: '',
-			showImage: '',
-			dialogVisible: false
-		};
-	},
-	created() {
-		console.log(this.fileList, 111, this.showFileList);
-		request({
-			url: '/qviKHUYsyN.php/index/getAliOssToken',
-			method: 'get',
-			params: {}
-		}).then(res => {
-			this.aliosstoken = res.data.aliosstoken;
-			this.upload_host = res.data.upload_host
-		});
-	},
-	computed: {
-		showFileList: {
-			get: function() {
-				if (this.fileList.length > 0 && this.fileList[0].url) {
-					return true;
-				} else {
-					return false;
-				}
-			},
-			set: function(newValue) {}
-		}
-	},
-	methods: {
-		emitInput(val) {
-			this.$emit('input', val);
-		},
-		handleRemove(file, fileList) {
-			if (fileList.length == 0) {
-				this.fileList = [{ name: '', url: '' }];
-				this.showFileList = false;
-			} else {
-				this.fileList = fileList;
-			}
-		},
-		handlePreview(file) {
-			const fileExtension = file.name.substring(file.name.lastIndexOf('.') + 1);
-			if (fileExtension == 'png' || fileExtension == 'jpg' || fileExtension == 'jpeg') {
-				if(this.uploadType == 1){
-					this.showImage = file.url;
-				}else{
-					this.showImage = file.full_url;
-				}
-				this.dialogVisible = true;
-			} else {
-				if(this.uploadType == 1){
-					window.open(file.url);
-				}else{
-					window.open(file.full_url);
-				}
-			}
-		},
-		getUUID() {
-			return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
-				return (c === 'x' ? (Math.random() * 16) | 0 : 'r&0x3' | '0x8').toString(16);
-			});
-		},
-		beforeUpload(file) {
-			if(this.fileList.length == this.uploadNum){
-				this.$message.warning('最多上传' + this.uploadNum +'个文件!');
-				return false
-			}
-			const that = this;
-			return new Promise((resolve, reject) => {
-				request({
-					url: '/addons/alioss/index/params',
-					method: 'post',
-					data: {
-						method: 'POST',
-						md5: file.name.substring(0, file.name.indexOf('.')),
-						name: file.name,
-						type: file.type,
-						size: file.size,
-						aliosstoken: this.aliosstoken
-					}
-				})
-					.then(res => {
-						that.dataObj = res.data;
-						resolve(true);
-					})
-					.catch(err => {
-						reject(false);
-					});
-			});
-		},
-		handleUploadSuccess(res, file, fileList) {
-			if (this.fileList.length == 1 && !this.fileList[0].url) {
-				this.fileList.pop();
-			}
-			this.showFileList = true;
-			if(this.uploadType == 1){
-				this.fileList.push({
-					name: file.name,
-					url: process.env.VUE_APP_BASE_API + 'qviKHUYsyN.php/index/getOssSign?object=' + this.dataObj.key.replace('${filename}', file.name)
-				});
-			}else{
-				this.fileList.push({
-					name: file.name,
-					url: this.dataObj.key.replace('${filename}', file.name),
-					full_url: process.env.VUE_APP_BASE_API + 'qviKHUYsyN.php/index/getOssSign?object=' + this.dataObj.key.replace('${filename}', file.name)
-				});
-			}
-		}
-	}
-};
-</script>

src/views/setting/fileDelivery/centralFileDelivery/index.vue

@@ -143,17 +143,7 @@
           <el-input v-model="importForm.title" placeholder="请输入标题"></el-input>
         </el-form-item>
         <el-form-item label="上传文件" prop="fileUrl">
-          <!-- <el-upload
-            ref="upload"
-            :action="baseURL + 'com/list/yonge'"
-            :headers="myHeaders"
-            :on-remove="handleRemove"
-            :on-change="handleChange"
-            :auto-upload="false"
-            :file-list="fileList">
-            <el-button size="small" type="primary">{{fileList.length == 0 ? '点击上传':'重新上传'}}</el-button>
-          </el-upload> -->
-          <import-upload :fileList="fileList" />
+          <ImageUpload :fileList="fileList" :limit="1" />
         </el-form-item>
         <el-form-item label="是否强制提醒" prop="isNotice" label-width="100px">
           <el-radio-group v-model="importForm.isNotice">
@@ -236,12 +226,12 @@
 <script>
 import { getToken } from '@/utils/auth'
 import { getList, getDownloadList, deleteData, exportFile, handleImport } from '@/api/universal/universal_list'
-import importUpload from '@/components/Common/importUpload.vue'
+import ImageUpload from '@/components/file-upload'
 import { downloadFiles } from '@/utils/util'
 import request from '@/utils/request'
 export default {
   components: {
-    importUpload
+    ImageUpload
   },
   data() {
     return {

src/views/setting/fileDelivery/masterFileDelivery/index.vue

@@ -131,7 +131,7 @@
           <el-input v-model="addFileForm.title" placeholder="请输入标题"></el-input>
         </el-form-item>
         <el-form-item label="上传文件" prop>
-          <import-upload :fileList="fileList" />
+          <ImageUpload :fileList="fileList" :limit="1" />
         </el-form-item>
         <el-form-item label="备注" prop="remark">
           <el-input type="textarea" v-model="addFileForm.remark" placeholder="请输入备注"></el-input>
@@ -148,11 +148,11 @@
 
 <script>
 import { getList, getComlistSave, getComlistUpdataStatus, getComlistDelete } from '@/api/app/fileLssued'
-import importUpload from '@/components/Common/importUpload.vue'
+import ImageUpload from '@/components/file-upload'
 import { downloadFiles } from '@/utils/util'
 export default {
   components: {
-    importUpload
+    ImageUpload
   },
   data() {
     return {