Files
web-pwa/src/lib/components/ui/cards/HeadcodeSearchCard.svelte

41 lines
895 B
Svelte

<script lang="ts">
import { goto } from '$app/navigation';
import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
import Textbox from '$lib/components/ui/Textbox.svelte';
import Button from '$lib/components/ui/Button.svelte';
let headcode = $state('');
function handleSearch(headcode: string) {
if (!headcode.trim()) return;
const searchParams = new URLSearchParams();
searchParams.append('h', headcode.trim().toUpperCase());
goto(`/trains?${searchParams.toString()}`);
}
</script>
<BaseCard header={'Search Train & PIS'}>
<div class="card-content">
<Textbox
placeholder="Enter Headcode"
bind:value={headcode}
maxLength={4}
onsubmit={handleSearch}
/>
</div>
</BaseCard>
<style>
.card-content {
text-align: center;
width: 90%;
margin: auto;
padding: 10px 0 0.5rem 0;
display: flex;
flex-direction: column;
gap: 0.75rem;
}
</style>