[FIX]新增 tooltip

This commit is contained in:
huweihang
2025-12-12 01:48:05 +08:00
parent 89364b1aef
commit 5cd85a3e15

View File

@@ -68,8 +68,12 @@
{{ showAdvancedFilter ? '收起' : '展开' }}
<i :class="showAdvancedFilter ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i>
</el-button>
<el-tooltip content="搜索" placement="top" effect="dark" popper-class="icon-btn-tooltip">
<div class="icon-btn icon-btn--search" @click="searchData(true)" aria-label="搜索"></div>
</el-tooltip>
<el-tooltip content="重置" placement="top" effect="dark" popper-class="icon-btn-tooltip">
<div class="icon-btn icon-btn--reset" @click="reset" aria-label="重置"></div>
</el-tooltip>
</div>
</div>
<div v-if="showAdvancedFilter" class="filter-row filter-row--advanced advanced-filter">
@@ -105,8 +109,12 @@
{{ showAdvancedFilter ? '收起' : '展开' }}
<i :class="showAdvancedFilter ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i>
</el-button>
<el-tooltip content="搜索" placement="top" effect="dark" popper-class="icon-btn-tooltip">
<div class="icon-btn icon-btn--search" @click="searchData(true)" aria-label="搜索"></div>
</el-tooltip>
<el-tooltip content="重置" placement="top" effect="dark" popper-class="icon-btn-tooltip">
<div class="icon-btn icon-btn--reset" @click="reset" aria-label="重置"></div>
</el-tooltip>
</div>
</div>
@@ -114,9 +122,13 @@
<div class="table-wrapper">
<div class="filter-extra-actions">
<div class="create-course-btn" @click="addNewCourse()" aria-label="新建课程">新建课程</div>
<div v-if="showSetTopFeature" class="icon-btn icon-btn--top" @click="handleTopSort" aria-label="置顶排序"></div>
<el-tooltip v-if="showSetTopFeature" content="置顶排序" placement="top" effect="dark" popper-class="icon-btn-tooltip">
<div class="icon-btn icon-btn--top" @click="handleTopSort" aria-label="置顶排序"></div>
</el-tooltip>
<el-tooltip content="导出" placement="top" effect="dark" popper-class="icon-btn-tooltip">
<div class="icon-btn icon-btn--export" :class="{ 'is-loading': exportLoading, 'is-disabled': exportLoading }"
@click="!exportLoading && handleExport()" aria-label="导出"></div>
</el-tooltip>
</div>
<el-table :data="pageData" @sort-change="handleSortChange">
<el-table-column v-if="forChoose" label="选择" width="80" align="center">
@@ -2223,3 +2235,23 @@ export default {
}
</style>
<style lang="scss">
.icon-btn-tooltip {
height: 30px;
background: rgba(0, 0, 0, 1);
border-radius: 15px;
padding: 0 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
line-height: 30px;
.popper__arrow {
display: none !important;
}
.el-tooltip__popper__arrow {
display: none !important;
}
}
</style>