1
0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-03-14 01:34:47 +08:00

fix: 解决文件和网站名称过长只显示...的问题

This commit is contained in:
zhengkunwang223 2023-03-16 10:51:17 +08:00 committed by f2c-ci-robot[bot]
parent a64ddd1eb8
commit 11f4bc2c89
2 changed files with 22 additions and 9 deletions

View File

@ -88,7 +88,7 @@
<template #default="{ row }"> <template #default="{ row }">
<svg-icon v-if="row.isDir" className="table-icon" iconName="p-file-folder"></svg-icon> <svg-icon v-if="row.isDir" className="table-icon" iconName="p-file-folder"></svg-icon>
<svg-icon v-else className="table-icon" :iconName="getIconName(row.extension)"></svg-icon> <svg-icon v-else className="table-icon" :iconName="getIconName(row.extension)"></svg-icon>
<el-link :underline="false" @click="open(row)" type="primary">{{ row.name }}</el-link> <span class="file-name" @click="open(row)" type="primary">{{ row.name }}</span>
<span v-if="row.isSymlink">-> {{ row.linkPath }}</span> <span v-if="row.isSymlink">-> {{ row.linkPath }}</span>
</template> </template>
</el-table-column> </el-table-column>
@ -547,4 +547,14 @@ onMounted(() => {
display: inline; display: inline;
width: 20%; width: 20%;
} }
.file-name {
color: $primary-color;
font-weight: bold;
cursor: pointer;
}
.file-name:hover {
opacity: 0.6;
}
</style> </style>

View File

@ -75,9 +75,7 @@
> >
<template #default="{ row }"> <template #default="{ row }">
<el-button link :icon="Promotion" @click="openUrl(row)"></el-button> <el-button link :icon="Promotion" @click="openUrl(row)"></el-button>
<el-link type="primary" :underline="false" @click="openConfig(row.id)"> <span class="primary-domain" @click="openConfig(row.id)">{{ row.primaryDomain }}</span>
<span style="margin-left: 10px">{{ row.primaryDomain }}</span>
</el-link>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :label="$t('commons.table.type')" fix show-overflow-tooltip prop="type"> <el-table-column :label="$t('commons.table.type')" fix show-overflow-tooltip prop="type">
@ -407,15 +405,20 @@ onMounted(() => {
listGroup(); listGroup();
}); });
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
.search-button { .search-button {
float: right; float: right;
display: inline; display: inline;
} }
.tooltip { .primary-domain {
white-space: pre-wrap; /* 自动换行 */ margin-left: 10px;
word-break: break-all; /* 单词内换行 */ color: $primary-color;
max-width: 200px; /* 控制最大宽度 */ font-weight: bold;
cursor: pointer;
}
.primary-domain:hover {
opacity: 0.6;
} }
</style> </style>