victor/claims-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve payment detail panel on dashboard

Browse Source
This commit is contained in:
Victor Andersson
2025-11-09 12:16:32 +01:00
parent a204bc0b45
commit e23f9e909d
1 changed files with 40 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
claims/templates/claims/dashboard.html
View File

@@ -139,28 +139,56 @@
</div>
{% if claim.status == 'approved' %}
<div class="mx-6 mt-4 rounded-2xl border border-green-100 bg-green-50 px-6 py-4 text-sm text-green-900">
<div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
<div>
<p class="text-xs font-semibold uppercase tracking-wide text-green-600">{% trans "Sammanfattning" %}</p>
<p class="text-lg font-semibold text-green-900">{{ claim.full_name }}</p>
<p class="text-sm text-green-800">{% trans "Belopp" %}: <strong>{{ claim.amount }} {{ claim.currency }}</strong> · {% trans "Konto" %}: <span class="font-mono">{{ claim.account_number }}</span></p>
</div>
<div class="mx-6 mt-4 grid gap-4 rounded-3xl border border-green-100 bg-green-50 px-6 py-4 text-sm text-green-900 md:grid-cols-[2fr,1fr]">
<div class="space-y-3">
<p class="text-xs font-semibold uppercase tracking-wide text-green-600">{% trans "Utbetalningsdetaljer" %}</p>
<dl class="grid gap-2 text-sm text-green-900 md:grid-cols-2">
<div>
<dt class="text-xs uppercase tracking-wide text-green-700">{% trans "Belopp" %}</dt>
<dd class="text-lg font-semibold">{{ claim.amount }} {{ claim.currency }}</dd>
</div>
<div>
<dt class="text-xs uppercase tracking-wide text-green-700">{% trans "Kontonummer" %}</dt>
<dd class="font-mono text-base">{{ claim.account_number }}</dd>
</div>
<div>
<dt class="text-xs uppercase tracking-wide text-green-700">{% trans "Referens (Claim ID)" %}</dt>
<dd class="font-semibold">#{{ claim.id }}</dd>
</div>
<div>
<dt class="text-xs uppercase tracking-wide text-green-700">{% trans "Skapad" %}</dt>
<dd>{{ claim.created_at|date:"Y-m-d H:i" }}</dd>
</div>
</dl>
<p class="text-xs text-green-700">{% trans "Använd referens och belopp när du lägger upp betalningen i banken – hjälper att undvika dubbletter." %}</p>
</div>
<div class="flex flex-col items-start gap-3 md:items-end">
{% if payments_enabled %}
{% if claim.is_paid %}
<p class="text-xs uppercase tracking-wide text-emerald-600">{% trans "Markerad som betald" %}</p>
<div class="rounded-2xl bg-emerald-100 px-4 py-3 text-xs font-semibold uppercase tracking-wide text-emerald-800">
{% trans "Markerad som betald" %}
<div class="text-[11px] font-normal text-emerald-700">
{{ claim.paid_at|date:"Y-m-d H:i" }}
{% if claim.paid_by %}
· {% trans "av" %} {{ claim.paid_by.get_username }}
{% endif %}
</div>
</div>
{% else %}
<form method="post" onsubmit="return confirm('{% trans "Är du säker på att du har lagt upp betalningen? Markera endast som betald om beloppet skickas till banken." %}');">
<form method="post" class="w-full max-w-xs" onsubmit="return confirm('{% trans "Är du säker på att du har lagt upp betalningen? Markera endast som betald om beloppet skickas till banken." %}');">
{% csrf_token %}
<input type="hidden" name="action_type" value="payment">
<input type="hidden" name="payment_claim_id" value="{{ claim.id }}">
<button type="submit" class="inline-flex items-center gap-2 rounded-full bg-emerald-600 px-4 py-2 text-xs font-semibold uppercase tracking-wide text-white transition hover:bg-emerald-700">
{% trans "Betala" %}
<button type="submit" class="flex w-full items-center justify-center gap-2 rounded-2xl bg-emerald-600 px-4 py-3 text-xs font-semibold uppercase tracking-wide text-white transition hover:bg-emerald-700">
{% trans "Markera som betald" %}
</button>
</form>
<p class="text-[11px] text-green-700">{% trans "Dubbelkolla belopp och kontonummer ovan innan du bekräftar." %}</p>
{% endif %}
{% else %}
<p class="text-xs text-green-700">{% trans "Intern betalningshantering är av – markera betalning i ekonomisystemet." %}</p>
<p class="rounded-2xl bg-white/70 px-4 py-3 text-xs text-green-800">
{% trans "Intern betalningshantering är av – markera betalning i ekonomisystemet och resetta status vid behov." %}
</p>
{% endif %}
</div>
</div>