Move 3 Strikes from Admin to Dashboard, add strikes feature
- Adds strikes (0-3) to Child model with migration
- New PATCH /api/children/{id}/strikes endpoint with WebSocket broadcast
- TV dashboard shows red ✕ marks next to child name when strikes > 0
- 3 Strikes card on Dashboard page (removed from Admin)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -2,7 +2,16 @@
|
||||
<div class="tv-root">
|
||||
<!-- Header bar -->
|
||||
<header class="tv-header">
|
||||
<div class="tv-child-name">{{ scheduleStore.child?.name || 'Loading...' }}</div>
|
||||
<div class="tv-child-name-wrap">
|
||||
<div class="tv-child-name">{{ scheduleStore.child?.name || 'Loading...' }}</div>
|
||||
<div class="tv-strikes" v-if="scheduleStore.child?.strikes > 0">
|
||||
<span
|
||||
v-for="i in scheduleStore.child.strikes"
|
||||
:key="i"
|
||||
class="tv-strike-x"
|
||||
>✕</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tv-clock">{{ clockDisplay }}</div>
|
||||
<div class="tv-date">{{ dateDisplay }}</div>
|
||||
</header>
|
||||
@@ -197,12 +206,30 @@ onMounted(async () => {
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
.tv-child-name-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.tv-child-name {
|
||||
font-size: 2.5rem;
|
||||
font-weight: 700;
|
||||
color: #818cf8;
|
||||
}
|
||||
|
||||
.tv-strikes {
|
||||
display: flex;
|
||||
gap: 0.4rem;
|
||||
}
|
||||
|
||||
.tv-strike-x {
|
||||
font-size: 2rem;
|
||||
font-weight: 700;
|
||||
color: #ef4444;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.tv-clock {
|
||||
font-size: 3rem;
|
||||
font-weight: 300;
|
||||
|
||||
Reference in New Issue
Block a user