图片上传优化

src/views/goods/create-good.vue

@@ -42,7 +42,7 @@
                     size="small"
                     v-model="formData.goodsDescription"
                     placeholder="请输入商品介绍"
-                    maxlength="1000"
+                    maxlength="30"
                     show-word-limit
                 ></el-input>
               <span class="word-tip">此文案可摘取药品说明书【功能主治】or【适应症】</span>
@@ -58,7 +58,8 @@
                   action="#"
                   :before-upload="beforeUploadPic"
                   multiple
-                
+                  :on-exceed="imgExceed"
+                  :limit="6"               
               >
                 <div class="file-pics" v-if="fileGoodsList.length > 0" :key="index" v-for="(item,index) in fileGoodsList">
                   <img :src="item.url" @mouseover.stop="headIndex=index" class="bg-img"/>
@@ -71,8 +72,8 @@
                      <i class="el-icon-delete"></i>
                    </div>
                 </div>
-                <img  class="bg-img" src="../../assets/image/small.png" v-if="fileGoodsList.length <10"/>
-                <div class="limit-text">
+                <img  class="bg-img" src="../../assets/image/small.png" v-if="fileGoodsList.length < 6"/>
+                <div class="limit-text" v-if="fileGoodsList.length < 6">
                  <!-- <p>限制大小: 200kb</p> -->
                   <p>建议尺寸：750*420</p>
                   <p>支持jpeg, png格式</p>
@@ -1595,11 +1596,17 @@
           })
         })
       },
+      imgExceed(file) {
+        if (file.length > 6) {
+          this.$message.error("最多只能上传6张图片");
+        };
+      },
       //上传商品头图
       beforeUploadPic(file) {
-        if(this.fileGoodsList.length > 10){
-          return ;
-        }
+        // if(this.fileGoodsList.length > 6){
+        //     this.$message.error("最多只能上传6张图片");
+        //     return ;
+        // }
         let vm = this;
         let picTypes = ['image/jpeg','image/png']