This commit is contained in:
670788339
2025-10-31 16:58:56 +08:00
parent f34d2a6e94
commit b3756280cf

View File

@@ -310,55 +310,30 @@
</span>
</span>
</a>
<!-- 热点标签 add by zhengsongbo on 2025-08-01 -->
<!-- <div style="margin-top:10px;flex: 1;">
<div class="search-item-type" style="padding-top: 2px; float: left;">
<span class="item-title" style="padding-right: 5px;">热点标签:</span>
</div>
<div class="hot-tags-container">
<div
class="option-item" style="padding-top: 2px; display: inline-block;"
@click="handleClearHotTags"
>
<a class="custom" :class="isAllHotTagsSelected ? '' : 'custom2'">全部</a>
</div>
<div
class="option-item"
style="padding-top: 2px; display: inline-block;"
v-for="tag in hotTagsList"
:key="tag.id"
@click="handleTagClick(tag, hotTagsList)"
>
<a class="custom" :class="tag.checked ? 'custom2' : ''">{{tag.tagName}}</a>
</div>
</div>
</div>-->
<!-- 修改热点标签区域 -->
<div style="margin-top:10px;flex: 1;">
<div class="search-item-type" style="padding-top: 2px; float: left;">
<span class="item-title" style="padding-right: 5px;">热点标签:</span>
</div>
<div class="hot-tags-container">
<!-- "全部"选项样式与上方选项一致 -->
<!-- 修改热点标签容器支持换行 -->
<div class="hot-tags-wrapper">
<div
class="option-item"
style="font-weight: bold; padding-top: 2px; display: inline-block;"
class="option-item" style="font-weight: bold; padding-top: 2px;"
:class="{ 'option-active': isAllHotTagsSelected }"
@click="handleClearHotTags"
>
<a>全部</a>
<span>全部</span>
<span :class="isAllHotTagsSelected ? 'nav-bottbor' : ''"></span>
</div>
<!-- 热点标签循环样式与上方选项一致 -->
<div
class="option-item" style="font-weight: bold; padding-top: 2px; display: inline-block;"
class="option-item" style="font-weight: bold; padding-top: 2px;"
v-for="tag in hotTagsList"
:key="tag.id"
@click="handleTagClick(tag, hotTagsList)"
:class="{ 'option-active': tag.checked }"
>
<a>{{tag.tagName}}</a>
<span>{{tag.tagName}}</span>
<span :class="tag.checked ? 'nav-bottbor' : ''"></span>
</div>
</div>
@@ -882,7 +857,7 @@ export default {
// 触发搜索
this.searchData();
}
},
// 改变分页
currentChange(val) {
@@ -2711,5 +2686,46 @@ a.custom2 {
background-color: #387DF7 !important;
color: white !important;
}
* 添加热点标签容器样式支持换行 */
.hot-tags-wrapper {
display: flex;
flex-wrap: wrap;
gap: 15px;
align-items: center;
padding-top: 2px;
margin-left: 90px; /* 为"热点标签:"文本留出空间 */
}
/* 调整option-item样式以适应换行布局 */
.option-item {
position: relative;
cursor: pointer;
white-space: nowrap;
}
/* 保持原有的导航底部横线样式 */
.nav-bottbor {
position: absolute;
top: 130%;
left: 0;
width: 100%;
height: 4px;
background: #387DF7;
border-radius: 5px;
}
/* 响应式调整,当屏幕较小时减小标签间距 */
@media (max-width: 1600px) {
.hot-tags-wrapper {
gap: 10px;
}
}
@media (max-width: 1400px) {
.hot-tags-wrapper {
gap: 5px;
}
}
/* ---end--- */
</style>