admin/django-vue3-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

文件选择器删除功能控制

Browse Source
This commit is contained in:
阿辉
2024-12-04 16:01:44 +08:00
parent 36a8471dd0
commit 84b5426932
2 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/components/fileSelector/fileItem.vue
View File

@@ -1,8 +1,8 @@
<template> <template>
<div ref="itemRef" class="file-item" :title="data.name" @mouseenter="isShow = true" @mouseleave="isShow = false"> <div ref="itemRef" class="file-item" :title="data.name" @mouseenter="isShow = true" @mouseleave="isShow = false">
<div class="file-name" :class="{ show: isShow }">{{ data.name }}</div> <div v-if="showTitle" class="file-name" :class="{ show: isShow }">{{ data.name }}</div>
<component :is="FileTypes[data.file_type].tag" v-bind="FileTypes[data.file_type].attr" /> <component :is="FileTypes[data.file_type].tag" v-bind="FileTypes[data.file_type].attr" />
<div class="file-del" :class="{ show: isShow }"> <div v-if="props.showClose" class="file-del" :class="{ show: isShow }">
<el-icon :size="24" color="white" @click.stop="delFileHandle" style="cursor: pointer;"> <el-icon :size="24" color="white" @click.stop="delFileHandle" style="cursor: pointer;">
<CircleClose style="mix-blend-mode: difference;" /> <CircleClose style="mix-blend-mode: difference;" />
</el-icon> </el-icon>
@@ -17,6 +17,8 @@ import { getBaseURL } from '/@/utils/baseUrl';
const props = defineProps({ const props = defineProps({
fileData: { type: Object as PropType<any>, required: true }, fileData: { type: Object as PropType<any>, required: true },
api: { type: Object as PropType<any>, required: true }, api: { type: Object as PropType<any>, required: true },
showTitle: { type: Boolean, default: true },
showClose: { type: Boolean, default: true },
}); });
const _OtherFileComponent = defineComponent({ template: '<el-icon><Files /></el-icon>' }); const _OtherFileComponent = defineComponent({ template: '<el-icon><Files /></el-icon>' });
const FileTypes = [ const FileTypes = [

2
web/src/components/fileSelector/index.vue
View File

@@ -117,7 +117,7 @@
<div ref="listContainerRef" class="listContainer" v-else> <div ref="listContainerRef" class="listContainer" v-else>
<div v-for="item, index in listData" :key="index" @click="onItemClick($event)" :data-id="item[props.valueKey]" <div v-for="item, index in listData" :key="index" @click="onItemClick($event)" :data-id="item[props.valueKey]"
:style="{ width: (props.itemSize || 100) + 'px', cursor: props.selectable ? 'pointer' : 'normal' }"> :style="{ width: (props.itemSize || 100) + 'px', cursor: props.selectable ? 'pointer' : 'normal' }">
<FileItem :fileData="item" :api="fileApi" @onDelFile="listRequest(); listRequestAll();" /> <FileItem :fileData="item" :api="fileApi" :showClose="tabsActived < 4" @onDelFile="listRequest(); listRequestAll();" />
</div> </div>
</div> </div>
<div class="listPaginator"> <div class="listPaginator">