TorstenHettstedt/PHP-App-Timekeeping
1
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

feature-ui/eintrag-per-woche #23

Merged
TorstenHettstedt merged 20 commits from feature-ui/eintrag-per-woche into master 2022-02-28 16:04:31 +01:00
Conversation 0 Commits 20 Files Changed 18
+80 -77
2 changed files with 80 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit fafc2a0ad5 - Show all commits
ui/src/routes/WorkingHours.svelte
+63 -77
View File
@@ -1,11 +1,13 @@
<script> <script>
export let params; export let params;
let title = "Bearbeitung Einträge" const TITLE = "Bearbeitung Einträge";
import IconifyIcon from '@iconify/svelte'; import IconifyIcon from '@iconify/svelte';
import wrenchIcon from '@iconify-icons/oi/wrench'; import wrenchIcon from '@iconify-icons/oi/wrench';
import checkIcon from '@iconify-icons/oi/check'; import checkIcon from '@iconify-icons/oi/check';
import xIcon from '@iconify-icons/oi/x'; import xIcon from '@iconify-icons/oi/x';
import documentIcon from '@iconify-icons/oi/document'; import documentIcon from '@iconify-icons/oi/document';
import {WorkingHoursRepository} from '../components/Repositories.svelte'
import NewByDay from "./working-hours/NewByDay.svelte";
let activeRecord = null; let activeRecord = null;
params = { params = {
title: 'Einträge', title: 'Einträge',
@@ -51,85 +53,69 @@
</script> </script>
<svelte:head> <svelte:head>
<title>{title}</title> <title>{TITLE}</title>
</svelte:head> </svelte:head>
{#if activeRecord === null} <section id="list-records">
<section id="list-records"> <header>
<header> <h1>{TITLE}</h1>
<h1>{title}</h1> </header>
</header> {#if activeRecord === null}
<article> <article>
{#if params.isLoading === true} {#if params.isLoading === true}
<p>Loading...</p> <p>Loading...</p>
{:else} {:else}
<!--suppress HtmlUnknownTarget -->
<form action="/working-hours">
<fieldset>
<button on:click={Controller.newRecord} type="button">Neuer Eintrag
<IconifyIcon icon={documentIcon}/>
</button>
</fieldset>
</form>
<table>
<colgroup>
<col />
<col />
<col />
</colgroup>
<thead>
<tr>
<th>Datum</th>
<th>Arbeitsstunden</th>
<th>Aktionen</th>
</tr>
</thead>
<tbody>
{#each params.records as record}
<tr>
<td>{record.workingDay}</td>
<td>{record.workingTime}</td>
<td>
<button on:click={() => Controller.selectActiveRecord(record)} type="button">Bearbeiten
<IconifyIcon icon={wrenchIcon}/>
</button>
</td>
</tr>
{/each}
</tbody>
</table>
{/if}
</article>
</section>
{:else}
<section id="edit-record">
<header>
<h1>{title}</h1>
</header>
<article>
<!--suppress HtmlUnknownTarget --> <!--suppress HtmlUnknownTarget -->
<form action="/working-hours" name="editRecord"> <form action="/working-hours">
<fieldset name="record-data"> <fieldset>
<div> <button on:click={Controller.newRecord} type="button">Neuer Eintrag
<label for="workingDay">Arbeitstag</label> <IconifyIcon icon={documentIcon}/>
<input bind:value={activeRecord.workingDay} type="date"
id="workingDay" required pattern="\d\{4}-[0-1]\d-[0-3]\d\">
</div>
<div>
<label for="workingTime">Arbeitszeit</label>
<input bind:value={activeRecord.workingTime} placeholder="Arbeitszeit" type="time"
id="workingTime" required pattern="[0-5]\d:[0-5]\d:[0-5]\d">
</div>
</fieldset>
<fieldset name="buttons">
<button on:click={Controller.saveRecord} type="button">Übernehmen
<IconifyIcon icon={checkIcon} color="green"/>
</button>
<button on:click={Controller.cancelActiveRecord} type="button" class="sub-button">Abbrechen
<IconifyIcon icon={xIcon}/>
</button> </button>
</fieldset> </fieldset>
</form> </form>
</article> <table>
</section> <colgroup>
{/if} <col />
<col />
<col />
</colgroup>
<thead>
<tr>
<th>Datum</th>
<th>Arbeitsstunden</th>
<th>Aktionen</th>
</tr>
</thead>
<tbody>
{#each params.records as record}
<tr>
<td>{record.workingDay}</td>
<td>{record.workingTime}</td>
<td>
<button on:click={() => Controller.selectActiveRecord(record)} type="button">Bearbeiten
<IconifyIcon icon={wrenchIcon}/>
</button>
</td>
</tr>
{/each}
</tbody>
</table>
{/if}
</article>
{:else}
<article>
<!--suppress HtmlUnknownTarget -->
<form action="/working-hours" name="editRecord">
<NewByDay activeRecord="{activeRecord}"/>
<fieldset name="buttons">
<button on:click={Controller.saveRecord} type="button">Übernehmen
<IconifyIcon icon={checkIcon} color="green"/>
</button>
<button on:click={Controller.cancelActiveRecord} type="button" class="sub-button">Abbrechen
<IconifyIcon icon={xIcon}/>
</button>
</fieldset>
</form>
</article>
{/if}
</section>
ui/src/routes/working-hours/NewByDay.svelte
+17
View File
@@ -0,0 +1,17 @@
<script>
export let activeRecord
</script>
<fieldset name="record-data">
<div>
<label for="workingDay">Arbeitstag</label>
<input bind:value={activeRecord.workingDay} type="date"
id="workingDay" required pattern="\d\{4}-[0-1]\d-[0-3]\d\">
</div>
<div>
<label for="workingTime">Arbeitszeit</label>
<input bind:value={activeRecord.workingTime} placeholder="Arbeitszeit" type="time"
id="workingTime" required pattern="[0-5]\d:[0-5]\d:[0-5]\d">
</div>
</fieldset>