fix: 修复头像上传区域宽度bug

BoBoooooo · Feb 20, 2021 · 3642218 · 3642218
1 parent 86045b9
commit 3642218
Showing 1 changed file with 13 additions and 1 deletion.
diff --git a/src/component/form-designer/src/components/AvatarUpload/AvatarUpload.vue b/src/component/form-designer/src/components/AvatarUpload/AvatarUpload.vue
@@ -22,7 +22,9 @@
     :on-success="handleAvatarSuccess"
   >
     <img v-if="hasImage" :src="imageUrl" class="avatar" />
-    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+    <div v-else class="uploader-container">
+      <i class="el-icon-plus avatar-uploader-icon"></i>
+    </div>
   </el-upload>
 </template>
 
@@ -99,15 +101,25 @@ export default {
   margin: 0 auto;
   overflow: hidden;
 }
+.avatar-uploader >>> .el-upload{
+  height:100%;
+  display: block;
+}
 .avatar-uploader .el-upload:hover {
   border-color: #409eff;
 }
+
+.upload-container{
+  height:100%;
+  width: 100%;
+}
 .avatar-uploader-icon {
   font-size: 28px;
   color: #8c939d;
   position: absolute;
   text-align: center;
   left: 50%;
+  cursor: pointer;
   top: 50%;
   transform: translate(-50%, -50%);
 }