1Panel-dev/1Panel
1
1
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-10-12 08:26:50 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: 解决文件名和图标堆叠显示问题 (#2790)

Browse source
This commit is contained in:
zhengkunwang 2023-11-03 14:32:14 +08:00 • committed by GitHub
parent 7e00b46d5c
commit 6a989482a9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 50 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

93
frontend/src/views/host/file-management/index.vue
View file

@ -182,49 +182,41 @@
prop="name" prop="name"
> >
<template #default="{ row, $index }"> <template #default="{ row, $index }">
<div @mouseenter="showFavorite($index)" @mouseleave="hideFavorite"> <div class="file-row" @mouseenter="showFavorite($index)" @mouseleave="hideFavorite">
<el-row> <div>
<el-col :span="1"> <svg-icon
<svg-icon v-if="row.isDir"
v-if="row.isDir" className="table-icon"
className="table-icon" iconName="p-file-folder"
iconName="p-file-folder" ></svg-icon>
></svg-icon> <svg-icon
<svg-icon v-else
v-else className="table-icon"
className="table-icon" :iconName="getIconName(row.extension)"
:iconName="getIconName(row.extension)" ></svg-icon>
></svg-icon> </div>
</el-col> <div class="file-name">
<el-col :span="22"> <span class="table-link" @click="open(row)" type="primary">{{ row.name }}</span>
<div class="text-parent"> <span v-if="row.isSymlink">-> {{ row.linkPath }}</span>
<span class="table-link text-ellipsis" @click="open(row)" type="primary"> </div>
{{ row.name }} <div>
</span> <el-button
<span v-if="row.isSymlink">-> {{ row.linkPath }}</span> v-if="row.favoriteID > 0"
</div> link
</el-col> type="warning"
<el-col :span="1"> size="large"
<div> :icon="StarFilled"
<el-button @click="removeFavorite(row.favoriteID)"
v-if="row.favoriteID > 0" ></el-button>
link <div v-else>
type="warning" <el-button
size="large" v-if="hoveredRowIndex === $index"
:icon="StarFilled" link
@click="removeFavorite(row.favoriteID)" :icon="Star"
></el-button> @click="addFavorite(row)"
<div v-else> ></el-button>
<el-button </div>
v-if="hoveredRowIndex === $index" </div>
link
:icon="Star"
@click="addFavorite(row)"
></el-button>
</div>
</div>
</el-col>
</el-row>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -925,6 +917,21 @@ onMounted(() => {
max-height: 650px; max-height: 650px;
overflow: auto; overflow: auto;
} }
.file-row {
display: flex;
align-items: center;
width: 100%;
}
.file-name {
flex-grow: 1;
margin-left: 1px;
width: 95%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.address-bar { .address-bar {
border: var(--el-border); border: var(--el-border);
.arrow { .arrow {