From 30cfb2b836a8a3d609518cc295753b58b17a9bc7 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期五, 15 十一月 2024 09:15:29 +0800
Subject: [PATCH] 优化
---
company/src/components/common/UploadFile.vue | 50 +++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 39 insertions(+), 11 deletions(-)
diff --git a/company/src/components/common/UploadFile.vue b/company/src/components/common/UploadFile.vue
index 9218330..4bb6bfb 100644
--- a/company/src/components/common/UploadFile.vue
+++ b/company/src/components/common/UploadFile.vue
@@ -3,17 +3,17 @@
<el-upload
ref="uploadFileBtn"
class="upload-demo"
- :accept="uploadData.fileTyp"
+ :accept="uploadData.fileType"
:action="uploadImgUrl"
- :limit="1"
+ :limit="limit"
:before-remove="removes"
:on-exceed="handleExceed"
:on-success="handleFileSuccess"
:on-error="uploadError"
:before-upload="beforeFileUpload"
:file-list="fileList">
- <el-button size="small" type="primary" >鐐瑰嚮涓婁紶</el-button>
- <div style="display: inline-block" slot="tip" class="el-upload__tip">(鍙兘涓婁紶{{ uploadData.fileType }}鏂囦欢锛屼笖涓嶈秴杩�5mb)</div>
+ <el-button size="small" type="primary" >鐐瑰嚮涓婁紶</el-button>
+ <div style="display: inline-block;position: absolute" slot="tip" class="el-upload__tip" v-if="showTips">{{'(鍙兘涓婁紶'+uploadData.fileType +'鏂囦欢锛屼笖涓嶈秴杩�5mb)'}}</div>
</el-upload>
</div>
@@ -30,15 +30,27 @@
type: Object,
default: () => {}
},
- tipsLabel: '',
+ fileIndex: {
+ type: Number,
+ default: () =>0
+ },
+ showTips: {
+ type: Boolean,
+ default: () => true
+ },
customStyle: {
type: String,
default: 'width: 190px; height: 190px;'
},
- uploadData: Object
+ uploadData: Object,
+ limit: {
+ type: Number,
+ default: () => 1
+ }
},
data() {
return {
+ uploaded:false,
// fileList:[],
uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/public/upload?folder='+this.uploadData.folder
}
@@ -48,12 +60,24 @@
if(this.fileList ==null){
this.fileList = new Array();
}
+ if(this.fileList.length == 0){
+ this.uploaded = false
+ }else{
+ this.uploaded=true
+ }
// alert(this.fileList)
+ },
+ tipsLabel (nv,ov) {
+ if(this.tipsLabel ==null){
+ this.tipsLabel = ''
+ }
}
},
methods: {
- removes() {
- this.$emit('remove')
+ removes(e) {
+ this.uploaded=false
+ console.log(e.imgaddr)
+ this.$emit('remove', e.imgaddr)
},
// 涓婁紶鍥剧墖
handleExceed(){
@@ -62,9 +86,10 @@
handleFileSuccess(res, file) {
if (res.code == 200) {
let { data } = res
+ this.uploaded = true
// this.fileList = [{name: data.originname, url: data.url }]
this.$message.success('涓婁紶鎴愬姛')
- this.$emit('uploadSuccess', { fileurl: data.imgaddr, fileurlFull: data.url, name: data.originname })
+ this.$emit('uploadSuccess', { fileurl: data.imgaddr, fileurlFull: data.url, name: data.originname ,index:this.fileIndex})
} else {
this.$message.apiFailed('涓婁紶澶辫触')
}
@@ -91,7 +116,7 @@
height: $image-width;
}
::v-deep .el-upload {
- border: 1px dashed #d9d9d9;
+ //border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
@@ -114,7 +139,7 @@
width: $image-width;
height: $image-width;
display: block;
-}
+}#67C23A
.tips-style {
height: 13px;
font-size: 13px;
@@ -128,6 +153,9 @@
width: 90px !important;
height: 90px !important;
}
+::v-deep .el-upload-list__item-name{
+ color: #67C23A;
+}
::v-deep .el-upload-list__item {
width: 80% !important;
height: 50px !important;
--
Gitblit v1.9.3