From c5d408958de4cd76c26ae939401675f0bfa24fa3 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期二, 22 十一月 2022 22:34:10 +0800
Subject: [PATCH] 文书目标优化

---
 src/components/myUpload/index.vue |   64 +++++++++++++++++---------------
 1 files changed, 34 insertions(+), 30 deletions(-)

diff --git a/src/components/myUpload/index.vue b/src/components/myUpload/index.vue
index 6bcc4ff..a7f4acb 100644
--- a/src/components/myUpload/index.vue
+++ b/src/components/myUpload/index.vue
@@ -1,9 +1,8 @@
 <template>
     <div class="my-upload">
-        <el-upload 
+        <el-upload
         :file-list="fileList" 
-        class="upload-demo" 
-        action="/sccg/file/medias" 
+        action="/sccg/file/medias"
         :multiple="multiple"
         :show-file-list="flag" 
         :before-upload="beforeUpload" 
@@ -11,12 +10,11 @@
         :on-success="handleSuccess"
         :on-error="handleError" 
         :list-type="listType" 
-        :on-preview="handlePreview" 
         :on-remove="handleRemove"
         :headers="getToken()">
-            <div class="upload-btn" :style="{'height':btnHeight,'width':btnWidth}">
-                <i class="el-icon-plus"></i>
-                <span>涓婁紶鍥剧墖</span>
+            <div class="upload-btn">
+              <i class="el-icon-plus"></i>
+              <span>涓婁紶鍥剧墖</span>
             </div>
         </el-upload>
     </div>
@@ -32,11 +30,7 @@
             // 澶氶��
             multiple: false,
             // 闄愬埗
-            limit: 50,
-            // 鎸夐挳楂樺害
-            btnHeight: '120px',
-            // 鎸夐挳瀹藉害
-            btnWidth: '120px',
+            limit: 4,
             // 鏂囦欢鍒楄〃绫诲瀷
             listType: 'picture-card'
         };
@@ -47,8 +41,8 @@
             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
@@ -70,7 +64,6 @@
         },
         // 涓婁紶澶辫触鍥炶皟
         handleError(err, file, fileList) {
-            console.log(err);
             this.$message({
                 type:'error',
                 message:err
@@ -84,13 +77,9 @@
                 return { Authorization: tokenHead + token }
             }
         },
-        // 棰勮
-        handlePreview(file){
-            console.log(file)
-        },
         // 绉婚櫎鏂囦欢
         handleRemove(file, fileList){
-            console.log(file,fileList)
+            this.$emit('delPictureUrl',{url:file.response.data.url1});
         }
     },
     props: {
@@ -98,31 +87,41 @@
         setPictureUrl:{
             type:Function,
             default:()=>{}
-        }
-    }
+        },
+        delPictureUrl:{
+            type:Function,
+            default:()=>{}
+        },
+      pictureList: {
+        type: Array,
+        default: () => []
+      }
+    },
 }
 </script>
 <style lang="scss" scoped>
 .my-upload {
-    .upload-demo {
-        display: flex;
-    }
 
     :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;
     }
+  //.file-list {
+  //  display: flex;
+  //  flex-wrap: nowrap;
+  //}
     .upload-btn {
-        // background-color: rgba(249, 249, 249, 1);
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
         border-radius: 4px;
+        width: 100px;
+        height: 100px;
 
         &:hover i{
             color: #409eff;
@@ -137,5 +136,10 @@
             line-height: 22px;
         }
     }
+    .uploaded-image {
+      width: 0;
+      height: 100px;
+      display: flex;
+    }
 }
 </style>
\ No newline at end of file

--
Gitblit v1.8.0