107 lines
3.1 KiB
Svelte
107 lines
3.1 KiB
Svelte
<script lang="ts">
|
|
import TableGenerator from "./table/table-generator.svelte";
|
|
import Loading from "$lib/navigation/loading.svelte";
|
|
import type { StaffLdb } from "@owlboard/ts-types";
|
|
import { detailInit, defineDetail } from "./train-detail";
|
|
import TrainDetail from "./train-detail.svelte";
|
|
import { fetchStaffLdb } from "./fetch";
|
|
import AlertBar from "../common/nrcc/alert-bar.svelte";
|
|
import TimeBar from "$lib/navigation/TimeBar.svelte";
|
|
import { onMount } from "svelte";
|
|
import { IconBus, IconSailboat } from "@tabler/icons-svelte";
|
|
|
|
export let station: string;
|
|
export let title: string | undefined = "Loading...";
|
|
|
|
let errorDetail = {
|
|
code: "",
|
|
message: "",
|
|
};
|
|
let nrcc: string[] = [];
|
|
|
|
let detail = detailInit();
|
|
function hideDetail() {
|
|
detail = detailInit();
|
|
}
|
|
function showDetail(rid: string, uid: string, tid: string) {
|
|
detail = defineDetail(rid, uid, tid);
|
|
}
|
|
|
|
console.log(`Station: ${station}`);
|
|
|
|
let updatedTime: Date;
|
|
|
|
async function callFetch(station: string): Promise<StaffLdb> {
|
|
console.log("callFetch function called");
|
|
const data = await fetchStaffLdb(station);
|
|
if (data.data) {
|
|
title = data.data.locationName;
|
|
if (data.data?.nrccMessages) {
|
|
for (const msg of data.data.nrccMessages) {
|
|
nrcc.push(msg.xhtmlMessage);
|
|
}
|
|
nrcc = nrcc; // Reassign to ensure Svelte reloads
|
|
}
|
|
if (data.data.generatedAt) {
|
|
updatedTime = new Date(data.data.generatedAt);
|
|
}
|
|
return data.data;
|
|
}
|
|
errorDetail.code = data.obStatus.toString() || "UNKNOWN";
|
|
errorDetail.message = data.obMsg || "An unknown error occoured";
|
|
throw new Error("Unable to Fetch Data");
|
|
}
|
|
|
|
onMount(async () => {
|
|
console.log("staff-ldb component mounted");
|
|
});
|
|
</script>
|
|
|
|
{#if nrcc.length}
|
|
<AlertBar alerts={nrcc} />
|
|
{/if}
|
|
|
|
<TimeBar bind:updatedTime />
|
|
|
|
{#key detail}
|
|
{#if detail.show}
|
|
<TrainDetail {detail} close={hideDetail} />
|
|
{/if}
|
|
{/key}
|
|
|
|
{#await callFetch(station)}
|
|
<Loading />
|
|
{:then data}
|
|
{#if data}
|
|
{#if data.trainServices?.length}
|
|
<TableGenerator services={data.trainServices} click={showDetail} />
|
|
{/if}
|
|
{#if data.busServices?.length}
|
|
<IconBus />
|
|
<br />
|
|
<span class="table-head-text">Bus Services</span>
|
|
<TableGenerator services={data.busServices} click={showDetail} />
|
|
{/if}
|
|
{#if data.ferryServices?.length}
|
|
<IconSailboat />
|
|
<br>
|
|
<span class="table-head-text">Ferry Services</span>
|
|
<TableGenerator services={data.ferryServices} click={showDetail} />
|
|
{/if}
|
|
{/if}
|
|
{:catch}
|
|
<h2>Error</h2>
|
|
<p>ERR-CODE: {errorDetail.code}</p>
|
|
<p>Message:<br />{errorDetail.message}</p>
|
|
{/await}
|
|
|
|
<style>
|
|
.transport-mode {
|
|
padding-top: 20px;
|
|
height: 17px;
|
|
}
|
|
.table-head-text {
|
|
color: white;
|
|
}
|
|
</style>
|