Preparatory work for update StaffLdb API Response

This commit is contained in:
Fred Boniface 2023-08-14 22:00:26 +01:00
parent 33e383296e
commit eac9d2bff7
2 changed files with 134 additions and 2 deletions

View File

@ -0,0 +1,133 @@
<script lang="ts">
export let station = '';
export let title = 'Loading...';
import { onMount } from 'svelte';
import AlertBar from '$lib/ldb/nrcc/alert-bar.svelte';
import StaffTrainDetail from '$lib/ldb/staff/train-detail.svelte';
import Loading from '$lib/navigation/loading.svelte';
import { uuid } from '$lib/stores/uuid';
import Island from '$lib/islands/island.svelte';
import TableGeneratorDev from './table/table-generator_dev.svelte';
import type { StaffLdb, NrccMessage, TrainServices, ApiResponse } from '@owlboard/ts-types';
let jsonData: ApiResponse<StaffLdb>;
let isLoading = true;
let isErr = false;
let errMsg: string;
let alerts: NrccMessage[];
let detail = { show: false, rid: '', uid: '', headcode: '' };
$: {
if (isLoading) {
title = "Loading..."
} else {
title = station
}
}
async function fetchData() {
isLoading = true; // Set loading state
try {
console.log(`Requested Station: ${requestedStation}`);
const url = `https://owlboard.info/api/v2/live/station/${requestedStation}/staff`;
const opt = {
method: 'GET',
headers: {
uuid: $uuid
}
};
const data = await fetch(url, opt);
const json = await data.json();
if (json.ERROR === 'NOT_FOUND') {
isErr = true;
errMsg = 'Unable to find this station';
} else {
jsonData = json;
}
} catch (error) {
console.error('Error fetching data:', error);
isLoading = false;
isErr = true;
errMsg = 'Connection error, try again later';
} finally {
isLoading = false; // Clear loading state
}
}
function showDetail(rid = '', uid = '', tid = '') {
detail = {
rid: rid,
uid: uid,
headcode: tid,
show: true
};
}
function hideDetails() {
detail = {
rid: '',
uid: '',
headcode: '',
show: false
};
}
</script>
{#key detail}
{#if detail.show}
<StaffTrainDetail {detail} close={hideDetails} />
{/if}
{/key}
{#if isLoading}
<Loading />
{:else if isErr}
<Island>
<p><strong>{errMsg}</strong></p>
</Island>
{:else}
{#if alerts.length}
<AlertBar {alerts} />
{/if}
<p class="dataTime">Data from: {dataAge.toLocaleString([])}</p>
{#if trainServices && trainServices.length}
<TableGenerator services={trainServices} click={showDetail} />
{:else}
<p id="noservices">There are no scheduled train services in the next two hours</p>
{/if}
{#if busServices && busServices.length}
<img class="transport-mode-image" src="/images/transport-modes/bus.svg" alt="" />
<br />
<span class="transport-mode-text">Bus Services</span>
<TableGenerator services={busServices} click={showDetail} />
{/if}
{#if ferryServices && ferryServices.length}
<img class="transport-mode-image" src="/images/transport-modes/ferry.svg" alt="" />
<br />
<span class="transport-mode-text">Ferry Services</span>
<TableGenerator services={ferryServices} click={showDetail} />
{/if}
{/if}
<style>
p.dataTime {
margin-top: 5px;
margin-bottom: 0px;
font-size: 12px;
}
#noservices {
margin: 20px;
padding-top: 20px;
color: white;
}
.transport-mode-image {
width: 30px;
margin: auto;
padding-top: 25px;
}
.transport-mode-text {
color: white;
}
</style>

View File

@ -2,8 +2,7 @@
import Reason from '$lib/raw-fetchers/reason.svelte';
import { tocs as tocMap } from '$lib/stores/tocMap';
import type { StaffLdb, NrccMessage, TrainServices,
ServiceLocation } from '@owlboard/ts-types';
import type { TrainServices, ServiceLocation } from '@owlboard/ts-types';
export let services;
export let click;