Files
PHP-App-Timekeeping/ui/src/routes/Views.svelte
T

54 lines
1.6 KiB
Svelte

<script>
export let params;
console.log(params)
if (!String.prototype.startsWith) {
String.prototype.startsWith = function(searchString, position) {
position = position || 0;
return this.indexOf(searchString, position) === position;
};
}
$: isNegative = time => time.startsWith('-') ? 'absence-time' : '';
$: cutMinusChar = time => time.startsWith('-') ? time.substr(1) : time;
</script>
<svelte:head>
<title>{params.title}</title>
</svelte:head>
<section id="list-records">
<header>
<h1>{params.title}</h1>
</header>
<article>
{#if params.isLoading === true}
<p>Loading...</p>
{:else}
<table>
<colgroup>
<col />
<col />
<col />
<col />
</colgroup>
<thead>
<tr>
<th>Zeitraum</th>
<th>Arbeitstage</th>
<th>Arbeitsstunden</th>
<th>Über- / Unterstunden</th>
</tr>
</thead>
<tbody>
{#each params.records as record}
<tr>
<td>{record.period}</td>
<td>{record.workingDays}</td>
<td>{record.totalHours}</td>
<td class="{ isNegative(record.overtime) }">{cutMinusChar(record.overtime)}</td>
</tr>
{/each}
</tbody>
</table>
{/if}
</article>
</section>