上传组件优化

src/components/com/uploadCom.vue

@@ -1,16 +1,14 @@
 <template>
-    <div>
+    <div class="upload_ss_c">
         <!--action="/api/abk/web/v1/resource/file" -->
-        <el-upload :action="actionUrl" :auto-upload="autoUpload" style="width: 100%" :on-success="(response, file) => successUpload(response, file)"
+        <el-upload :action="actionUrl" :auto-upload="autoUpload" style="width: 100%"
-            :on-error="errorUpload" :accept="acceptTypeList.join(',')" :before-upload="beforeUpload" :multiple="multiple"
+            :on-success="(response, file) => successUpload(response, file)" :on-error="errorUpload"
-            :limit="maxLimit" :on-exceed="handleExceed" :file-list="fileList" :disabled="disabledFlag"
+            :accept="acceptTypeList.join(',')" :before-upload="beforeUpload" :multiple="multiple" :limit="maxLimit"
+            :on-exceed="handleExceed" :file-list="fileList" :disabled="disabledFlag"
             :on-remove="(file, fileList) => removeFile(file, fileList)" :on-preview="(file) => preview(file)"
-            :on-progress="(event, file, fileList) => onProgressFn(event, file, fileList)"
+            :on-progress="(event, file, fileList) => onProgressFn(event, file, fileList)" list-type="picture-card">
-            list-type="picture-card"
-            
-            >
             <!-- 上传的按钮 或者 icon 通过具名插槽的方式 -->
-            <slot name="uploadBtn"></slot>
+            <slot name="default"></slot>
         </el-upload>
         <el-progress v-if="showProcessFlag && processFlag" :percentage="loadProcess"></el-progress>
     </div>
@@ -26,6 +24,16 @@ const props = defineProps({
         type: String,
         default: '',
     },
+    width: {
+        //上传的地址
+        type: String,
+        default: '72px',
+    },
+    height: {
+        //上传的地址
+        type: String,
+        default: '72px',
+    },
     autoUpload: {//是否开启自动上传
         type: Boolean,
         default: false
@@ -229,5 +237,15 @@ const preview = (data) => {
 
  
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+:deep(.el-upload){
+    width: v-bind('props.width')!important;
+    height: v-bind('props.height')!important;
+}
+:deep(.el-upload-list__item){
+    width: v-bind('props.width')!important;
+    height: v-bind('props.height')!important;
+}
 
+</style>
+<style></style>

src/views/configuration/swiperConfig/com/addCom.vue

@@ -5,11 +5,14 @@
         <el-input v-model.trim="form.title" placeholder="请输入标题" clearable maxlength="30" />
       </el-form-item>
       <el-form-item label="图片：" prop="picture">
-        <uploadCom :maxLimit="3" listType="picture-card" :acceptTypeList="['.jpg','.jpeg','.png']">
+ 
-          <template v-slot:uploadBtn>
+          <uploadCom :maxLimit="3" listType="picture-card" :acceptTypeList="['.jpg','.jpeg','.png']" width="72px" height="72px">
+            <template v-slot:default>
               <el-icon size="48" color="#aaa"><Plus /></el-icon>
             </template>
           </uploadCom>
+
+ 
       </el-form-item>
       <el-form-item label="跳转链接：" prop="linkUrl">
         <el-input v-model.trim="form.linkUrl" clearable />