添加上传文件的样式

src/views/carouselFigure/advertisementEdit.vue

@@ -13,6 +13,7 @@
       </el-form-item>
       <el-form-item label="主图：">
         <el-upload
+                class="avatar-uploader"
                 :headers="uploadHeaders"
                 :action="upFileUrl"
                 :show-file-list="false"
@@ -479,15 +480,7 @@
   };
 </script>
 
-<style lang="scss">
-  .header {
-    width: 50px;
-    height: 50px;
-    img {
-      width: 100%;
-      height: 100%;
-    }
-  }
+<style scoped>
   .avatar-uploader .el-upload {
     border: 1px dashed #d9d9d9;
     border-radius: 6px;
@@ -496,7 +489,7 @@
     overflow: hidden;
   }
   .avatar-uploader .el-upload:hover {
-    border-color: #409eff;
+    border-color: #409EFF;
   }
   .avatar-uploader-icon {
     font-size: 28px;
@@ -511,6 +504,18 @@
     height: 178px;
     display: block;
   }
+
+</style>
+
+<style lang="scss">
+  .header {
+    width: 50px;
+    height: 50px;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
   .edit-carousel {
     .el-select {
       max-width: 300px !important;

src/views/carouselFigure/edit.vue

@@ -13,6 +13,7 @@
         </el-form-item>
         <el-form-item label="主图：">
           <el-upload
+                  class="avatar-uploader"
                   :headers="uploadHeaders"
                   :action="upFileUrl"
                   :show-file-list="false"
@@ -479,7 +480,34 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
+  .avatar-uploader .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+  .avatar-uploader .el-upload:hover {
+    border-color: #409EFF;
+  }
+  .avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 178px;
+    height: 178px;
+    line-height: 178px;
+    text-align: center;
+  }
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+  }
+
+</style>
+
+<style lang="scss" scoped>
 .header {
   width: 50px;
   height: 50px;
@@ -488,29 +516,6 @@ export default {
     height: 100%;
   }
 }
-.avatar-uploader .el-upload {
-  border: 1px dashed #d9d9d9;
-  border-radius: 6px;
-  cursor: pointer;
-  position: relative;
-  overflow: hidden;
-}
-.avatar-uploader .el-upload:hover {
-  border-color: #409eff;
-}
-.avatar-uploader-icon {
-  font-size: 28px;
-  color: #8c939d;
-  width: 178px;
-  height: 178px;
-  line-height: 178px;
-  text-align: center;
-}
-.avatar {
-  width: 178px;
-  height: 178px;
-  display: block;
-}
 .edit-carousel {
   .el-select {
     max-width: 300px !important;

src/views/customer/editCustomer.vue

@@ -7,6 +7,7 @@
         </el-form-item>
         <el-form-item label="客户照片：">
           <el-upload
+                  class="avatar-uploader"
                   :headers="uploadHeaders"
                   :action="upFileUrl"
                   :show-file-list="false"
@@ -263,7 +264,7 @@
   }
 </style>
 
-<style lang="scss">
+<style lang="scss" >
   .avatar-uploader .el-upload {
     border: 1px dashed #d9d9d9;
     border-radius: 6px;

src/views/customer/editRecommend.vue

@@ -7,6 +7,7 @@
         </el-form-item>
         <el-form-item label="客户照片：">
           <el-upload
+                  class="avatar-uploader"
                   :headers="uploadHeaders"
                   :action="upFileUrl"
                   :show-file-list="false"
@@ -282,6 +283,10 @@ export default {
 .form-wrapper {
   width: 60%;
 }
+.choose {
+  color: blue;
+  margin-left: 15px;
+}
 </style>
 
 <style lang="scss">
@@ -308,8 +313,4 @@ export default {
   height: 178px;
   display: block;
 }
-.choose {
-  color: blue;
-  margin-left: 15px;
-}
 </style>

src/views/news/edi/index.vue

@@ -12,8 +12,8 @@
                 </el-select>
             </el-form-item>
             <el-form-item label="资讯图片">
-<!--                class="avatar-uploader"-->
                 <el-upload
+                        class="avatar-uploader"
                         :headers="uploadHeaders"
                         :action="upFileUrl"
                         :show-file-list="false"
@@ -36,7 +36,7 @@
                 </el-select>
             </el-form-item>
             <el-form-item label="资讯详情">
-                <my-wangeditor :content="form.newsDetail" @get-content="getEdiCentent"></my-wangeditor>
+                <rich-editor v-model="form.newsDetail" style="height: 400px; width: 1000px;" />
             </el-form-item>
             <el-form-item label="状态">
                 <el-select v-model="form.newsStatus" placeholder="请选择">
@@ -189,7 +189,7 @@
     }
 </script>
 
-<style scoped>
+<style lang="scss">
     .avatar-uploader .el-upload {
         border: 1px dashed #d9d9d9;
         border-radius: 6px;
@@ -213,9 +213,4 @@
         height: 178px;
         display: block;
     }
-    .form {
-        width: 800px;
-        margin-left: auto;
-        margin-right: auto;
-    }
 </style>

src/views/news/type/edi/index.vue

@@ -14,6 +14,7 @@
             <el-form-item label="图片">
 <!--                class="avatar-uploader"-->
                 <el-upload
+                        class="avatar-uploader"
                         :headers="uploadHeaders"
                         :action="upFileUrl"
                         :show-file-list="false"
@@ -75,6 +76,15 @@
                 // console.log(res)
                 this.form.newsTypeImg = res.data
             },
+            beforeImgUpload(file) {
+                if (file.type !== "image/jpeg" && file.type !== "image/png") {
+                    this.$message.error("上传图片只能是 JPG 或 PNG 格式!");
+                    return false;
+                }
+
+                this.showLoadding("上传中...");
+                return true;
+            },
             getBuildList() {
                 this.$store.dispatch('building/getBuildings', this.buildingForm).then((res) => {
                     this.buildingList = res.records
@@ -117,11 +127,17 @@
                 }).catch(() => {
                     console.log('news/getTypeById err')
                 })
-            }
+            },
         }
     }
 </script>
-
+<style lang="scss" scoped>
+.form {
+    width: 300px;
+    margin-left: auto;
+    margin-right: auto;
+}
+</style>
 <style scoped>
     .avatar-uploader .el-upload {
         border: 1px dashed #d9d9d9;
@@ -146,9 +162,5 @@
         height: 178px;
         display: block;
     }
-    .form {
-        width: 300px;
-        margin-left: auto;
-        margin-right: auto;
-    }
+
 </style>