图片省略模式多图片数据情况下触发按钮变更

src/business/platform/file/image/index.vue

@@ -74,36 +74,64 @@
                 </template>
             </vue-draggable>
         </ul>
-        <template v-if="!disabled && (isBuilder || fileList.length < limit || !limit)">
-            <!--ibps 附件上传方式-->
-            <el-upload
-                v-if="uploadType === 'attachment'"
-                :style="uploadStyle"
-                :action="action"
-                :disabled="true"
-                :file-list="fileList"
-                list-type="picture-card"
-                @click.native="clickAttachmentUpload"
-            >
-                <i class="el-icon-plus" />
-            </el-upload>
-            <!--默认附件上传方式-->
-            <el-upload
-                v-else
-                :style="uploadStyle"
-                action="action"
-                list-type="picture-card"
-                :http-request="httpRequest"
-                :file-list="fileList"
-                :multiple="multiple"
-                :accept="fileAccept"
-                :limit="flieLimit"
-                :disabled="disabled"
-                :on-exceed="handlePicAmount"
-                :before-upload="beforeUpload"
-            >
-                <i class="el-icon-plus" />
-            </el-upload>
+        <template v-if="showUpload">
+            <template v-if="ellipsisUploadButton">
+                <el-button
+                    v-if="uploadType === 'attachment'"
+                    type="primary"
+                    icon="el-icon-plus"
+                    size="small"
+                    class="ibps-image-upload-btn"
+                    @click="clickAttachmentUpload"
+                >上传图片</el-button>
+                <el-upload
+                    v-else
+                    action="action"
+                    :http-request="httpRequest"
+                    :file-list="fileList"
+                    :multiple="multiple"
+                    :accept="fileAccept"
+                    :limit="flieLimit"
+                    :disabled="disabled"
+                    :on-exceed="handlePicAmount"
+                    :before-upload="beforeUpload"
+                    :show-file-list="false"
+                    class="ibps-image-upload-btn"
+                >
+                    <el-button type="primary" icon="el-icon-plus" size="small">上传图片</el-button>
+                </el-upload>
+            </template>
+            <template v-else>
+                <!--ibps 附件上传方式-->
+                <el-upload
+                    v-if="uploadType === 'attachment'"
+                    :style="uploadStyle"
+                    :action="action"
+                    :disabled="true"
+                    :file-list="fileList"
+                    list-type="picture-card"
+                    @click.native="clickAttachmentUpload"
+                >
+                    <i class="el-icon-plus" />
+                </el-upload>
+                <!--默认附件上传方式-->
+                <el-upload
+                    v-else
+                    :style="uploadStyle"
+                    action="action"
+                    list-type="picture-card"
+                    :http-request="httpRequest"
+                    :file-list="fileList"
+                    :multiple="multiple"
+                    :accept="fileAccept"
+                    :limit="flieLimit"
+                    :disabled="disabled"
+                    :on-exceed="handlePicAmount"
+                    :before-upload="beforeUpload"
+                >
+                    <i class="el-icon-plus" />
+                </el-upload>
+            </template>
         </template>
         <!--图片预览-->
         <ibps-image-viewer
@@ -269,6 +297,12 @@ export default {
                 return []
             }
             return this.fileList.slice(1)
+        },
+        showUpload () {
+            return !this.disabled && (this.isBuilder || this.fileList.length < this.limit || !this.limit)
+        },
+        ellipsisUploadButton () {
+            return this.isEllipsis && this.$utils.isNotEmpty(this.fileList)
         }
     },
     watch: {
@@ -591,6 +625,11 @@ export default {
 <style lang="scss">
     .ibps-image {
         font-size: 28px;
+        .ibps-image-upload-btn {
+            display: inline-block;
+            margin-top: 4px;
+            font-size: 12px;
+        }
         .el-upload-list--picture-card {
             display: none;
         }