feat(repairs): street-car entry button + sheet on car select
Co-Authored-By: claude-flow <ruv@ruv.net>
This commit is contained in:
@@ -18,6 +18,15 @@ export default function CarSelectPage() {
|
||||
const [cars, setCars] = useState<CarBrief[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [extOpen, setExtOpen] = useState(false);
|
||||
const [extPlate, setExtPlate] = useState("");
|
||||
const [extMake, setExtMake] = useState("");
|
||||
|
||||
const continueExternal = () => {
|
||||
const plate = extPlate.trim();
|
||||
if (!plate) return;
|
||||
navigate("/repairs/new-external", { state: { plate, make: extMake.trim() || null } });
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false;
|
||||
@@ -62,6 +71,13 @@ export default function CarSelectPage() {
|
||||
</div>
|
||||
</header>
|
||||
<main className="flex-1 container max-w-2xl py-3">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setExtOpen(true)}
|
||||
className="w-full mb-3 flex items-center justify-center gap-1 rounded-md border border-dashed bg-card hover:bg-accent/40 transition-colors p-3 text-sm font-medium text-muted-foreground"
|
||||
>
|
||||
+ Машина не из парка
|
||||
</button>
|
||||
{error && (
|
||||
<div className="rounded-md border border-destructive bg-destructive/10 p-3 text-sm">
|
||||
{error}
|
||||
@@ -96,6 +112,41 @@ export default function CarSelectPage() {
|
||||
</ul>
|
||||
)}
|
||||
</main>
|
||||
{extOpen && (
|
||||
<div className="fixed inset-0 z-50 bg-background/95 flex flex-col">
|
||||
<header className="border-b p-3 flex items-center gap-2">
|
||||
<Button variant="ghost" size="sm" onClick={() => setExtOpen(false)}>
|
||||
Отмена
|
||||
</Button>
|
||||
<h2 className="text-base font-semibold">Машина с улицы</h2>
|
||||
</header>
|
||||
<main className="flex-1 container max-w-2xl py-4 space-y-4">
|
||||
<div>
|
||||
<label className="text-sm font-medium">Госномер *</label>
|
||||
<Input
|
||||
autoFocus
|
||||
value={extPlate}
|
||||
onChange={(e) => setExtPlate(e.target.value)}
|
||||
placeholder="Х999ХХ199"
|
||||
className="mt-1"
|
||||
onKeyDown={(e) => e.key === "Enter" && continueExternal()}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-sm font-medium">Марка и модель (необязательно)</label>
|
||||
<Input
|
||||
value={extMake}
|
||||
onChange={(e) => setExtMake(e.target.value)}
|
||||
placeholder="Toyota Camry"
|
||||
className="mt-1"
|
||||
/>
|
||||
</div>
|
||||
<Button className="w-full" disabled={!extPlate.trim()} onClick={continueExternal}>
|
||||
Продолжить →
|
||||
</Button>
|
||||
</main>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user