|
@@ -1,73 +1,33 @@
|
|
|
<template>
|
|
<template>
|
|
|
- <div>
|
|
|
|
|
- <!-- 添加拖拽排序区域 -->
|
|
|
|
|
- <draggable
|
|
|
|
|
- v-model="fileListData"
|
|
|
|
|
- item-key="uid"
|
|
|
|
|
- class="drag-area"
|
|
|
|
|
- @end="onDragEnd"
|
|
|
|
|
- >
|
|
|
|
|
- <template #item="{ element }">
|
|
|
|
|
- <div class="file-item">
|
|
|
|
|
- <div class="file-info">
|
|
|
|
|
- <HcIcon :name="getFileIcon(element.name)" ui="text-xl mr-2" />
|
|
|
|
|
- <span>{{ element.name }}</span>
|
|
|
|
|
- </div>
|
|
|
|
|
- <el-button
|
|
|
|
|
- type="danger"
|
|
|
|
|
- size="small"
|
|
|
|
|
- circle
|
|
|
|
|
- @click="handleRemove(element)"
|
|
|
|
|
- >
|
|
|
|
|
- <HcIcon name="delete" />
|
|
|
|
|
- </el-button>
|
|
|
|
|
- </div>
|
|
|
|
|
- </template>
|
|
|
|
|
- </draggable>
|
|
|
|
|
|
|
+ <el-upload
|
|
|
|
|
+ ref="uploadRef"
|
|
|
|
|
+ :accept="accept" :action="action" :before-remove="delUploadData" :before-upload="beforeUpload"
|
|
|
|
|
+ :data="uploadData"
|
|
|
|
|
+ :disabled="isCanuploadVal" :file-list="fileListData" :headers="getHeader()" :on-error="uploadError"
|
|
|
|
|
+ :on-exceed="uploadExceed" :on-preview="uploadPreview" :on-progress="uploadprogress"
|
|
|
|
|
+ :on-remove="uploadRemove" :on-success="uploadSuccess" class="hc-upload-border"
|
|
|
|
|
+ :class="autoUpload === false ? 'hc-upload-border1' : 'hc-upload-border'"
|
|
|
|
|
+ drag multiple
|
|
|
|
|
+ :auto-upload="autoUpload"
|
|
|
|
|
+ :on-change="handleFileChange"
|
|
|
|
|
+ >
|
|
|
|
|
+ <template #trigger>
|
|
|
|
|
+ <div v-loading="uploadDisabled" :element-loading-text="loadingText" class="hc-upload-loading h-full" @click.stop="beforesubmitUpload">
|
|
|
|
|
+ <HcIcon name="backup" ui="text-5xl mt-4" />
|
|
|
|
|
+ <div class="el-upload__text">拖动文件到这里 或 <em>点击这里选择文件</em></div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
|
|
|
- <!-- 原有的上传组件 -->
|
|
|
|
|
- <el-upload
|
|
|
|
|
- ref="uploadRef"
|
|
|
|
|
- :accept="accept"
|
|
|
|
|
- :action="action"
|
|
|
|
|
- :before-remove="delUploadData"
|
|
|
|
|
- :before-upload="beforeUpload"
|
|
|
|
|
- :data="uploadData"
|
|
|
|
|
- :disabled="isCanuploadVal"
|
|
|
|
|
- :file-list="fileListData"
|
|
|
|
|
- :headers="getHeader()"
|
|
|
|
|
- :on-error="uploadError"
|
|
|
|
|
- :on-exceed="uploadExceed"
|
|
|
|
|
- :on-preview="uploadPreview"
|
|
|
|
|
- :on-progress="uploadprogress"
|
|
|
|
|
- :on-remove="uploadRemove"
|
|
|
|
|
- :on-success="uploadSuccess"
|
|
|
|
|
- class="hc-upload-border"
|
|
|
|
|
- :class="autoUpload === false ? 'hc-upload-border1' : 'hc-upload-border'"
|
|
|
|
|
- drag
|
|
|
|
|
- multiple
|
|
|
|
|
- :auto-upload="autoUpload"
|
|
|
|
|
- :on-change="handleFileChange"
|
|
|
|
|
- >
|
|
|
|
|
- <!-- 原有的上传触发器 -->
|
|
|
|
|
- <template #trigger>
|
|
|
|
|
- <div v-loading="uploadDisabled" :element-loading-text="loadingText" class="hc-upload-loading h-full" @click.stop="beforesubmitUpload">
|
|
|
|
|
- <HcIcon name="backup" ui="text-5xl mt-4" />
|
|
|
|
|
- <div class="el-upload__text">拖动文件到这里 或 <em>点击这里选择文件</em></div>
|
|
|
|
|
- </div>
|
|
|
|
|
- </template>
|
|
|
|
|
- <template #tip>
|
|
|
|
|
- <div class="el-upload__tip" style="font-size: 14px;">
|
|
|
|
|
- {{ acceptTip }}
|
|
|
|
|
- </div>
|
|
|
|
|
- </template>
|
|
|
|
|
- </el-upload>
|
|
|
|
|
-
|
|
|
|
|
- <div class="mt-3" style="float: right;">
|
|
|
|
|
- <el-button v-if="!autoUpload" type="primary" @click="submitUpload">
|
|
|
|
|
- 确认上传
|
|
|
|
|
- </el-button>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <template #tip>
|
|
|
|
|
+ <div class="el-upload__tip" style="font-size: 14px;">
|
|
|
|
|
+ {{ acceptTip }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-upload>
|
|
|
|
|
+ <div class="mt-3" style="float: right;">
|
|
|
|
|
+ <el-button v-if="!autoUpload" type="primary" @click="submitUpload">
|
|
|
|
|
+ 确认上传
|
|
|
|
|
+ </el-button>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
