feat(listings): 排序交互升级为双向翻转并对齐双端体验

- PC端交互:HomeView 排序按钮支持点击切换升降序翻转(比例、哈夫币、AWM数量、合并价格为单个价格项),并带有高低方向箭头(▲/▼)高亮指示
- 移动端交互:MobileHomeView 菜单提供清晰的双向文案(如「比例从高到低 / 比例从低到高」),且点击当前选中项时支持自动翻转方向,顶部工具栏标题紧凑对齐
- 后端排序:public_filter 与 public_query 完整支持 ratioDesc/ratioAsc、priceAsc/priceDesc、coinDesc/coinAsc、awmDesc/awmAsc
- 验证方式:新增并运行 TestSortPublicListingsByRatio 包含升序/降序多断言,全量运行 ./scripts/check.sh 门禁全绿通过
This commit is contained in:
yml2213
2026-10-10 17:44:27 +08:00
parent 180a21c048
commit 5b2f36ac36
5 changed files with 183 additions and 24 deletions
@@ -123,14 +123,23 @@ const mobilePageSize = 10
let listingRequestSeq = 0
let searchDebounceTimer: ReturnType<typeof setTimeout> | null = null
const sortOptions = [
{ key: 'recommended', label: '综合推荐' },
{ key: 'ratioDesc', label: '比例排序' },
{ key: 'coinDesc', label: '哈夫币' },
{ key: 'awmDesc', label: 'AWM数量' },
{ key: 'priceAsc', label: '价格最低' },
{ key: 'priceDesc', label: '价格最高' },
{ key: 'published', label: '最新发布' },
interface MobileSortOption {
key: string
label: string
shortLabel: string
}
const sortOptions: MobileSortOption[] = [
{ key: 'recommended', label: '综合推荐', shortLabel: '综合推荐' },
{ key: 'ratioDesc', label: '比例从高到低', shortLabel: '比例最高' },
{ key: 'ratioAsc', label: '比例从低到高', shortLabel: '比例最低' },
{ key: 'priceAsc', label: '价格从低到高', shortLabel: '价格最低' },
{ key: 'priceDesc', label: '价格从高到低', shortLabel: '价格最高' },
{ key: 'coinDesc', label: '哈夫币从多到少', shortLabel: '哈夫币最多' },
{ key: 'coinAsc', label: '哈夫币从少到多', shortLabel: '哈夫币最少' },
{ key: 'awmDesc', label: 'AWM数量从多到少', shortLabel: 'AWM最多' },
{ key: 'awmAsc', label: 'AWM数量从少到多', shortLabel: 'AWM最少' },
{ key: 'published', label: '最新发布', shortLabel: '最新发布' },
]
const zoneOptions = [
@@ -146,7 +155,7 @@ const zoneOptions = [
const rangePresets = defaultRangePresets
const activeSortLabel = computed(
() => sortOptions.find(option => option.key === activeSort.value)?.label || '综合排序'
() => sortOptions.find(option => option.key === activeSort.value)?.shortLabel || '综合推荐'
)
async function handleSupportClick() {
@@ -552,6 +561,23 @@ function toggleSortPanel() {
}
function selectSort(sortKey: string) {
if (activeSort.value === sortKey) {
const flipMap: Record<string, string> = {
ratioDesc: 'ratioAsc',
ratioAsc: 'ratioDesc',
priceAsc: 'priceDesc',
priceDesc: 'priceAsc',
coinDesc: 'coinAsc',
coinAsc: 'coinDesc',
awmDesc: 'awmAsc',
awmAsc: 'awmDesc',
}
if (flipMap[sortKey]) {
activeSort.value = flipMap[sortKey]
sortOpen.value = false
return
}
}
activeSort.value = sortKey
sortOpen.value = false
}