- Replace hand-coded skeleton CSS/JSX with boneyard-js auto-generated bones - Remove skeleton.css and @keyframes shimmer from base.css - Add <Skeleton> wrappers with fixtures to all 25+ page components - Generate 20 bone captures via boneyard CLI (CDP auth-gated capture) - Refactor data fetching from useEffect+useState to TanStack Query - Extract query hooks into src/admin/lib/queries/ and apiAdapter - Add usePaginatedQuery hook replacing useApiCall/useListData - Fix parseFloat || 0 anti-pattern in OfferDetail and OffersTemplates inputs - Fix customer_id mandatory validation on offer creation - Fix leave-requests comma-separated status filter (Prisma enum in: []) - Add cross-entity cache invalidation for orders/offers/invoices/projects - Make rate limits configurable via env vars (RATE_LIMIT_MAX, RATE_LIMIT_REFRESH, etc.) - Add boneyard.config.json with routes and breakpoints Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
133 lines
4.4 KiB
TypeScript
133 lines
4.4 KiB
TypeScript
export default function TripsFixture() {
|
|
return (
|
|
<div>
|
|
<div className="admin-page-header">
|
|
<div>
|
|
<h1 className="admin-page-title">Kniha jízd</h1>
|
|
<p className="admin-page-subtitle">duben 2025</p>
|
|
</div>
|
|
<div className="admin-page-actions">
|
|
<button className="admin-btn admin-btn-primary">Přidat jízdu</button>
|
|
</div>
|
|
</div>
|
|
<div className="admin-grid admin-grid-4">
|
|
<div className="admin-stat-card info">
|
|
<div className="admin-stat-icon info">
|
|
<svg
|
|
width="22"
|
|
height="22"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
>
|
|
<line x1="12" y1="20" x2="12" y2="10" />
|
|
<line x1="18" y1="20" x2="18" y2="4" />
|
|
<line x1="6" y1="20" x2="6" y2="16" />
|
|
</svg>
|
|
</div>
|
|
<div className="admin-stat-content">
|
|
<span className="admin-stat-value">12</span>
|
|
<span className="admin-stat-label">Počet jízd</span>
|
|
</div>
|
|
</div>
|
|
<div className="admin-stat-card">
|
|
<div className="admin-stat-icon">
|
|
<svg
|
|
width="22"
|
|
height="22"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
>
|
|
<path d="M22 12h-4l-3 9L9 3l-3 9H2" />
|
|
</svg>
|
|
</div>
|
|
<div className="admin-stat-content">
|
|
<span className="admin-stat-value">1 240 km</span>
|
|
<span className="admin-stat-label">Celkem naježděno</span>
|
|
</div>
|
|
</div>
|
|
<div className="admin-stat-card success">
|
|
<div className="admin-stat-icon success">
|
|
<svg
|
|
width="22"
|
|
height="22"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
>
|
|
<rect x="1" y="3" width="15" height="13" rx="2" ry="2" />
|
|
<path d="M16 8h2a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-1" />
|
|
<circle cx="5.5" cy="18" r="2" />
|
|
<circle cx="18.5" cy="18" r="2" />
|
|
<path d="M8 18h8" />
|
|
</svg>
|
|
</div>
|
|
<div className="admin-stat-content">
|
|
<span className="admin-stat-value">980 km</span>
|
|
<span className="admin-stat-label">Služební</span>
|
|
</div>
|
|
</div>
|
|
<div className="admin-stat-card warning">
|
|
<div className="admin-stat-icon warning">
|
|
<svg
|
|
width="22"
|
|
height="22"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
>
|
|
<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
|
|
<polyline points="9 22 9 12 15 12 15 22" />
|
|
</svg>
|
|
</div>
|
|
<div className="admin-stat-content">
|
|
<span className="admin-stat-value">260 km</span>
|
|
<span className="admin-stat-label">Soukromé</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="admin-card mt-6">
|
|
<div className="admin-card-header flex-between">
|
|
<h2 className="admin-card-title">Poslední jízdy</h2>
|
|
<a className="admin-btn admin-btn-secondary admin-btn-sm">
|
|
Zobrazit historii
|
|
</a>
|
|
</div>
|
|
<div className="admin-card-body">
|
|
<div className="admin-table-responsive">
|
|
<table className="admin-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Datum</th>
|
|
<th>Vozidlo</th>
|
|
<th>Trasa</th>
|
|
<th>Vzdálenost</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{Array.from({ length: 4 }, (_, i) => (
|
|
<tr key={i}>
|
|
<td className="admin-mono">1. 4. 2025</td>
|
|
<td>
|
|
<span className="admin-badge">1A2 3456</span>
|
|
</td>
|
|
<td>Praha → Brno</td>
|
|
<td className="admin-mono">
|
|
<strong>200 km</strong>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|