fix: hide past countdown heading
This commit is contained in:
@@ -71,6 +71,16 @@ describe('countdown modal accessibility', () => {
|
|||||||
expect(source).not.toContain("`${formatDate(item.display_date)} · ${item.lunar_text}${suffix}`")
|
expect(source).not.toContain("`${formatDate(item.display_date)} · ${item.lunar_text}${suffix}`")
|
||||||
})
|
})
|
||||||
|
|
||||||
|
it('hides only the past group heading while keeping every group and its rows', () => {
|
||||||
|
expect(source).toContain("{ key:'recent', title:'最近', items:recent }")
|
||||||
|
expect(source).toContain("{ key:'later', title:'稍后', items:later }")
|
||||||
|
expect(source).toContain("{ key:'past', title:'', items:past }")
|
||||||
|
expect(source).toContain('<section v-for="group in countdownGroups"')
|
||||||
|
expect(source).toContain('<h3 v-if="group.title">{{group.title}}</h3>')
|
||||||
|
expect(source).toContain('<button v-for="item in group.items"')
|
||||||
|
expect(source).not.toContain('<h3>{{group.title}}</h3>')
|
||||||
|
})
|
||||||
|
|
||||||
it('keeps the empty state directly actionable', () => {
|
it('keeps the empty state directly actionable', () => {
|
||||||
expect(source).toContain('添加第一个重要日子')
|
expect(source).toContain('添加第一个重要日子')
|
||||||
expect(source).toContain('@click="openFromEmpty"')
|
expect(source).toContain('@click="openFromEmpty"')
|
||||||
|
|||||||
@@ -84,7 +84,7 @@ const countdownGroups = computed<CountdownGroup[]>(() => {
|
|||||||
return [
|
return [
|
||||||
{ key:'recent', title:'最近', items:recent },
|
{ key:'recent', title:'最近', items:recent },
|
||||||
{ key:'later', title:'稍后', items:later },
|
{ key:'later', title:'稍后', items:later },
|
||||||
{ key:'past', title:'已经过去', items:past },
|
{ key:'past', title:'', items:past },
|
||||||
].filter((group) => group.items.length)
|
].filter((group) => group.items.length)
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -189,7 +189,7 @@ onBeforeUnmount(() => { previousFocus = null })
|
|||||||
</button>
|
</button>
|
||||||
<div v-if="countdownGroups.length" class="countdown-timeline">
|
<div v-if="countdownGroups.length" class="countdown-timeline">
|
||||||
<section v-for="group in countdownGroups" :key="group.key" class="countdown-group">
|
<section v-for="group in countdownGroups" :key="group.key" class="countdown-group">
|
||||||
<h3>{{group.title}}</h3>
|
<h3 v-if="group.title">{{group.title}}</h3>
|
||||||
<button v-for="item in group.items" :key="item.id" type="button" class="countdown-row" :class="[`kind-${item.kind}`, { pinned:item.pinned, today:item.days===0, past:item.days<0 }]" @click="openDetail(item)">
|
<button v-for="item in group.items" :key="item.id" type="button" class="countdown-row" :class="[`kind-${item.kind}`, { pinned:item.pinned, today:item.days===0, past:item.days<0 }]" @click="openDetail(item)">
|
||||||
<span class="countdown-main"><b>{{item.title}}</b><small>{{primaryDate(item)}}<template v-if="secondaryDate(item)"> · {{secondaryDate(item)}}</template></small><span class="countdown-badges"><em v-for="badge in visibleBadges(item)" :key="badge">{{badge}}</em></span></span>
|
<span class="countdown-main"><b>{{item.title}}</b><small>{{primaryDate(item)}}<template v-if="secondaryDate(item)"> · {{secondaryDate(item)}}</template></small><span class="countdown-badges"><em v-for="badge in visibleBadges(item)" :key="badge">{{badge}}</em></span></span>
|
||||||
<span class="countdown-state"><strong>{{item.days===0?'今天':Math.abs(item.days)}}</strong><small>{{countdownDayText(item.days)}}</small></span>
|
<span class="countdown-state"><strong>{{item.days===0?'今天':Math.abs(item.days)}}</strong><small>{{countdownDayText(item.days)}}</small></span>
|
||||||
|
|||||||
Reference in New Issue
Block a user