Dateien nach "/" hochladen
Release v0.42.0 Modern UI
This commit is contained in:
+86
-54
@@ -7,86 +7,119 @@
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<header class="topbar">
|
||||
<div class="brand">
|
||||
<span class="brand-icon" aria-hidden="true">⌚</span>
|
||||
<div>
|
||||
<strong>qPlanner</strong>
|
||||
<span>Arbeitszeit-Auswertung</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="app">
|
||||
<section class="hero">
|
||||
<div>
|
||||
<div class="hero-content">
|
||||
<p class="eyebrow">qPlanner CSV-Auswertung</p>
|
||||
<h1>Arbeitszeit-Saldo berechnen</h1>
|
||||
<p class="intro">CSV-Datei hochladen, Netto-Arbeitszeiten auslesen und Plus-/Minusstunden berechnen. Samstage, Sonntage und gesetzliche Feiertage im gewählten Bundesland werden mit 0:00 Stunden Sollzeit bewertet.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="settings" aria-label="Einstellungen">
|
||||
<label>
|
||||
Sollzeit pro Arbeitstag Montag bis Freitag
|
||||
<input id="targetTime" type="time" value="08:00" step="60">
|
||||
</label>
|
||||
<label>
|
||||
Bundesland / Feiertagsregel
|
||||
<select id="federalState">
|
||||
<option value="NW">Nordrhein-Westfalen</option>
|
||||
<option value="BY">Bayern</option>
|
||||
<option value="BY_MARIA">Bayern inkl. Mariä Himmelfahrt</option>
|
||||
<option value="NI">Niedersachsen</option>
|
||||
<option value="HH">Hamburg</option>
|
||||
</select>
|
||||
</label>
|
||||
</section>
|
||||
|
||||
<section id="dropZone" class="drop-zone">
|
||||
<input id="csvFile" type="file" accept=".csv,text/csv">
|
||||
<div class="drop-content">
|
||||
<strong>CSV-Datei hier ablegen</strong>
|
||||
<span>oder Datei auswählen</span>
|
||||
<section class="settings" aria-label="Einstellungen">
|
||||
<label class="setting-card">
|
||||
<span class="setting-icon clock" aria-hidden="true">◷</span>
|
||||
<span class="setting-content">
|
||||
<span class="setting-label">Sollzeit pro Arbeitstag (Mo–Fr)</span>
|
||||
<input id="targetTime" type="time" value="08:00" step="60">
|
||||
</span>
|
||||
</label>
|
||||
<label class="setting-card">
|
||||
<span class="setting-icon location" aria-hidden="true">⌖</span>
|
||||
<span class="setting-content">
|
||||
<span class="setting-label">Bundesland / Feiertagsregel</span>
|
||||
<select id="federalState">
|
||||
<option value="NW">Nordrhein-Westfalen</option>
|
||||
<option value="BY">Bayern</option>
|
||||
<option value="BY_MARIA">Bayern inkl. Mariä Himmelfahrt</option>
|
||||
<option value="NI">Niedersachsen</option>
|
||||
<option value="HH">Hamburg</option>
|
||||
</select>
|
||||
</span>
|
||||
</label>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<section id="dropZone" class="drop-zone" aria-label="CSV-Datei hochladen">
|
||||
<input id="csvFile" type="file" accept=".csv,text/csv">
|
||||
<div class="drop-content">
|
||||
<span class="upload-icon" aria-hidden="true">☁</span>
|
||||
<strong>CSV-Datei hier ablegen</strong>
|
||||
<span>oder klicken zum Auswählen</span>
|
||||
<em>Unterstützt: .csv Dateien</em>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section id="errorBox" class="error hidden"></section>
|
||||
|
||||
<p id="formatHint" class="format-hint"></p>
|
||||
|
||||
<section id="summary" class="summary hidden" aria-live="polite">
|
||||
<article class="card">
|
||||
<article class="stat-card stat-days">
|
||||
<span class="stat-icon" aria-hidden="true">▣</span>
|
||||
<span>Arbeitstage</span>
|
||||
<strong id="totalDays">0</strong>
|
||||
<small>Tage mit Arbeitszeit</small>
|
||||
</article>
|
||||
<article class="card">
|
||||
<article class="stat-card stat-work">
|
||||
<span class="stat-icon" aria-hidden="true">◷</span>
|
||||
<span>Arbeitszeit gesamt</span>
|
||||
<strong id="totalWork">0:00</strong>
|
||||
<small>Stunden</small>
|
||||
</article>
|
||||
<article class="card">
|
||||
<article class="stat-card stat-target">
|
||||
<span class="stat-icon" aria-hidden="true">◎</span>
|
||||
<span>Sollzeit gesamt</span>
|
||||
<strong id="totalTarget">0:00</strong>
|
||||
<small>Stunden</small>
|
||||
</article>
|
||||
<article class="card saldo-card">
|
||||
<article class="stat-card stat-saldo">
|
||||
<span class="stat-icon" aria-hidden="true">↗</span>
|
||||
<span>Saldo gesamt</span>
|
||||
<strong id="totalSaldo">±0:00</strong>
|
||||
<small>Stunden</small>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<section id="results" class="results hidden">
|
||||
<div class="table-header">
|
||||
<h2>Monatsübersicht</h2>
|
||||
<button id="exportCsv" type="button">Ergebnis als CSV exportieren</button>
|
||||
</div>
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Monat</th>
|
||||
<th>Arbeitstage</th>
|
||||
<th>Feiertage</th>
|
||||
<th>Arbeitszeit</th>
|
||||
<th>Sollzeit</th>
|
||||
<th>Saldo</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="monthTable"></tbody>
|
||||
</table>
|
||||
<div class="panel table-panel">
|
||||
<div class="table-header">
|
||||
<div class="section-title">
|
||||
<span aria-hidden="true">▮</span>
|
||||
<h2>Monatsübersicht</h2>
|
||||
</div>
|
||||
<button id="exportCsv" type="button">⇩ Ergebnis als CSV exportieren</button>
|
||||
</div>
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Monat</th>
|
||||
<th>Arbeitstage</th>
|
||||
<th>Feiertage</th>
|
||||
<th>Arbeitszeit</th>
|
||||
<th>Sollzeit</th>
|
||||
<th>Saldo</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="monthTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<details class="details">
|
||||
<summary>Tagesdetails anzeigen</summary>
|
||||
<details class="panel details" open>
|
||||
<summary>
|
||||
<span class="section-title"><span aria-hidden="true">☷</span><strong>Tagesdetails</strong></span>
|
||||
<span class="summary-hint">ein-/ausblenden</span>
|
||||
</summary>
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead>
|
||||
@@ -110,11 +143,10 @@
|
||||
</section>
|
||||
</main>
|
||||
|
||||
|
||||
<footer class="app-footer" aria-label="Projektinformationen">
|
||||
<span id="appVersion">v0.41.1</span>
|
||||
<footer class="app-footer">
|
||||
<span id="appVersion">v0.42.0</span>
|
||||
<span aria-hidden="true">•</span>
|
||||
<a href="https://git.mike-lindner.net/mike/qplanner-arbeitszeit-auswertung" target="_blank" rel="noopener noreferrer">Repository</a>
|
||||
<a href="https://git.mike-lindner.net/mike/qplanner-arbeitszeit-auswertung" target="_blank" rel="noopener noreferrer">Repository ↗</a>
|
||||
</footer>
|
||||
|
||||
<script src="app.js"></script>
|
||||
|
||||
Reference in New Issue
Block a user