首页推荐

src/components/Upload/index.vue

@@ -1,14 +1,21 @@
 <template>
   <div class="photo-container">
     <div>
-      <el-upload  class="avatar-uploader" :action="uploadUrl" :limit="1" :show-file-list="false" :on-success="uploadSuccess"
-      :on-remove="removeUrl" :data="{ 'code': code, 'ossKey': 'xingyou2', 'pathKey': 'banner-group', 'encrypt': 'PUBLIC' }"> 
-      <img v-if="photoUrl" :src="photoUrl" class="avatar">
-      <i v-else class="el-icon-plus avatar-uploader-icon" />
-    </el-upload> 
-    <div @click="removeUrl" style="width: 100%;text-align: center;" v-if="photoUrl" >
-      <i style="font-size: 20px;"  class="el-icon-delete" /> 
-    </div>
+      <el-upload
+        class="avatar-uploader"
+        :action="uploadUrl"
+        :limit="1"
+        :show-file-list="false"
+        :on-success="uploadSuccess"
+        :on-remove="removeUrl"
+        :data="{ code: code, ossKey: 'xingyou2', pathKey: 'banner-group', encrypt: 'PUBLIC' }"
+      >
+        <img v-if="photoUrl" :src="photoUrl" class="avatar" />
+        <i v-else class="el-icon-plus avatar-uploader-icon" />
+      </el-upload>
+      <div @click="removeUrl" style="width: 100%;text-align: center;" v-if="photoUrl">
+        <i style="font-size: 20px;" class="el-icon-delete" />
+      </div>
     </div>
     <span class="upload-span">
       <slot name="bottom">{{ tip }}</slot>
@@ -21,9 +28,10 @@ export default {
   props: {
     tip: {
       type: String,
-      default: "请上传图片"
+      default: '请上传图片'
     },
-    photo: { // 传参用的url
+    photo: {
+      // 传参用的url
       type: String,
       default: null
     },
@@ -31,7 +39,8 @@ export default {
       type: String,
       default: 'A001'
     },
-    isPrivate: { // 是否加密
+    isPrivate: {
+      // 是否加密
       type: Boolean,
       default: false
     }
@@ -44,10 +53,10 @@ export default {
     }
   },
   watch: {
-    photo: function (newVal, oldVal) {
+    photo: function(newVal, oldVal) {
       this.photoUrl = newVal
     },
-    isPrivate: function (newVal, oldVal) {
+    isPrivate: function(newVal, oldVal) {
       this.changeUploadUrl
     }
   },
@@ -62,8 +71,8 @@ export default {
         this.uploadUrl = process.env.VUE_APP_UPLOAD_URL
       }
     },
-    removeUrl(file, fileList) { 
-      this.$emit('success', "", {data:{publicUrl:""},code:20000});
+    removeUrl(file, fileList) {
+      this.$emit('success', '', { data: { publicUrl: '' }, code: 20000 })
     },
     uploadSuccess(res, file) {
       if (res.code === 20000) {
@@ -81,9 +90,8 @@ export default {
   }
 }
 </script>
-<style scoped lang="scss"> 
-</style>
-<style >
+<style scoped lang="scss"></style>
+<style>
 .avatar-uploader .el-upload {
   border: 1px dashed #d9d9d9;
   border-radius: 6px;
@@ -114,8 +122,8 @@ export default {
 .photo-container {
   display: flex;
   flex-direction: column;
-  justify-content: space-around;
-  align-items: center;
+  /* justify-content: space-around; */
+  /* align-items: center; */
   margin-bottom: 20px;
 }
 </style>