tighten views
This commit is contained in:
@@ -65,6 +65,17 @@
|
||||
famStore.initialized ? famStore.bonusConfigs : data.bonusConfigs || []
|
||||
);
|
||||
|
||||
// Admin overview stat tiles (summed across this week's member summaries).
|
||||
let adminTiles = $derived.by(() => {
|
||||
const sums = summary?.summaries || [];
|
||||
return {
|
||||
members: parentMembers.length,
|
||||
pts: sums.reduce((t: number, s: any) => t + (Number(s.pointsEarned) || 0), 0),
|
||||
money: sums.reduce((t: number, s: any) => t + (Number(s.moneyEarned) || 0), 0),
|
||||
chores: sums.reduce((t: number, s: any) => t + (Number(s.choresCompleted) || 0), 0)
|
||||
};
|
||||
});
|
||||
|
||||
function totalChoresFor(memberId: string): number {
|
||||
return parentAssigned.filter((a: any) => a.memberId === memberId).length;
|
||||
}
|
||||
@@ -612,14 +623,37 @@
|
||||
<!-- Parent View: Admin Overview -->
|
||||
<ViewHeader
|
||||
title={famStore.fam?.name || 'Dashboard'}
|
||||
subtitle={summary?.weekStart ? `Week of ${summary.weekStart}` : ''}
|
||||
subtitle={summary?.weekStart ? `Week of ${formatDDMMYY(summary.weekStart)}` : ''}
|
||||
hero
|
||||
/>
|
||||
|
||||
{#if toast}
|
||||
<div class="toast">{toast}</div>
|
||||
{/if}
|
||||
|
||||
<CardGrid>
|
||||
<!-- WEEK-TO-DATE TILES -->
|
||||
<div class="tiles">
|
||||
<div class="tile tile-members">
|
||||
<span class="tile-val">{adminTiles.members}</span>
|
||||
<span class="tile-lbl">members</span>
|
||||
</div>
|
||||
<div class="tile tile-pts">
|
||||
<span class="tile-val">{adminTiles.pts}</span>
|
||||
<span class="tile-lbl">points this week</span>
|
||||
</div>
|
||||
<div class="tile tile-cash">
|
||||
<span class="tile-val">£{adminTiles.money.toFixed(2)}</span>
|
||||
<span class="tile-lbl">cash this week</span>
|
||||
</div>
|
||||
<div class="tile tile-chores">
|
||||
<span class="tile-val">{adminTiles.chores}</span>
|
||||
<span class="tile-lbl">chores done</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="kanban-scroll">
|
||||
<div class="kanban-inner">
|
||||
<CardGrid>
|
||||
<Card cols={1} title="Members">
|
||||
{#each parentMembers as m}
|
||||
{@const total = totalChoresFor(m.id)}
|
||||
@@ -838,6 +872,8 @@
|
||||
{/if}
|
||||
</Card>
|
||||
</CardGrid>
|
||||
</div>
|
||||
</div>
|
||||
<CardGrid>
|
||||
<Card cols={3} title="Debug: Preview payday" accent="#f59e0b">
|
||||
<p class="eow-desc">
|
||||
@@ -1328,10 +1364,17 @@
|
||||
|
||||
.member-card {
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
padding: 0.65rem;
|
||||
border-left: 4px solid #6366f1;
|
||||
border-radius: 10px;
|
||||
padding: 0.65rem 0.85rem;
|
||||
background: white;
|
||||
margin-bottom: 0.6rem;
|
||||
transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
|
||||
}
|
||||
.member-card:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
|
||||
border-color: #c7d2fe;
|
||||
}
|
||||
.member-card:last-child {
|
||||
margin-bottom: 0;
|
||||
@@ -1386,7 +1429,7 @@
|
||||
}
|
||||
.bar-fill {
|
||||
height: 100%;
|
||||
background: #6366f1;
|
||||
background: linear-gradient(90deg, #6366f1, #8b5cf6);
|
||||
border-radius: 4px;
|
||||
transition: width 0.3s;
|
||||
}
|
||||
@@ -1430,11 +1473,16 @@
|
||||
|
||||
.trigger-card {
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
padding: 0.65rem;
|
||||
border-left: 3px solid #22c55e;
|
||||
border-radius: 10px;
|
||||
padding: 0.65rem 0.85rem;
|
||||
background: #f0fdf4;
|
||||
margin-bottom: 0.6rem;
|
||||
border-left: 3px solid #22c55e;
|
||||
transition: transform 0.15s, box-shadow 0.15s;
|
||||
}
|
||||
.trigger-card:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
.trigger-card:last-child {
|
||||
margin-bottom: 0;
|
||||
@@ -1753,6 +1801,16 @@
|
||||
color: #6d28d9;
|
||||
}
|
||||
|
||||
/* ── Kanban scroll for parent view cards ── */
|
||||
.kanban-scroll {
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.kanban-inner {
|
||||
min-width: 450px;
|
||||
}
|
||||
|
||||
.tiles {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
@@ -1774,6 +1832,12 @@
|
||||
.tile-pts {
|
||||
background: linear-gradient(135deg, #7c3aed, #a855f7);
|
||||
}
|
||||
.tile-members {
|
||||
background: linear-gradient(135deg, #6366f1, #8b5cf6);
|
||||
}
|
||||
.tile-chores {
|
||||
background: linear-gradient(135deg, #0284c7, #38bdf8);
|
||||
}
|
||||
.tile-val {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 800;
|
||||
|
||||
Reference in New Issue
Block a user