feat: refine quick wins workflow and calendar layout

This commit is contained in:
2026-04-15 12:17:58 +02:00
parent 4aa4447c01
commit 2f2e543a79
12 changed files with 405 additions and 128 deletions

View File

@@ -4,6 +4,11 @@ import json
from pathlib import Path
from flask import Flask
from markupsafe import escape
try:
import pyphen
except ModuleNotFoundError: # pragma: no cover - optional dependency in local dev
pyphen = None
from config import Config
@@ -19,6 +24,12 @@ from .services.bootstrap import ensure_schema_and_admins
from .services.dates import MONTH_NAMES, local_now
from .services.monthly import archive_months_missing_up_to_previous
DE_HYPHENATOR = pyphen.Pyphen(lang="de_DE") if pyphen else None
def _fallback_soft_hyphenate(word: str) -> str:
return word
def create_app(config_class: type[Config] = Config) -> Flask:
app = Flask(__name__, static_folder="static", template_folder="templates")
@@ -111,4 +122,36 @@ def create_app(config_class: type[Config] = Config) -> Flask:
def month_name(value):
return MONTH_NAMES[value]
@app.template_filter("hyphenate_de")
def hyphenate_de(value):
if not value:
return ""
text = str(value)
parts: list[str] = []
current = []
def flush_word():
if not current:
return
word = "".join(current)
if len(word) >= 6:
if DE_HYPHENATOR:
parts.append(DE_HYPHENATOR.inserted(word, "\u00AD"))
else:
parts.append(_fallback_soft_hyphenate(word))
else:
parts.append(word)
current.clear()
for char in text:
if char.isalpha() or char in "ÄÖÜäöüß":
current.append(char)
else:
flush_word()
parts.append(char)
flush_word()
return escape("".join(parts))
return app

View File

@@ -115,11 +115,11 @@ class AdminUserForm(FlaskForm):
class QuickTaskForm(FlaskForm):
title = StringField("Titel", validators=[DataRequired(), Length(min=2, max=160)])
title = StringField("Titel", validators=[Optional(), Length(min=2, max=160)])
effort = SelectField(
"Aufwand",
choices=[(key, key) for key, _, _ in QUICK_TASK_EFFORTS],
validators=[DataRequired()],
validators=[Optional()],
)
submit = SubmitField("Quick-Win speichern")

View File

@@ -232,6 +232,42 @@ def delete_quick_win(quick_win_id: int):
return redirect(url_for("settings.quick_wins"))
@bp.route("/quick-wins/<int:quick_win_id>/update", methods=["POST"])
@login_required
def update_quick_win(quick_win_id: int):
quick_win = QuickWin.query.get_or_404(quick_win_id)
quick_task_config = get_quick_task_config()
title = (request.form.get("title") or "").strip()
effort = request.form.get("effort") or ""
if len(title) < 2:
flash("Quick-Wins brauchen einen Titel mit mindestens 2 Zeichen.", "error")
return redirect(url_for("settings.quick_wins"))
if len(title) > 160:
flash("Quick-Win-Titel dürfen maximal 160 Zeichen lang sein.", "error")
return redirect(url_for("settings.quick_wins"))
if effort not in quick_task_config:
flash("Bitte wähle einen gültigen Aufwand.", "error")
return redirect(url_for("settings.quick_wins"))
duplicate = (
QuickWin.query.filter(QuickWin.id != quick_win.id, QuickWin.title == title, QuickWin.active.is_(True))
.first()
)
if duplicate:
flash("Diesen Quick-Win gibt es bereits.", "error")
return redirect(url_for("settings.quick_wins"))
quick_win.title = title
quick_win.effort = effort
db.session.commit()
flash(f"Quick-Win „{quick_win.title}“ wurde aktualisiert.", "success")
return redirect(url_for("settings.quick_wins"))
@bp.route("/users/<int:user_id>/toggle-admin", methods=["POST"])
@login_required
def toggle_admin(user_id: int):

View File

@@ -110,33 +110,44 @@ def create():
@login_required
def quick_create():
config = get_quick_task_config()
quick_action = request.form.get("quick_action", "save")
quick_mode = request.form.get("quick_mode", "preset")
created_titles: list[str] = []
if quick_mode == "preset":
quick_win = QuickWin.query.filter_by(id=request.form.get("quick_win_id", type=int), active=True).first()
if not quick_win:
flash("Dieser Quick-Win ist nicht mehr verfügbar.", "error")
return redirect(request.referrer or url_for("tasks.my_tasks"))
title = quick_win.title
effort = quick_win.effort
else:
selected_ids = request.form.getlist("quick_win_ids")
if selected_ids:
quick_wins = QuickWin.query.filter(QuickWin.id.in_(selected_ids), QuickWin.active.is_(True)).order_by(QuickWin.id.asc()).all()
for quick_win in quick_wins:
task = create_quick_task(quick_win.title, quick_win.effort, current_user, description="Quick-Win")
complete_task(task, current_user.id)
created_titles.append(task.title)
if request.form.get("include_custom") == "1":
form = QuickTaskForm(prefix="quick")
form.effort.choices = [(key, values["label"]) for key, values in config.items()]
if not form.validate_on_submit():
custom_title = (form.title.data or "").strip()
extra_errors: list[str] = []
if not custom_title:
extra_errors.append("Bitte gib für „Sonstiges“ einen Titel ein.")
if not form.effort.data or form.effort.data not in config:
extra_errors.append("Bitte wähle für „Sonstiges“ einen Aufwand aus.")
if not form.validate_on_submit() or extra_errors:
for field_errors in form.errors.values():
for error in field_errors:
flash(error, "error")
for error in extra_errors:
flash(error, "error")
return redirect(request.referrer or url_for("tasks.my_tasks"))
title = form.title.data
effort = form.effort.data
task = create_quick_task(title, effort, current_user, description="Quick-Win")
if quick_action == "complete":
task = create_quick_task(custom_title, form.effort.data, current_user, description="Quick-Win")
complete_task(task, current_user.id)
flash(f"Quick-Win „{task.title}“ wurde direkt als erledigt gespeichert.", "success")
created_titles.append(task.title)
if not created_titles:
flash("Bitte wähle mindestens einen Quick-Win aus.", "error")
return redirect(request.referrer or url_for("tasks.my_tasks"))
if len(created_titles) == 1:
flash(f"Quick-Win „{created_titles[0]}“ wurde als erledigt gespeichert.", "success")
else:
flash(f"Quick-Win „{task.title}“ wurde für dich angelegt.", "success")
flash(f"{len(created_titles)} Quick-Wins wurden als erledigt gespeichert.", "success")
return redirect(request.referrer or url_for("tasks.my_tasks"))

View File

@@ -188,19 +188,32 @@ p {
.app-footer {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
justify-content: space-between;
gap: 14px;
flex-wrap: wrap;
padding: 18px 0 8px;
color: var(--muted);
font-size: 0.88rem;
text-align: center;
text-align: left;
}
.app-footer__left,
.app-footer__right {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.app-footer__right {
margin-left: auto;
}
.app-footer a {
color: inherit;
}
.app-footer span {
.app-footer__left span {
opacity: 0.7;
}
@@ -857,26 +870,28 @@ p {
}
.calendar-task__title {
display: -webkit-box;
overflow: hidden;
display: block;
overflow: visible;
min-width: 0;
font-size: 0.96rem;
line-height: 1.15;
font-weight: 600;
color: var(--text);
word-break: break-word;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-break: normal;
overflow-wrap: break-word;
hyphens: manual;
}
.calendar-task__person {
display: block;
overflow: hidden;
overflow: visible;
min-width: 0;
font-size: 0.74rem;
line-height: 1.2;
white-space: nowrap;
text-overflow: ellipsis;
white-space: normal;
word-break: normal;
overflow-wrap: break-word;
hyphens: manual;
}
.calendar-task--open {
@@ -1035,8 +1050,7 @@ p {
gap: 12px;
}
.quick-win-manage-card,
.quick-win-card {
.quick-win-manage-card {
display: grid;
gap: 12px;
padding: 18px;
@@ -1046,8 +1060,18 @@ p {
}
.quick-win-manage-card {
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
align-items: stretch;
}
.quick-win-manage-form {
display: grid;
gap: 12px;
}
.quick-win-manage-card__actions {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.quick-win-grid {
@@ -1055,44 +1079,138 @@ p {
gap: 12px;
}
.quick-win-card__actions,
.quick-win-custom__body {
.quick-win-dialog-header {
display: grid;
gap: 10px;
grid-template-columns: auto minmax(0, 1fr);
gap: 14px;
align-items: start;
}
.quick-win-card__actions .button,
.quick-win-custom__body .button {
width: 100%;
.quick-win-dialog-header__badge {
width: 52px;
height: 52px;
border-radius: 18px;
display: inline-flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, rgba(37, 99, 235, 0.18), rgba(52, 211, 153, 0.24));
border: 1px solid rgba(132, 152, 190, 0.22);
color: var(--primary-strong);
box-shadow: 0 16px 30px rgba(37, 99, 235, 0.16);
}
.quick-win-dialog-header__badge svg {
width: 24px;
height: 24px;
}
.quick-win-card p,
.quick-win-manage-card p {
color: var(--muted);
}
.quick-win-card--custom {
cursor: pointer;
grid-template-columns: minmax(0, 1fr) auto;
.quick-win-tag-grid {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.quick-win-tag {
position: relative;
min-width: 0;
flex: 0 0 auto;
max-width: 100%;
}
.quick-win-tag input {
position: absolute;
inset: 0;
opacity: 0;
pointer-events: none;
}
.quick-win-tag span {
display: inline-flex;
align-items: center;
list-style: none;
justify-content: center;
min-height: 0;
max-width: 100%;
padding: 10px 16px;
border-radius: 999px;
border: 1px solid rgba(132, 152, 190, 0.22);
background: var(--surface-soft);
color: var(--text);
font-weight: 700;
font-size: 0.97rem;
text-align: center;
line-height: 1.2;
white-space: nowrap;
transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
cursor: pointer;
}
.quick-win-card--custom::-webkit-details-marker {
display: none;
.quick-win-tag input:checked + span {
background: linear-gradient(135deg, rgba(37, 99, 235, 0.18), rgba(52, 211, 153, 0.16));
border-color: rgba(37, 99, 235, 0.34);
color: var(--primary-strong);
box-shadow: 0 16px 28px rgba(37, 99, 235, 0.16);
transform: translateY(-1px);
}
.quick-win-custom {
.quick-win-tag--custom span {
border-style: dashed;
}
.quick-win-tag--custom {
flex-basis: 100%;
}
.quick-win-tag--custom span {
width: fit-content;
}
.quick-win-custom-fields {
display: grid;
gap: 10px;
gap: 14px;
}
.quick-win-custom[open] .quick-win-card--custom {
border-color: rgba(37, 99, 235, 0.24);
.quick-win-custom-fields[hidden] {
display: none !important;
}
.quick-win-custom__body {
padding: 4px 2px 0;
.dialog-actions--stack {
display: grid;
gap: 12px;
}
@media (max-width: 640px) {
.quick-win-dialog-header {
grid-template-columns: 1fr;
}
.quick-win-dialog-header__badge {
width: 48px;
height: 48px;
}
.quick-win-tag-grid {
gap: 10px;
}
.quick-win-tag {
max-width: 100%;
}
.quick-win-tag span {
width: auto;
max-width: 100%;
white-space: normal;
text-align: left;
justify-content: flex-start;
}
.quick-win-tag--custom span {
width: auto;
}
}
.push-box__state {

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--! Font Awesome Pro 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2025 Fonticons, Inc. --><path opacity=".4" fill="currentColor" d="M376 512L448 544L480 616L512 544L584 512L512 480L480 408L448 480L376 512zM408 128L480 160L512 232L544 160L616 128L544 96L512 24L480 96L408 128z"/><path fill="currentColor" d="M160 256L224 112L288 256L432 320L288 384L224 528L160 384L16 320L160 256z"/></svg>

After

Width:  |  Height:  |  Size: 528 B

View File

@@ -7,6 +7,12 @@
const quickTaskDialog = document.getElementById("quickTaskDialog");
const quickTaskOpen = document.getElementById("quickTaskOpen");
const quickTaskClose = document.getElementById("quickTaskClose");
const quickWinsSubmit = document.getElementById("quickWinsSubmit");
const quickWinInputs = document.querySelectorAll("[data-quick-win-input]");
const quickWinCustomToggle = document.querySelector("[data-quick-win-custom-toggle]");
const quickWinCustomFields = document.getElementById("quickWinCustomFields");
const quickWinTitle = document.getElementById("quick-title");
const quickWinEffort = document.getElementById("quick-effort");
document.querySelectorAll("[data-complete-action]").forEach((button) => {
button.addEventListener("click", () => {
@@ -39,6 +45,48 @@
quickTaskClose.addEventListener("click", () => quickTaskDialog.close());
}
function updateQuickWinsState() {
const selectedPresetCount = [...quickWinInputs].filter((input) => input.checked).length;
const customSelected = quickWinCustomToggle?.checked === true;
const totalCount = selectedPresetCount + (customSelected ? 1 : 0);
if (quickWinCustomFields) {
quickWinCustomFields.hidden = !customSelected;
}
if (quickWinTitle) {
quickWinTitle.disabled = !customSelected;
quickWinTitle.required = customSelected;
}
if (quickWinEffort) {
quickWinEffort.disabled = !customSelected;
quickWinEffort.required = customSelected;
}
if (quickWinsSubmit) {
quickWinsSubmit.disabled = totalCount === 0;
quickWinsSubmit.textContent = totalCount <= 1 ? "Quick-Win sichern" : "Quick Wins sichern";
}
}
quickWinInputs.forEach((input) => input.addEventListener("change", updateQuickWinsState));
if (quickWinCustomToggle) {
quickWinCustomToggle.addEventListener("change", updateQuickWinsState);
}
updateQuickWinsState();
if (quickTaskDialog) {
quickTaskDialog.addEventListener("close", () => {
const quickWinsForm = document.getElementById("quickWinsForm");
if (!quickWinsForm) {
return;
}
quickWinsForm.reset();
updateQuickWinsState();
});
}
const pushButton = document.getElementById("pushToggle");
const pushHint = document.getElementById("pushHint");
const vapidKey = document.body.dataset.pushKey;

View File

@@ -88,9 +88,14 @@
</main>
<footer class="app-footer">
<a href="https://git.hnz.io/hnzio/putzliga/releases" target="_blank" rel="noreferrer">Version {{ app_version }}</a>
<span>·</span>
<a href="https://hnz.io" target="_blank" rel="noreferrer">(c) 2026 @hnz.io</a>
<div class="app-footer__left">
<a href="https://git.hnz.io/hnzio/putzliga/releases" target="_blank" rel="noreferrer">Version {{ app_version }}</a>
<span>·</span>
<span>Made with ❤️ in Göttingen.</span>
</div>
<div class="app-footer__right">
<a href="https://hnz.io" target="_blank" rel="noreferrer">© 2026 @ hnz.io</a>
</div>
</footer>
</div>
</div>
@@ -123,54 +128,43 @@
</dialog>
<dialog class="complete-dialog" id="quickTaskDialog">
<div class="complete-dialog__surface complete-dialog__surface--task">
<p class="eyebrow">Quick-Wins</p>
<h2>Schnell etwas abhaken</h2>
<p class="muted">Alle Quick-Wins sind für das ganze Team sichtbar. Für „Sonstiges“ kannst du Titel und Aufwand frei wählen.</p>
<div class="quick-win-grid">
{% for quick_win in quick_wins %}
<article class="quick-win-card">
<div>
<strong>{{ quick_win.title }}</strong>
<p>{{ quick_task_config[quick_win.effort].label }}</p>
</div>
<form method="post" action="{{ url_for('tasks.quick_create') }}" class="quick-win-card__actions">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<input type="hidden" name="quick_mode" value="preset">
<input type="hidden" name="quick_win_id" value="{{ quick_win.id }}">
<button type="submit" class="button button--secondary" name="quick_action" value="save">Speichern</button>
<button type="submit" class="button" name="quick_action" value="complete">Direkt erledigt</button>
</form>
</article>
{% endfor %}
<details class="quick-win-custom">
<summary class="quick-win-card quick-win-card--custom">
<div>
<strong>Sonstiges (bitte auch nutzen)</strong>
<p>Eigener Titel und freier Aufwand</p>
</div>
{{ nav_icon('plus') }}
</summary>
<form method="post" action="{{ url_for('tasks.quick_create') }}" class="quick-win-custom__body">
{{ quick_task_form.hidden_tag() }}
<input type="hidden" name="quick_mode" value="custom">
<div class="field">
{{ quick_task_form.title.label }}
{{ quick_task_form.title(placeholder="Zum Beispiel: Flur kurz aufräumen") }}
</div>
<div class="field">
{{ quick_task_form.effort.label }}
{{ quick_task_form.effort() }}
</div>
<div class="dialog-actions">
<button type="submit" class="button" name="quick_action" value="save">Aufgabe speichern</button>
<button type="submit" class="button button--secondary" name="quick_action" value="complete">Aufgabe als erledigt speichern</button>
</div>
</form>
</details>
<form method="post" action="{{ url_for('tasks.quick_create') }}" class="complete-dialog__surface complete-dialog__surface--task" id="quickWinsForm">
{{ quick_task_form.hidden_tag() }}
<div class="quick-win-dialog-header">
<span class="quick-win-dialog-header__badge" aria-hidden="true">{{ icon_svg('quick-wins-sparkles')|safe }}</span>
<div>
<p class="eyebrow">Quick-Wins</p>
<h2>Schnell Punkte abstauben</h2>
<p class="muted">Alle Quick-Wins sind für das ganze Team sichtbar. Für „Sonstiges“ kannst du Titel und Aufwand frei wählen.</p>
</div>
</div>
<button type="button" class="button button--ghost" id="quickTaskClose">Abbrechen</button>
</div>
<div class="quick-win-tag-grid">
{% for quick_win in quick_wins %}
<label class="quick-win-tag" data-quick-win-tag>
<input type="checkbox" name="quick_win_ids" value="{{ quick_win.id }}" data-quick-win-input>
<span>{{ quick_win.title }}</span>
</label>
{% endfor %}
<label class="quick-win-tag quick-win-tag--custom" data-quick-win-tag>
<input type="checkbox" name="include_custom" value="1" data-quick-win-custom-toggle>
<span>Sonstiges</span>
</label>
</div>
<div class="quick-win-custom-fields" id="quickWinCustomFields" hidden>
<div class="field">
{{ quick_task_form.title.label }}
{{ quick_task_form.title(placeholder="Zum Beispiel: Flur kurz aufräumen", required=False) }}
</div>
<div class="field">
{{ quick_task_form.effort.label }}
{{ quick_task_form.effort(required=False) }}
</div>
</div>
<div class="dialog-actions dialog-actions--stack">
<button type="submit" class="button button--wide" id="quickWinsSubmit" disabled>Quick-Win sichern</button>
<button type="button" class="button button--ghost button--wide" id="quickTaskClose">Abbrechen</button>
</div>
</form>
</dialog>
<form method="post" class="sr-only" id="completeDialogForm">

View File

@@ -35,20 +35,39 @@
<article class="panel">
<p class="eyebrow">Direkt sichtbar</p>
<h2>Aktive Quick-Wins</h2>
<h2>Aktive Quick-Wins bearbeiten</h2>
<div class="quick-win-list">
{% for quick_win in quick_wins %}
<article class="quick-win-manage-card">
<div>
<strong>{{ quick_win.title }}</strong>
<p class="muted">{{ quick_task_config[quick_win.effort].label }} · von {{ quick_win.created_by_user.name }}</p>
</div>
{% if quick_win.created_by_user_id == current_user.id or current_user.is_admin %}
<form method="post" action="{{ url_for('settings.delete_quick_win', quick_win_id=quick_win.id) }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="button button--ghost">Entfernen</button>
</form>
{% endif %}
<form method="post" action="{{ url_for('settings.update_quick_win', quick_win_id=quick_win.id) }}" class="quick-win-manage-form">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<div class="field">
<label for="quick-win-title-{{ quick_win.id }}">Titel</label>
<input id="quick-win-title-{{ quick_win.id }}" type="text" name="title" value="{{ quick_win.title }}" minlength="2" maxlength="160" required>
</div>
<div class="field">
<label for="quick-win-effort-{{ quick_win.id }}">Aufwand</label>
<select id="quick-win-effort-{{ quick_win.id }}" name="effort" required>
{% for effort_key, effort_values in quick_task_config.items() %}
<option value="{{ effort_key }}" {% if quick_win.effort == effort_key %}selected{% endif %}>{{ effort_values.label }}</option>
{% endfor %}
</select>
</div>
<p class="muted">Von {{ quick_win.created_by_user.name }}</p>
<div class="quick-win-manage-card__actions">
<button type="submit" class="button button--secondary">Speichern</button>
{% if quick_win.created_by_user_id == current_user.id or current_user.is_admin %}
<button
type="submit"
class="button button--ghost"
formaction="{{ url_for('settings.delete_quick_win', quick_win_id=quick_win.id) }}"
formmethod="post"
>
Entfernen
</button>
{% endif %}
</div>
</form>
</article>
{% else %}
<div class="empty-state">Noch keine Quick-Wins angelegt. Der erste steht gleich oben bereit.</div>

View File

@@ -71,14 +71,14 @@
<div class="calendar-mobile-day__tasks">
{% for task in group.tasks %}
<a href="{{ url_for('tasks.edit', task_id=task.id) }}" class="calendar-task calendar-task--{{ task.status }}">
<strong class="calendar-task__title">{{ task.title }}</strong>
<small class="calendar-task__person">
<strong class="calendar-task__title" lang="de">{{ task.title|hyphenate_de }}</strong>
<small class="calendar-task__person" lang="de">
{% if task.completed_by_user %}
{{ task.completed_by_user.name }}
{{ task.completed_by_user.name|hyphenate_de }}
{% elif task.assigned_user %}
{{ task.assigned_user.name }}
{{ task.assigned_user.name|hyphenate_de }}
{% else %}
Ohne Zuweisung
{{ 'Ohne Zuweisung'|hyphenate_de }}
{% endif %}
</small>
</a>
@@ -104,14 +104,14 @@
<div class="calendar-day__tasks">
{% for task in tasks_by_day.get(day, []) %}
<a href="{{ url_for('tasks.edit', task_id=task.id) }}" class="calendar-task calendar-task--{{ task.status }}">
<strong class="calendar-task__title">{{ task.title }}</strong>
<small class="calendar-task__person">
<strong class="calendar-task__title" lang="de">{{ task.title|hyphenate_de }}</strong>
<small class="calendar-task__person" lang="de">
{% if task.completed_by_user %}
{{ task.completed_by_user.name }}
{{ task.completed_by_user.name|hyphenate_de }}
{% elif task.assigned_user %}
{{ task.assigned_user.name }}
{{ task.assigned_user.name|hyphenate_de }}
{% else %}
Ohne Zuweisung
{{ 'Ohne Zuweisung'|hyphenate_de }}
{% endif %}
</small>
</a>