This commit is contained in:
2025-09-24 21:26:57 +08:00
parent 99a2748330
commit f9adf7c4fd
10 changed files with 489 additions and 192 deletions
@@ -1,7 +1,8 @@
<template>
<div>
<div v-if="view" class="viewFile">
<div v-for="(file,index) in files" class="viewFileItem" title="点击查看" @click="showSource(file,index,$event,files)">
<div v-for="(file,index) in files" class="viewFileItem" title="点击查看"
@click="showSource(file,index,$event,files)">
<template v-if="resolvingShowByFileName(file.filename) == 1">
<el-image
@@ -18,7 +19,7 @@
</svg>
</template>
<div :title="file.filename" class="viewFileName" title="点击下载" @click.stop="downLoadFile(file)">
<i class="el-icon-download"></i> {{file.filename }}
<i class="el-icon-download"></i> {{ file.filename }}
</div>
</div>
</div>
@@ -32,24 +33,31 @@
:on-success="onSuccess"
:file-list="fileList"
:on-exceed="handleExceed"
class="x100000 upload-card"
drag
:on-preview="handlePreview"
:data="{source:source}"
>
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处<em>点击上传</em>
<span @click.stop="openPicture"><em>图库上传</em></span>
<!-- <slot name="el-upload__tip"></slot>-->
<div class="el-upload__tip" slot="tip" v-if="showTip">
请上传
<template v-if="max_size"> 大小不超过 <b style="color: #f56c6c">{{ max_size / 1024 / 1024 }}MB</b></template>
<template v-if="size"> 尺寸为 <b style="color: #f56c6c">{{ size }}</b></template>
<template v-if="type"> 格式为 <b style="color: #f56c6c">{{ type.join("/") }}</b></template>
的文件
</div>
<!-- <slot name="el-upload__tip"></slot>-->
</div>
<div class="el-upload__tip" slot="tip">
请上传
<template v-if="max">最多<b style="color: #f56c6c">{{ max }}</b></template>
<template v-if="max_size"> 大小不超过 <b style="color: #f56c6c">{{ max_size / 1024 / 1024 }}MB</b></template>
<template v-if="size"> 尺寸为 <b style="color: #f56c6c">{{ size }}</b></template>
<template v-if="type"> 格式为 <b style="color: #f56c6c">{{ type.join("/") }}</b></template>
的文件
</div>
</el-upload>
@@ -71,6 +79,7 @@
<!-- <slot name="el-upload__tip"></slot>-->
<div class="el-upload__tip" slot="tip" v-if="showTip">
请上传
<template v-if="max">最多<b style="color: #f56c6c">{{ max }}</b></template>
<template v-if="max_size"> 大小不超过 <b style="color: #f56c6c">{{ max_size / 1024 / 1024 }}MB</b></template>
<template v-if="size"> 尺寸为 <b style="color: #f56c6c">{{ size }}</b></template>
<template v-if="type"> 格式为 <b style="color: #f56c6c">{{ type.join("/") }}</b></template>
@@ -558,7 +567,7 @@ module.exports = {
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.type || this.max_size);
return this.isShowTip && (this.type != null || this.max_size != null);
},
},
watch: {
@@ -570,8 +579,8 @@ module.exports = {
/**
* 查看资源
*/
showSource(showItem, index, e,files) {
const picArray = files.filter(o => [1,2,3].includes(this.resolvingShowByFileName(o.filename)))
showSource(showItem, index, e, files) {
const picArray = files.filter(o => [1, 2, 3].includes(this.resolvingShowByFileName(o.filename)))
const viewFileParent = $(e.target).closest(".viewFile")
const show = this.resolvingShowByFileName(showItem.filename)
@@ -718,7 +727,7 @@ module.exports = {
},
change(fileList) {
//此处要把origin传到父组件 防止图库里的图片被删除
this.$emit("update:files",fileList.filter(v=>v.data || v.id).map(v => {
this.$emit("update:files", fileList.filter(v => v.data || v.id).map(v => {
return {
origin: v.origin,
...v.data