| | |
| | | <div class="component-upload-image">
|
| | | <el-upload
|
| | | multiple
|
| | | :disabled="disabled"
|
| | | :action="uploadImgUrl"
|
| | | list-type="picture-card"
|
| | | :on-success="handleUploadSuccess"
|
| | |
| | | </el-upload>
|
| | |
|
| | | <!-- 上传提示 -->
|
| | | <div class="el-upload__tip" slot="tip" v-if="showTip">
|
| | | <div class="el-upload__tip" slot="tip" v-if="showTip && !disabled">
|
| | | 请上传
|
| | | <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
|
| | | <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
|
| | |
| | | type: Boolean,
|
| | | default: true
|
| | | },
|
| | | // 禁用组件(仅查看图片)
|
| | | disabled: {
|
| | | type: Boolean,
|
| | | default: false
|
| | | },
|
| | | // 拖动排序
|
| | | drag: {
|
| | | type: Boolean,
|
| | |
| | | }
|
| | | },
|
| | | mounted() {
|
| | | if (this.drag) {
|
| | | if (this.drag && !this.disabled) {
|
| | | this.$nextTick(() => {
|
| | | const element = this.$refs.imageUpload?.$el?.querySelector('.el-upload-list')
|
| | | Sortable.create(element, {
|
| | |
| | | ::v-deep.hide .el-upload--picture-card {
|
| | | display: none;
|
| | | }
|
| | |
|
| | | ::v-deep .el-upload-list--picture-card.is-disabled + .el-upload--picture-card {
|
| | | display: none !important;
|
| | | } |
| | |
|
| | | // 去掉动画效果
|
| | | ::v-deep .el-list-enter-active,
|
| | | ::v-deep .el-list-leave-active {
|