From eda46bf83619297600436e5015fd8977e9974219 Mon Sep 17 00:00:00 2001
From: luobisheng <727299681@qq.com>
Date: 星期五, 04 十一月 2022 15:50:31 +0800
Subject: [PATCH] Merge branch 'master' of http://42.193.1.25:9521/r/sccg_ui
---
src/components/myUpload/index.vue | 71 +++++++++++++++++++++++++++--------
1 files changed, 55 insertions(+), 16 deletions(-)
diff --git a/src/components/myUpload/index.vue b/src/components/myUpload/index.vue
index d51b510..c5930f0 100644
--- a/src/components/myUpload/index.vue
+++ b/src/components/myUpload/index.vue
@@ -1,8 +1,18 @@
<template>
<div class="my-upload">
- <el-upload :file-list="fileList" class="upload-demo" action="/sccg/file/medias" :multiple="multiple"
- :show-file-list="flag" :before-upload="beforeUpload" :limit="limit" :on-success="handleSuccess"
- :on-error="handleError" :list-type="listType" :headers="getToken()">
+ <el-upload
+ :file-list="fileList"
+ class="upload-demo"
+ action="/sccg/file/medias"
+ :multiple="multiple"
+ :show-file-list="flag"
+ :before-upload="beforeUpload"
+ :limit="limit"
+ :on-success="handleSuccess"
+ :on-error="handleError"
+ :list-type="listType"
+ :on-remove="handleRemove"
+ :headers="getToken()">
<div class="upload-btn" :style="{'height':btnHeight,'width':btnWidth}">
<i class="el-icon-plus"></i>
<span>涓婁紶鍥剧墖</span>
@@ -11,7 +21,6 @@
</div>
</template>
<script>
-
export default {
data() {
return {
@@ -22,11 +31,11 @@
// 澶氶��
multiple: false,
// 闄愬埗
- limit: 50,
+ limit: 4,
// 鎸夐挳楂樺害
- btnHeight: '120px',
+ btnHeight: '100px',
// 鎸夐挳瀹藉害
- btnWidth: '120px',
+ btnWidth: '100px',
// 鏂囦欢鍒楄〃绫诲瀷
listType: 'picture-card'
};
@@ -34,23 +43,37 @@
methods: {
// 涓婁紶涔嬪墠鍥炶皟
beforeUpload(rawFile) {
- console.log(rawFile);
if (rawFile.type !== 'image/png' && rawFile.type !== 'image/svg+xml' && rawFile.type !== 'image/jpg' && rawFile.type !== 'image/jpeg') {
this.$message.error('鍥剧墖蹇呴』鏄� jpg/svg/jpeg/png 鏍煎紡!')
return false
- } else if (rawFile.size / 105 / 105 > 2) {
- this.$message.error('涓婁紶鍥剧墖涓嶈兘瓒呰繃 2MB!')
+ } else if (rawFile.size / 1024 / 1024 > 5) {
+ this.$message.error('涓婁紶鍥剧墖涓嶈兘瓒呰繃 5MB!')
return false
}
return true
},
// 涓婁紶鎴愬姛鍥炶皟
handleSuccess(res, file, filelist) {
- console.log(res);
+ if(res.data.url1){
+ this.$emit('setPictureUrl',{url:res.data.url1});
+ }
+ else if(res.data.url2){
+ this.$emit('setPictureUrl',{url:res.data.url2});
+ }
+ else if(res.data.url3){
+ this.$emit('setPictureUrl',{url:res.data.url3});
+ }
+ else{
+ this.$emit('setPictureUrl',{url:res.data.url4});
+ }
},
// 涓婁紶澶辫触鍥炶皟
handleError(err, file, fileList) {
console.log(err);
+ this.$message({
+ type:'error',
+ message:err
+ })
},
// 鑾峰彇token
getToken() {
@@ -59,10 +82,26 @@
if (token && tokenHead) {
return { Authorization: tokenHead + token }
}
+ },
+ // 棰勮
+ handlePreview(file){
+ console.log(file)
+ },
+ // 绉婚櫎鏂囦欢
+ handleRemove(file, fileList){
+ this.$emit('delPictureUrl',{url:file.response.data.url1});
}
},
props: {
-
+ // 杩斿洖涓婁紶鎴愬姛鍥剧墖鍦板潃
+ setPictureUrl:{
+ type:Function,
+ default:()=>{}
+ },
+ delPictureUrl:{
+ type:Function,
+ default:()=>{}
+ }
}
}
</script>
@@ -73,12 +112,12 @@
}
:deep(.el-upload--picture-card) {
- width: 120px;
- height: 120px;
+ width: 100px;
+ height: 100px;
}
:deep(.el-upload-list__item){
- width: 120px;
- height: 120px;
+ width: 100px;
+ height: 100px;
}
.upload-btn {
// background-color: rgba(249, 249, 249, 1);
--
Gitblit v1.8.0