mirror of https://github.com/1Panel-dev/1Panel
ssongliu
6 months ago
committed by
GitHub
17 changed files with 953 additions and 122 deletions
@ -0,0 +1,119 @@
|
||||
<template> |
||||
<el-drawer |
||||
v-model="drawerVisible" |
||||
:destroy-on-close="true" |
||||
:close-on-click-modal="false" |
||||
:close-on-press-escape="false" |
||||
size="50%" |
||||
> |
||||
<template #header> |
||||
<DrawerHeader header="FTP" :resource="paginationConfig.user" :back="handleClose" /> |
||||
</template> |
||||
<el-select @change="search" class="p-w-200" clearable v-model="paginationConfig.operation"> |
||||
<template #prefix>{{ $t('container.lines') }}</template> |
||||
<el-option value="PUT" :label="$t('file.upload')" /> |
||||
<el-option value="GET" :label="$t('file.download')" /> |
||||
</el-select> |
||||
|
||||
<ComplexTable :pagination-config="paginationConfig" :data="data" @search="search"> |
||||
<el-table-column label="ip" prop="ip" /> |
||||
<el-table-column :label="$t('commons.login.username')" prop="user" /> |
||||
<el-table-column :label="$t('commons.table.status')" show-overflow-tooltip prop="status"> |
||||
<template #default="{ row }"> |
||||
<el-tag v-if="row.status === '200'">{{ $t('commons.status.success') }}</el-tag> |
||||
<el-tag v-else type="danger">{{ $t('commons.status.failed') }}</el-tag> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column :label="$t('commons.table.operate')" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ loadFileName(row.operation) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column :label="$t('file.file')" show-overflow-tooltip> |
||||
<template #default="{ row }"> |
||||
{{ loadOperation(row.operation) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column :label="$t('file.size')" show-overflow-tooltip prop="size"> |
||||
<template #default="{ row }"> |
||||
{{ computeSizeFromByte(Number(row.size)) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column :label="$t('commons.table.date')" prop="time" show-overflow-tooltip /> |
||||
</ComplexTable> |
||||
<template #footer> |
||||
<span class="dialog-footer"> |
||||
<el-button @click="drawerVisible = false">{{ $t('commons.button.cancel') }}</el-button> |
||||
</span> |
||||
</template> |
||||
</el-drawer> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { reactive, ref } from 'vue'; |
||||
import DrawerHeader from '@/components/drawer-header/index.vue'; |
||||
import { searchFtpLog } from '@/api/modules/toolbox'; |
||||
import { computeSizeFromByte } from '@/utils/util'; |
||||
import i18n from '@/lang'; |
||||
|
||||
const paginationConfig = reactive({ |
||||
cacheSizeKey: 'ftp-log-page-size', |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
total: 0, |
||||
user: '', |
||||
operation: '', |
||||
}); |
||||
const data = ref(); |
||||
|
||||
interface DialogProps { |
||||
user: string; |
||||
} |
||||
const loading = ref(); |
||||
const drawerVisible = ref(false); |
||||
|
||||
const acceptParams = (params: DialogProps): void => { |
||||
paginationConfig.user = params.user; |
||||
search(); |
||||
drawerVisible.value = true; |
||||
}; |
||||
|
||||
const handleClose = () => { |
||||
drawerVisible.value = false; |
||||
}; |
||||
|
||||
const search = async () => { |
||||
let params = { |
||||
user: paginationConfig.user, |
||||
operation: paginationConfig.operation, |
||||
page: paginationConfig.currentPage, |
||||
pageSize: paginationConfig.pageSize, |
||||
}; |
||||
loading.value = true; |
||||
await searchFtpLog(params) |
||||
.then((res) => { |
||||
loading.value = false; |
||||
data.value = res.data.items || []; |
||||
paginationConfig.total = res.data.total; |
||||
}) |
||||
.catch(() => { |
||||
loading.value = false; |
||||
}); |
||||
}; |
||||
|
||||
const loadFileName = (operation: string) => { |
||||
if (operation.startsWith('"PUT')) { |
||||
return i18n.global.t('file.upload'); |
||||
} |
||||
if (operation.startsWith('"GET')) { |
||||
return i18n.global.t('file.download'); |
||||
} |
||||
}; |
||||
const loadOperation = (operation: string) => { |
||||
return operation.replaceAll('"', '').replaceAll('PUT', '').replaceAll('GET', ''); |
||||
}; |
||||
|
||||
defineExpose({ |
||||
acceptParams, |
||||
}); |
||||
</script> |
Loading…
Reference in new issue