Bernard Siebens
0ecdeac354
News gains a PENDING_REVIEW status between draft and published. A non-editor author (can_add_news but not can_publish_news -- a coach_manager, not an ADMIN/EDITOR) gets a "Send for review" button instead of Publish; an editor/admin always sees Publish directly, no review step. Submitting notifies every ADMIN/EDITOR in-app only (see notify_members' new send_email=False) -- a review queue that emailed on every submission would get noisy fast. The notification area itself: a topbar bell (badge + dropdown, same <details>/<summary> convention as the sidebar's user-menu, generalised to a shared .dismissable-details close handler) visible on every page, plus a fuller "Notifications" card on the dashboard, both fed by a new notification_bell context processor. "Mark all read" clears the signed-in staff member's own unread notifications for this club. This is the reusable notification system's first consumer beyond news publishing itself -- validates that notify_members()/Notification generalise the way they were meant to. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01ECGMEwrc2k4D8VQuwjstj9
179 lines
12 KiB
HTML
179 lines
12 KiB
HTML
{% load i18n lucide ui %}
|
|
{% comment %}
|
|
The D8 "Editor" pane -- shared by news_list.html's split-view preview and
|
|
news_detail.html's standalone permalink page, so this article/photos/
|
|
publish markup exists in exactly one place. Expects the context both
|
|
views already build identically: news_item, can_edit, can_publish,
|
|
publish_form, photo_upload_form. Pass show_header=False from a page that
|
|
already renders its own status/Edit/Publish row elsewhere (news_detail.html
|
|
puts them in the topbar, same as every other detail page in this app) --
|
|
news_list.html's split view has no such per-item topbar, so it needs this
|
|
include to carry that row itself.
|
|
{% endcomment %}
|
|
<div class="flex flex-col gap-4">
|
|
{% if show_header|default:True %}
|
|
<div class="flex flex-wrap items-center justify-between gap-2 border-b border-line pb-3">
|
|
<div class="flex flex-wrap items-center gap-2">
|
|
{% if news_item.status == "draft" %}
|
|
<span class="badge">{% trans "Draft" %}</span>
|
|
{% elif news_item.status == "pending_review" %}
|
|
<span class="badge badge-warning">{% trans "Pending review" %}</span>
|
|
{% elif news_item.is_scheduled %}
|
|
<span class="badge badge-info">{% blocktrans with date=news_item.published_at %}Scheduled for {{ date }}{% endblocktrans %}</span>
|
|
{% else %}
|
|
<span class="badge badge-success">{% blocktrans with date=news_item.published_at %}Published {{ date }}{% endblocktrans %}</span>
|
|
{% endif %}
|
|
<span class="font-mono text-xs text-dim">{{ news_item.get_visibility_display }}</span>
|
|
</div>
|
|
<div class="flex flex-wrap items-center gap-2">
|
|
{% if can_edit %}
|
|
<a class="btn btn-outline btn-sm gap-2" href="{% url 'management:news_update' news_item.pk %}">{% lucide "pencil" size=14 %} {% trans "Edit" %}</a>
|
|
<button class="btn btn-outline btn-error btn-sm gap-2" type="button" onclick="document.getElementById('delete_news_modal').showModal()">{% lucide "trash-2" size=14 %} {% trans "Delete" %}</button>
|
|
{% endif %}
|
|
{% if can_publish %}
|
|
{% if news_item.status == "published" %}
|
|
<button class="btn btn-outline btn-warning btn-sm gap-2" type="button" onclick="document.getElementById('unpublish_modal').showModal()">{% lucide "eye-off" size=14 %} {% trans "Unpublish" %}</button>
|
|
{% else %}
|
|
<button class="btn btn-primary btn-sm gap-2" type="button" onclick="document.getElementById('publish_modal').showModal()">{% lucide "upload" size=14 %} {% trans "Publish" %}</button>
|
|
{% endif %}
|
|
{% elif can_edit and news_item.status == "draft" %}
|
|
{# Whoever can edit but not publish (a coach_manager, not an editor/admin -- see club.services.access.can_add_news vs can_publish_news) hands it off instead. #}
|
|
<form method="post" action="{% url 'management:news_submit_for_review' news_item.pk %}">
|
|
{% csrf_token %}
|
|
<button class="btn btn-primary btn-sm gap-2" type="submit">{% lucide "send" size=14 %} {% trans "Send for review" %}</button>
|
|
</form>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="card overflow-hidden">
|
|
{% if news_item.main_photo %}
|
|
<img class="h-[190px] w-full object-cover" src="{{ news_item.main_photo.image.url }}" alt="">
|
|
{% endif %}
|
|
<div class="card-body">
|
|
<div class="mb-3 flex flex-wrap items-center justify-between gap-3">
|
|
<div class="flex items-center gap-1 rounded-full bg-steel p-1">
|
|
<button type="button" class="news-lang-btn active" data-lang="nl">{% trans "Dutch" %}</button>
|
|
<button type="button" class="news-lang-btn" data-lang="en">{% trans "English" %}</button>
|
|
</div>
|
|
{% if not news_item.title_en and not news_item.body_en %}
|
|
<span class="news-lang-note hidden font-mono text-xs text-dim" data-lang-note="en">{% trans "No English translation yet -- showing Dutch." %}</span>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% if news_item.teams.all %}
|
|
<div class="mb-1 flex flex-wrap gap-2">
|
|
{% for team in news_item.teams.all %}
|
|
<span class="badge badge-neutral">{{ team.short_name }}</span>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="mb-1 font-display text-xs font-bold tracking-[.14em] text-club uppercase">{% trans "Club-wide" %}</div>
|
|
{% endif %}
|
|
|
|
<div class="news-lang-content" data-lang-content="nl">
|
|
<h1 class="font-display text-3xl leading-[1.05] font-extrabold text-ink uppercase md:text-4xl">{{ news_item.title }}</h1>
|
|
<div class="my-3 h-[3px] w-14 bg-club"></div>
|
|
<p class="whitespace-pre-line text-[15px] leading-relaxed text-ink">{{ news_item.body }}</p>
|
|
</div>
|
|
<div class="news-lang-content hidden" data-lang-content="en">
|
|
<h1 class="font-display text-3xl leading-[1.05] font-extrabold text-ink uppercase md:text-4xl">{{ news_item.effective_title_en }}</h1>
|
|
<div class="my-3 h-[3px] w-14 bg-club"></div>
|
|
<p class="whitespace-pre-line text-[15px] leading-relaxed text-ink">{{ news_item.effective_body_en }}</p>
|
|
</div>
|
|
|
|
{% if news_item.created_by %}
|
|
<div class="mt-2 flex items-center gap-2.5 border-t border-line pt-3.5 text-sm text-muted">
|
|
<span class="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-steel font-display text-xs font-extrabold text-white">{{ news_item.created_by.first_name|slice:":1" }}{{ news_item.created_by.last_name|slice:":1" }}</span>
|
|
{% blocktrans with name=news_item.created_by %}Posted by {{ name }}{% endblocktrans %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<div class="flex flex-wrap items-center justify-between gap-2">
|
|
<h2 class="card-title">{% lucide "image" size=18 %} {% trans "Photos" %}</h2>
|
|
{% if can_edit %}
|
|
<button class="btn btn-outline btn-sm gap-2" type="button" onclick="document.getElementById('add_photos_modal').showModal()">{% lucide "image-plus" size=14 %} {% trans "Add photos" %}</button>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="mt-2 grid grid-cols-2 gap-4 md:grid-cols-4">
|
|
{% for photo in news_item.photos.all %}
|
|
<div class="relative">
|
|
<img class="aspect-square w-full rounded-box border border-line object-cover" src="{{ photo.image.url }}" alt="">
|
|
{% if photo.is_main %}
|
|
<span class="badge badge-success badge-sm absolute top-1.5 left-1.5">{% trans "Main" %}</span>
|
|
{% endif %}
|
|
{% if can_edit %}
|
|
<div class="mt-1 flex flex-wrap gap-1">
|
|
{% if not photo.is_main %}
|
|
<form method="post" action="{% url 'management:news_photo_set_main' news_item.pk photo.pk %}">
|
|
{% csrf_token %}
|
|
<button class="btn btn-outline btn-xs gap-1" type="submit">{% lucide "star" size=12 %} {% trans "Set main" %}</button>
|
|
</form>
|
|
{% endif %}
|
|
<button class="btn btn-outline btn-error btn-xs gap-1" type="button" onclick="document.getElementById('{{ photo.pk|dom_id:"delete_photo_modal" }}').showModal()">{% lucide "trash-2" size=12 %} {% trans "Delete" %}</button>
|
|
</div>
|
|
{% url 'management:news_photo_delete' news_item.pk photo.pk as delete_photo_url %}
|
|
{% trans "Delete photo" as delete_photo_title %}
|
|
{% trans "This photo will be permanently removed." as delete_photo_body %}
|
|
{% trans "Delete" as delete_label %}
|
|
{% include "controlpanel/_confirm_modal.html" with modal_id=photo.pk|dom_id:"delete_photo_modal" title=delete_photo_title body=delete_photo_body action_url=delete_photo_url submit_label=delete_label submit_icon="trash-2" %}
|
|
{% endif %}
|
|
</div>
|
|
{% empty %}
|
|
<p class="col-span-full text-sm text-muted">{% trans "No photos yet." %}</p>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% if can_edit %}
|
|
{% trans "Add photos" as add_photos_label %}
|
|
{% url 'management:news_photo_upload' news_item.pk as add_photos_url %}
|
|
{% include "controlpanel/_modal_form.html" with modal_id="add_photos_modal" title=add_photos_label form=photo_upload_form action_url=add_photos_url submit_label=add_photos_label submit_icon="image-plus" %}
|
|
|
|
{% trans "Delete news item" as delete_news_title %}
|
|
{% blocktrans asvar delete_news_body %}Delete “{{ news_item }}”? Its photos go with it. This cannot be undone.{% endblocktrans %}
|
|
{% trans "Delete" as delete_label %}
|
|
{% url 'management:news_delete' news_item.pk as delete_news_url %}
|
|
{% include "controlpanel/_confirm_modal.html" with modal_id="delete_news_modal" title=delete_news_title body=delete_news_body action_url=delete_news_url submit_label=delete_label %}
|
|
{% endif %}
|
|
|
|
{% if can_publish %}
|
|
{% if news_item.status == "draft" %}
|
|
{% trans "Publish" as publish_label %}
|
|
{% url 'management:news_publish' news_item.pk as publish_url %}
|
|
{% trans "Leave as now to publish immediately, or pick a future date/time to schedule it." as publish_blurb %}
|
|
{% include "controlpanel/_modal_form.html" with modal_id="publish_modal" title=publish_label form=publish_form action_url=publish_url submit_label=publish_label submit_icon="upload" blurb=publish_blurb %}
|
|
{% else %}
|
|
{% trans "Unpublish" as unpublish_label %}
|
|
{% blocktrans asvar unpublish_body %}This pulls “{{ news_item }}” back to a draft. It won't be visible anywhere until it's published again.{% endblocktrans %}
|
|
{% url 'management:news_unpublish' news_item.pk as unpublish_url %}
|
|
{% include "controlpanel/_confirm_modal.html" with modal_id="unpublish_modal" title=unpublish_label body=unpublish_body action_url=unpublish_url submit_label=unpublish_label submit_icon="eye-off" %}
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
<script>
|
|
(() => {
|
|
// Scoped to this include's own root, not document-wide -- news_list.html
|
|
// can end up with two copies of this template's ids on the page across
|
|
// navigations only in theory (each request only ever renders one
|
|
// selected item), but querying from a scope root costs nothing and
|
|
// avoids ever wiring the same listener twice if that assumption changes.
|
|
document.querySelectorAll(".news-lang-btn").forEach((button) => {
|
|
button.addEventListener("click", () => {
|
|
const lang = button.dataset.lang;
|
|
document.querySelectorAll(".news-lang-btn").forEach((b) => b.classList.toggle("active", b === button));
|
|
document.querySelectorAll(".news-lang-content").forEach((el) => el.classList.toggle("hidden", el.dataset.langContent !== lang));
|
|
document.querySelectorAll(".news-lang-note").forEach((el) => el.classList.toggle("hidden", el.dataset.langNote !== lang));
|
|
});
|
|
});
|
|
})();
|
|
</script>
|