style(search): 简化下拉项,只显示词文本(去掉'词'标签和 weight 数字)
产品反馈:下拉项'词英国 694'样式花,只要'英国'两个干净的字就行。 renderSuggestion 简化成单个 span,删掉 .feed-suggest-tag 和 .feed-suggest-weight CSS。
This commit is contained in:
@@ -95,17 +95,9 @@ const suggestOptions = computed<SuggestOption[]>(() => {
|
||||
}))
|
||||
})
|
||||
|
||||
// 自定义 render:显示"词"标签 + 词文本 + 权重
|
||||
// 自定义 render:只显示词文本(干净,不挂标签/数字)
|
||||
function renderSuggestion(opt: SuggestOption) {
|
||||
return h(
|
||||
'div',
|
||||
{ class: 'feed-suggest-row' },
|
||||
[
|
||||
h('span', { class: 'feed-suggest-tag feed-suggest-tag-keyword' }, '词'),
|
||||
h('span', { class: 'feed-suggest-text' }, opt.label),
|
||||
h('span', { class: 'feed-suggest-weight' }, String(opt.meta.weight)),
|
||||
],
|
||||
)
|
||||
return h('span', { class: 'feed-suggest-text' }, opt.label)
|
||||
}
|
||||
|
||||
// 选完候选词:naive-ui 把 value 写回 v-model,我们从 suggestOptions 找 meta
|
||||
@@ -705,39 +697,12 @@ onMounted(async () => {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* === 搜索建议下拉项 === */
|
||||
.feed-suggest-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
min-width: 0;
|
||||
}
|
||||
.feed-suggest-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 1px 6px;
|
||||
border-radius: 8px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
line-height: 1.4;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.feed-suggest-tag-keyword {
|
||||
background: #f3e8ff;
|
||||
color: #6b21a8;
|
||||
}
|
||||
/* === 搜索建议下拉项(干净版,只显示词本身) === */
|
||||
.feed-suggest-text {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
.feed-suggest-weight {
|
||||
flex-shrink: 0;
|
||||
font-size: 11px;
|
||||
color: #94a3b8;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
/* ===== 移动端(<= 768px):过滤条全宽,允许换行 ===== */
|
||||
|
||||
Reference in New Issue
Block a user