style: 增加文件图标

This commit is contained in:
zhengkunwang223 2022-09-09 18:27:50 +08:00 committed by zhengkunwang223
parent d333fae2fe
commit 9f814077ad
3 changed files with 25 additions and 6 deletions

View File

@ -17,6 +17,7 @@ export namespace File {
mimeType: string;
dirSize: number;
items: File[];
extension: string;
}
export interface ReqFile {

View File

@ -82,3 +82,21 @@ export function computeSize(size: number): string {
if (size < Math.pow(num, 4)) return (size / Math.pow(num, 3)).toFixed(2) + ' GB';
return (size / Math.pow(num, 4)).toFixed(2) + ' TB';
}
let icons = new Map([
['.zip', 'p-file-zip'],
['.gz', 'p-file-zip'],
['.tar.bz2', 'p-file-zip'],
['.tar', 'p-file-zip'],
['.tar.gz', 'p-file-zip'],
['.tar.xz', 'p-file-zip'],
]);
export function getIcon(extention: string): string {
if (icons.get(extention) != undefined) {
const icon = icons.get(extention);
return String(icon);
} else {
return 'p-file-normal';
}
}

View File

@ -84,16 +84,12 @@
{{ $t('file.download') }}
</el-button>
</el-button-group>
<!-- <el-button type="primary" plain> {{ $t('file.sync') }}</el-button>
<el-button type="primary" plain> {{ $t('file.terminal') }}</el-button>
<el-button type="primary" plain> {{ $t('file.shareList') }}</el-button> -->
</template>
<el-table-column type="selection" width="55" />
<el-table-column :label="$t('commons.table.name')" min-width="250" fix show-overflow-tooltip>
<template #default="{ row }">
<svg-icon v-if="row.isDir" className="table-icon" iconName="p-file-folder"></svg-icon>
<svg-icon v-else className="table-icon" iconName="p-file-normal"></svg-icon>
<svg-icon v-else className="table-icon" :iconName="getIconName(row.extension)"></svg-icon>
<el-link :underline="false" @click="open(row)">{{ row.name }}</el-link>
<span v-if="row.isSymlink">-> {{ row.linkPath }}</span>
</template>
@ -190,7 +186,7 @@ import {
SaveFileContent,
ComputeDirSize,
} from '@/api/modules/files';
import { computeSize, dateFromat, getRandomStr } from '@/utils/util';
import { computeSize, dateFromat, getIcon, getRandomStr } from '@/utils/util';
import { File } from '@/api/interface/file';
import { useDeleteData } from '@/hooks/use-delete-data';
import { ElMessage } from 'element-plus';
@ -363,6 +359,10 @@ const getDirSize = async (row: any) => {
});
};
const getIconName = (extension: string) => {
return getIcon(extension);
};
const closeCreate = () => {
filePage.open = false;
search(req);