Patrick
/
Stundenaufzeichnung
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

code improvements

This commit is contained in:
Patrick 2025-06-05 14:32:39 +02:00
parent 104cafbcec
commit e2f011597d
5 changed files with 153 additions and 284 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
src/routes/+page.svelte
View File

@ -14,9 +14,6 @@
let { data, form } : PageProps = $props(); let { data, form } : PageProps = $props();
//$inspect(data);
const HEADERS: string[] = [ "Datum", "Wochentag", "Beginn", "Ende", "Dauer", "Anmerkung" ];
const status_ok = "ok"; const status_ok = "ok";
const status_missing = "missing"; const status_missing = "missing";
@ -42,22 +39,43 @@
}) })
function setNewState() { function setNewState() {
new_state = { if (form?.success != null) {
date: { new_state = {
valid: form?.new_entry?.date?.value !== "" || form?.new_entry?.date?.valid, date: {
value: form?.new_entry?.date?.value ?? "", valid: true,
}, value: ""
start: { },
valid: form?.new_entry?.start?.value !== "" || form?.new_entry?.start?.valid, start: {
value: form?.new_entry?.start?.value ?? "", valid: true,
}, value: ""
end: { },
valid: form?.new_entry?.end?.value !== "" || form?.new_entry?.end?.valid, end: {
value: form?.new_entry?.end?.value ?? "", valid: true,
}, value: ""
comment: { },
value: form?.new_entry?.date?.comment ?? "", comment: {
}, value: ""
}
}
return
} else {
new_state = {
date: {
valid: form?.new_entry?.date?.value !== "" || form?.new_entry?.date?.valid,
value: form?.new_entry?.date?.value ?? "",
},
start: {
valid: form?.new_entry?.start?.value !== "" || form?.new_entry?.start?.valid,
value: form?.new_entry?.start?.value ?? "",
},
end: {
valid: form?.new_entry?.end?.value !== "" || form?.new_entry?.end?.valid,
value: form?.new_entry?.end?.value ?? "",
},
comment: {
value: form?.new_entry?.date?.comment ?? "",
},
}
} }
} }

89
src/routes/dokumente/+page.svelte
View File

@ -1,24 +1,21 @@
<script lang="ts"> <script lang="ts">
import type { PageProps } from "./$types"; import type { PageProps } from "./$types";
import type { FileProperties } from "$lib/server/docstore";
import { enhance } from "$app/forms";
import { isoToLocalDate, padInt } from "$lib/util"; import { isoToLocalDate, padInt } from "$lib/util";
import Expander from "./expander.svelte"; import Expander from "./expander.svelte";
let { data, form } : PageProps = $props(); let { data } : PageProps = $props();
$inspect(data);
</script> </script>
<div> <div>
<h1>Dokumente</h1> <h1>Dokumente</h1>
<form id="form_download" method="GET" > <form id="form_download" method="GET" ></form>
{#snippet table(first_cell_name: string, rows)} {#snippet table(first_cell_name: string, rows: FileProperties[])}
<table> <table>
<thead> <thead>
<tr> <tr>
@ -32,7 +29,7 @@
{#each rows as file} {#each rows as file}
<tr> <tr>
<td>{file.identifier}</td> <td>{file.identifier}</td>
<td>{file.filename}</td> <td>{file.name}</td>
<td>{isoToLocalDate(file.cdate.toISOString())}<br/>um {padInt(file.cdate.getHours(), 2)}:{padInt(file.cdate.getMinutes(), 2)}:{padInt(file.cdate.getSeconds(), 2)}</td> <td>{isoToLocalDate(file.cdate.toISOString())}<br/>um {padInt(file.cdate.getHours(), 2)}:{padInt(file.cdate.getMinutes(), 2)}:{padInt(file.cdate.getSeconds(), 2)}</td>
<td> <td>
<form method="GET" action={`dokumente/${file.path}`} target="_blank"> <form method="GET" action={`dokumente/${file.path}`} target="_blank">
@ -86,78 +83,6 @@
</Expander> </Expander>
</div> </div>
<div style:height="100px"></div>
<!--<form method="POST" id="create_est" action="?/create_estimate" use:enhance></form>
<form method="POST" id="create_rec" action="?/create_record" use:enhance></form>
<table>
<caption>Dokument erstellen</caption>
<tbody>
<tr>
<td>Stundenliste</td>
<td>
<input form="create_rec" style:width="2ch" name="month" /> -
<input form="create_rec" style:width="4ch" name="year" placeholder="Jahr" value={new Date().getFullYear()} />
</td>
<td>
<button form="create_rec" type="submit">Erstellen</button>
</td>
</tr>
<tr>
<td>Stundenschätzung</td>
<td>
<input form="create_est" style:width="1ch" name="quarter" />. Quartal
<input form="create_est" style:width="4ch" name="year" placeholder="Jahr" value={new Date().getFullYear()} />
</td>
<td>
<button form="create_est" type="submit">Erstellen</button>
</td>
</tr>
</tbody>
</table>
<div style:width="100%" style="text-align: center;">{!(form?.success) ? form?.message : "Dokument erstellt."}</div>
<div style:height="20px"></div>
<table>
<caption>Erstellte Dokumente</caption>
<thead>
<tr>
<th style:width="30ch">Dateiname</th>
<th style:width="15ch">Erstellt</th>
<th style:width="12ch">Aktion</th>
</tr>
</thead>
<tbody>
{#each data.documents as doc}
<tr>
<td>{doc.name}</td>
<td>{`${isoToLocalDate(doc.timestamp.toISOString())} um ${padInt(doc.timestamp.getHours(), 2)}:${padInt(doc.timestamp.getMinutes(), 2)}:${padInt(doc.timestamp.getSeconds(), 2)}`}</td>
<td>
<form method="GET" action={`dokumente/${doc.path}`}>
<button type="submit">Download</button>
</form>
</td>
</tr>
{/each}
<tr></tr>
</tbody>
{#if data.documents.length === 0}
<tfoot>
<tr>
<td class="td-no-elements" colspan="999">Noch keine Dokumente</td>
</tr>
</tfoot>
{/if}
</table> -->
</div> </div>
<style> <style>
@ -187,10 +112,6 @@ tbody tr {
border-bottom: 1px solid black; border-bottom: 1px solid black;
} }
tbody tr th {
text-align: center;
}
tbody tr td { tbody tr td {
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;

2
src/routes/dokumente/expander.svelte
View File

@ -2,7 +2,7 @@
import type { Snippet } from "svelte"; import type { Snippet } from "svelte";
let { id, label, children } : { label: string, children: Snippet } = $props(); let { id, label, children } : { id: string, label: string, children: Snippet } = $props();
let _id = id + "_check"; let _id = id + "_check";
</script> </script>

202
src/routes/record_input_row.svelte
View File

@ -497,135 +497,127 @@
</script> </script>
<!--<tr> <td>
{#each { length: prepend_td }, n} <!-- svelte-ignore a11y_autofocus -->
<td></td> <input
{/each}--> bind:this={dateInput}
<td> bind:value={states.date.value}
<input class:form-invalid={!states.date.valid}
bind:this={dateInput} name="date"
bind:value={states.date.value} type="text"
class:form-invalid={!states.date.valid} form={targetForm}
name="date" onfocusin={
type="text" (_) => {
form={targetForm} dateInput.select();
onfocusin={ states.date.valid = true;
(_) => {
dateInput.select();
states.date.valid = true;
}
} }
onfocusout={ }
(_) => { onfocusout={
(_) => {
states.date.valid = validateDate(dateInput);
states.date.value = dateInput.value;
}
}
onkeydown={
(event) => {
if (event.key == "Enter") {
states.date.valid = validateDate(dateInput); states.date.valid = validateDate(dateInput);
states.date.value = dateInput.value; states.date.value = dateInput.value;
} }
} }
onkeydown={ }
(event) => { disabled={!enabled}
if (event.key == "Enter") { {autofocus}
states.date.valid = validateDate(dateInput); required>
states.date.value = dateInput.value; </td>
}
}
}
disabled={!enabled}
{autofocus}
required>
</td>
<td> <td>
{inWeekDay} {inWeekDay}
</td> </td>
<td> <td>
<input <input
bind:this={startInput} bind:this={startInput}
bind:value={states.start.value} bind:value={states.start.value}
class:form-invalid={!states.start.valid} class:form-invalid={!states.start.valid}
name="start" name="start"
type="text" type="text"
form={targetForm} form={targetForm}
onfocusin={ onfocusin={
(_) => { (_) => {
startInput.select(); startInput.select();
states.start.valid = true; states.start.valid = true;
}
} }
onfocusout={ }
(_) => { onfocusout={
(_) => {
states.start.valid = validateTime(startInput);
states.start.value = startInput.value;
}
}
onkeydown={
(event) => {
if (event.key == "Enter") {
states.start.valid = validateTime(startInput); states.start.valid = validateTime(startInput);
states.start.value = startInput.value; states.start.value = startInput.value;
} }
} }
onkeydown={ }
(event) => { disabled={!enabled}
if (event.key == "Enter") { required>
states.start.valid = validateTime(startInput); </td>
states.start.value = startInput.value;
}
}
}
disabled={!enabled}
required>
</td>
<td> <td>
<input <input
bind:this={endInput} bind:this={endInput}
bind:value={states.end.value} bind:value={states.end.value}
class:form-invalid={!states.end.valid} class:form-invalid={!states.end.valid}
name="end" name="end"
type="text" type="text"
form={targetForm} form={targetForm}
onfocusin={ onfocusin={
(_) => { (_) => {
endInput.select(); endInput.select();
states.end.valid = true; states.end.valid = true;
}
} }
onfocusout={ }
(_) => { onfocusout={
(_) => {
states.end.valid = validateTime(endInput);
states.end.value = endInput.value;
}
}
onkeydown={
(event) => {
if (event.key == "Enter") {
states.end.valid = validateTime(endInput); states.end.valid = validateTime(endInput);
states.end.value = endInput.value; states.end.value = endInput.value;
} }
} }
onkeydown={ }
(event) => { disabled={!enabled}
if (event.key == "Enter") { required>
states.end.valid = validateTime(endInput); </td>
states.end.value = endInput.value;
}
}
}
disabled={!enabled}
required>
</td>
<td> <td>
{inDuration} {inDuration}
</td> </td>
<td> <td>
<input <input
name="comment" name="comment"
type="text" type="text"
form={targetForm} form={targetForm}
value={states.comment.value} value={states.comment.value}
disabled={!enabled}> disabled={!enabled}>
</td> </td>
<td class="action"> <td class="action">
{@render children?.()} {@render children?.()}
</td> </td>
<!--</tr>-->
<style> <style>
/* * {
border: 1px solid;
}*/
td input { td input {
box-sizing: border-box; box-sizing: border-box;

88
src/routes/schaetzung/+page.svelte
View File

@ -4,9 +4,7 @@
import { enhance } from "$app/forms"; import { enhance } from "$app/forms";
import { MONTHS, toInt, toFloat, padInt } from "$lib/util"; import { MONTHS, toInt, toFloat, padInt } from "$lib/util";
let { form, data }: PageProps = $props(); let { data }: PageProps = $props();
$inspect(data);
let next = $state((() => { let next = $state((() => {
if (data.estimates.size == 0) { if (data.estimates.size == 0) {
@ -25,7 +23,6 @@
estimate_2: { value: "" }, estimate_2: { value: "" },
editing: { value: "" } editing: { value: "" }
}) })
$inspect(estimate_store);
function validate_year(event: InputEvent) { function validate_year(event: InputEvent) {
const input = event.target as HTMLInputElement; const input = event.target as HTMLInputElement;
@ -55,20 +52,6 @@
} }
} }
/*const TODAY = new Date();
const NEXT_QUART = (data?.estimates?.length > 0)
? new Date(data.estimates[0].year + (data.estimates[0].quarter === 4 ? 1 : 0), 4 * (data.estimates[0].quarter - (data.estimates[0].quarter === 4 ? -4 : 0)))
: TODAY;
const add_quart = quart_from_date(NEXT_QUART);
function quart_from_date(date: Date) {
return Math.floor((date.getMonth()+1) / 4) + 1;
}
function month_from_quart(quart: number, num: number) {
return new Date(TODAY.getFullYear(), (quart - 1) * 4 + num);
}*/
</script> </script>
<form id="form_add_quart" method="POST" action="?/add_quarter" use:enhance></form> <form id="form_add_quart" method="POST" action="?/add_quarter" use:enhance></form>
@ -87,20 +70,20 @@
<tbody> <tbody>
<tr> <tr>
<td rowspan="3">Neue Schätzung: <input form="form_add_quart" style:width="7ch" type="number" name="year" oninput={validate_year} value={next.year} tabindex="8"/> - <input form="form_add_quart" style:width="4ch" type="number" name="quarter" oninput={validate_quarter} value={new_quart} tabindex="9"/>. Quartal</td> <td rowspan="3">Neue Schätzung: <input form="form_add_quart" style:width="7ch" type="number" name="year" oninput={validate_year as any} value={next.year} tabindex="8"/> - <input form="form_add_quart" style:width="4ch" type="number" name="quarter" oninput={validate_quarter as any} value={new_quart} tabindex="9"/>. Quartal</td>
<td>{MONTHS[(new_quart - 1) * 3 + 0]}</td> <td>{MONTHS[(new_quart - 1) * 3 + 0]}</td>
<td><input form="form_add_quart" type="text" name="estimate_0" oninput={(e) => validate_estimate(e, estimate_store.estimate_0)} tabindex="10" /></td> <td><input form="form_add_quart" type="text" name="estimate_0" oninput={(e: any) => validate_estimate(e, estimate_store.estimate_0)} tabindex="10" /></td>
<td rowspan="3"><button form="form_add_quart" type="submit" tabindex="13">Erstellen</button></td> <td rowspan="3"><button form="form_add_quart" type="submit" tabindex="13">Erstellen</button></td>
</tr> </tr>
<tr> <tr>
<td>{MONTHS[(new_quart - 1) * 3 + 1]}</td> <td>{MONTHS[(new_quart - 1) * 3 + 1]}</td>
<td><input form="form_add_quart" type="text" name="estimate_1" oninput={(e) => validate_estimate(e, estimate_store.estimate_1)} tabindex="11" /></td> <td><input form="form_add_quart" type="text" name="estimate_1" oninput={(e: any) => validate_estimate(e, estimate_store.estimate_1)} tabindex="11" /></td>
</tr> </tr>
<tr> <tr>
<td>{MONTHS[(new_quart - 1) * 3 + 2]}</td> <td>{MONTHS[(new_quart - 1) * 3 + 2]}</td>
<td><input form="form_add_quart" type="text" name="estimate_2" oninput={(e) => validate_estimate(e, estimate_store.estimate_2)} tabindex="12" /></td> <td><input form="form_add_quart" type="text" name="estimate_2" oninput={(e: any) => validate_estimate(e, estimate_store.estimate_2)} tabindex="12" /></td>
</tr> </tr>
</tbody> </tbody>
@ -142,7 +125,7 @@
<td class="action" rowspan="3"> <td class="action" rowspan="3">
{#if data.documents?.get(year)?.get(quarter)?.[0] != null} {#if data.documents?.get(year)?.get(quarter)?.[0] != null}
{@const document = data.documents.get(year).get(quarter)[0]} {@const document = data.documents!.get(year)!.get(quarter)![0]}
<form method="GET" action={`/dokumente/${document.path}`}> <form method="GET" action={`/dokumente/${document.path}`}>
<button type="submit">Download PDF</button> <button type="submit">Download PDF</button>
</form> </form>
@ -167,60 +150,15 @@
{/each} {/each}
</tbody> </tbody>
{#if data.estimates === undefined || data.estimates.size === 0} {#if data.estimates.size === 0}
<tfoot> <tfoot>
<tr> <tr>
<td class="td-no-elements" colspan="999">No records</td> <td class="td-no-elements" colspan="999">No records</td>
</tr> </tr>
</tfoot> </tfoot>
{/if} {/if}
</table> </table>
{"" /*<tr>
<td rowspan="3">{add_quart}. Quartal {NEXT_QUART.getFullYear()}</td>
<td>{month_of(month_from_quart(add_quart, 0))}</td>
<!-- svelte-ignore a11y_positive_tabindex -->
<td><input form="form_add_quart" type="text" tabindex="1" name="estimate_0" value={form?.data?.estimate_0}/></td>
<td rowspan="3">
<input form="form_add_quart" type="hidden" name="year" value={NEXT_QUART.getFullYear()}/>
<input form="form_add_quart" type="hidden" name="quarter" value={add_quart}/>
<button form="form_add_quart" type="submit">+</button>
</td>
</tr>
<tr>
<td>{month_of(month_from_quart(add_quart, 1))}</td>
<!-- svelte-ignore a11y_positive_tabindex -->
<td><input form="form_add_quart" type="text" tabindex="2" name="estimate_1" value={form?.data?.estimate_1}/></td>
</tr>
<tr>
<td>{month_of(month_from_quart(add_quart, 2))}</td>
<!-- svelte-ignore a11y_positive_tabindex -->
<td><input form="form_add_quart" type="text" tabindex="3" name="estimate_2" value={form?.data?.estimate_2}/></td>
</tr>*/}
{"" /*
{#if months.length > 0}
<tr>
<td rowspan={rowspan}>
{quarter.quarter}. Quartal {quarter.year}
</td>
<td>{month_of(month_from_quart(quarter.quarter, months[0].i))}</td>
<td>{months[0].estimate.toFixed(2)}</td>
<td rowspan={rowspan}>Edit</td>
</tr>
{#each months.slice(1) as month}
<tr>
<td>{month_of(month_from_quart(quarter.quarter, month.i))}</td>
<td>{month.estimate.toFixed(2)}</td>
</tr>
{/each}
{/if}*/}
<style> <style>
form { form {