gh_mirrors/1Panel
1
0
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-03-13 17:24:44 +08:00
Code

fix: 解决文件上传多选可能导致的文件列表丢失的问题 (#2925)

Browse Source
This commit is contained in:
zhengkunwang 2023-11-13 15:00:08 +08:00 committed by GitHub
parent e09cefd0f7
commit 78576a3724
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 45 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/index.ts
View File

@ -4,6 +4,7 @@ import RouterButton from './router-button/index.vue';
import ComplexTable from './complex-table/index.vue';
import ErrPrompt from './error-prompt/index.vue';
import OpDialog from './del-dialog/index.vue';
import Tooltip from '@/components/tooltip/index.vue';
export default {
install(app: App) {
app.component(LayoutContent.name, LayoutContent);
@ -11,5 +12,6 @@ export default {
app.component(ComplexTable.name, ComplexTable);
app.component(ErrPrompt.name, ErrPrompt);
app.component(OpDialog.name, OpDialog);
app.component(Tooltip.name, Tooltip);
},
};

2
frontend/src/components/tooltip/index.vue
View File

@ -15,6 +15,8 @@
<script setup lang="ts">
import { onMounted, ref } from 'vue';
defineOptions({ name: 'Tooltip' });
const showTooltip = ref();
const tooltipBox = ref();
const tooltipItem = ref();

57
frontend/src/views/host/file-management/delete/index.vue
View File

@ -1,25 +1,36 @@
<template>
<el-dialog v-model="open" :title="$t('app.delete')" width="30%" :close-on-click-modal="false">
<el-row>
<el-col :span="20" :offset="2">
<el-alert class="mt-2" :show-icon="true" type="warning" :closable="false">
<div style="line-height: 20px; word-wrap: break-word">
<span>{{ $t('file.deleteHelper') }}</span>
<div>
<el-row>
<el-col :span="20" :offset="2">
<el-alert class="mt-2" :show-icon="true" type="warning" :closable="false">
<div class="delete-warn">
<span>{{ $t('file.deleteHelper') }}</span>
</div>
</el-alert>
<div class="mt-4">
<el-checkbox v-model="forceDelete">{{ $t('file.forceDeleteHelper') }}</el-checkbox>
</div>
</el-alert>
<div class="mt-4">
<el-checkbox v-model="forceDelete">{{ $t('file.forceDeleteHelper') }}</el-checkbox>
</div>
<div class="flx-align-center mb-1" v-for="(row, index) in files" :key="index">
<div>
<svg-icon v-if="row.isDir" className="table-icon mr-1 " iconName="p-file-folder"></svg-icon>
<svg-icon v-else className="table-icon mr-1" :iconName="getIconName(row.extension)"></svg-icon>
<div class="file-list">
<div class="flx-align-center mb-1" v-for="(row, index) in files" :key="index">
<div>
<svg-icon
v-if="row.isDir"
className="table-icon mr-1 "
iconName="p-file-folder"
></svg-icon>
<svg-icon
v-else
className="table-icon mr-1"
:iconName="getIconName(row.extension)"
></svg-icon>
</div>
<span class="sle">{{ row.name }}</span>
</div>
</div>
<span class="sle">{{ row.name }}</span>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
<template #footer>
<span class="dialog-footer">
@ -85,4 +96,14 @@ defineExpose({
max-height: 400px;
overflow: auto;
}
.file-list {
height: 400px;
overflow-y: auto;
}
.delete-warn {
line-height: 20px;
word-wrap: break-word;
}
</style>

5
frontend/src/views/host/file-management/upload/index.vue
View File

@ -127,11 +127,10 @@ const removeFile = (index: number) => {
};
const fileOnChange = (_uploadFile: UploadFile, uploadFiles: UploadFiles) => {
uploaderFiles.value = uploadFiles;
const reader = new FileReader();
reader.readAsDataURL(_uploadFile.raw);
reader.onload = async () => {
uploaderFiles.value = uploadFiles;
};
reader.onload = async () => {};
reader.onerror = () => {
uploaderFiles.value = uploaderFiles.value.filter((file) => file.uid !== _uploadFile.uid);
MsgError(i18n.global.t('file.typeErrOrEmpty', [_uploadFile.name]));