First

frontend/src/routes/lookup/+page.js

@@ -0,0 +1,23 @@
+import { redirect } from '@sveltejs/kit';
+import { get_api_lookup } from '$lib/backend.js';
+
+/** @type {import('./$types').PageLoad} */
+export async function load({ url, fetch }) {
+	let query = (url.searchParams.get('q') || '').replace(/^\s+|\s+$/g, '').replace(/\s+/g, ' ');
+	let ordinal = parseInt(url.searchParams.get('ordinal') || '');
+	let name = (url.searchParams.get('name') || '').replace(/^\s+|\s+$/g, '').replace(/\s+/g, ' ').toUpperCase();
+	let items = query ? await get_api_lookup({ fetch, query }) : [];
+	if(ordinal) items = items.filter(row => row.ordinal == ordinal);
+	else if(name) items = items.filter(row => row.name.startsWith(name));
+	let detail, match;
+	if((items.length == 1) && (url.searchParams.get('rd'))) {
+		detail = await get_api_lookup({ fetch, query, ordinal: (items[0].ordinal || '0'), force: url.searchParams.get('force') });
+		if(match = /(^[^\r\n;]+);(?:\([^\)]*?\))? (?:(\d+) )?(\d{3}-\d{2}-\d{4}P?) (.+?)\s*$/m.exec(detail)) {
+			if(match[2]) throw redirect(302, '/chart/' + match[2]);
+			if(match[3]) throw redirect(302, '/chart/' + match[3].replace(/[^\dP]/g, ''));
+		}
+	}
+	return {
+		query, ordinal, name, items, detail
+	};
+}

frontend/src/routes/lookup/+page.svelte

@@ -0,0 +1,62 @@
+<script>
+	import { tick } from 'svelte';
+	import { page } from '$app/stores';
+	export let data;
+
+	let ref = null;
+
+	$: tick().then(() => ref ? ref.focus() : null);
+</script>
+
+<svelte:head>
+	<title>Lookup</title>
+</svelte:head>
+
+<h1>Lookup</h1>
+<div class="card mb-3 shadow">
+	<form method="get" action="?">
+		<div class="input-group">
+			<span class="input-group-text">🔎</span>
+			<input type="text" class="form-control" placeholder="Lookup" name="q" bind:value={data.query} bind:this={ref} />
+			<button type="submit" class="btn btn-primary">Search</button>
+		</div>
+	</form>
+	{#if data.items.length > 0}
+		<table class="table" data-sveltekit-preload-data="tap">
+			<thead>
+				<tr>
+					<th scope="col">Name</th>
+					<th scope="col">DOB</th>
+					<th scope="col">SSN</th>
+					<th scope="col"></th>
+					<th scope="col">Type</th>
+					<th scope="col"></th>
+				</tr>
+			</thead>
+			<tbody>
+				{#each data.items as row}
+					<tr>
+						<td><a href="/lookup?q={data.query}&ordinal={row.ordinal || 0}&rd=true">{row.name}{#if row.alias}{' (' + row.alias + ')'}{/if}</a></td>
+						<td>{row.dob}</td>
+						<td>{row.ssn}</td>
+						<td>{row.yesno}</td>
+						<td>{row.type}</td>
+						<td>{row.no}</td>
+					</tr>
+				{/each}
+			</tbody>
+		</table>
+		{#if (data.items.length) == 1 && (data.detail)}
+			<div class="card-body">
+				<pre class="card-text">{data.detail}</pre>
+				<p class="card-text"><a class="btn btn-danger" href="/lookup?q={data.query}&ordinal={data.items[0].ordinal || 0}&rd=true&force=true">Proceed to {data.items[0].name}</a></p>
+			</div>
+		{/if}
+	{/if}
+</div>
+
+<style>
+	.card table.table {
+		margin-bottom: 0;
+	}
+</style>