update design for bill_create
This commit is contained in:
@@ -51,7 +51,7 @@ class BillCreateForm(forms.ModelForm):
|
|||||||
"amount": "Betrag (EUR)",
|
"amount": "Betrag (EUR)",
|
||||||
"purpose": "Verwendungszweck",
|
"purpose": "Verwendungszweck",
|
||||||
"affiliation": "Abrechnungsbudget",
|
"affiliation": "Abrechnungsbudget",
|
||||||
"payer": "Wie wurde die Rechnung bezahlt?",
|
"payer": "Ursprüngliche Bezahlmethode",
|
||||||
"only_digital": "Ich habe nur eine digitale Rechnung.",
|
"only_digital": "Ich habe nur eine digitale Rechnung.",
|
||||||
"file_field": "Rechnung hochladen (PDF)",
|
"file_field": "Rechnung hochladen (PDF)",
|
||||||
"comment": "Kommentar",
|
"comment": "Kommentar",
|
||||||
@@ -74,8 +74,9 @@ class BillCreateForm(forms.ModelForm):
|
|||||||
self.fields["bill_creator"].initial = member
|
self.fields["bill_creator"].initial = member
|
||||||
self.fields["bill_creator"].disabled = True
|
self.fields["bill_creator"].disabled = True
|
||||||
|
|
||||||
self.fields["invoice"].placeholder = "Firmenname\nStraße\nPLZ Ort"
|
self.fields["invoice"].placeholder = "Firmenname\nStraße\nPLZ und Ort"
|
||||||
self.fields["invoice"].rows = 3
|
self.fields["invoice"].cols = 30
|
||||||
|
self.fields["invoice"].rows = 4
|
||||||
|
|
||||||
# bank data fields
|
# bank data fields
|
||||||
self.fields["payer"].autofocus = True
|
self.fields["payer"].autofocus = True
|
||||||
|
|||||||
@@ -13,5 +13,5 @@
|
|||||||
{% if field.field.autofocus %}autofocus{% endif %}
|
{% if field.field.autofocus %}autofocus{% endif %}
|
||||||
class="rounded border-gray-300 dark:border-none text-proprietary shadow-sm focus:border-blue-300 focus:ring focus:ring-offset-0 focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
class="rounded border-gray-300 dark:border-none text-proprietary shadow-sm focus:border-blue-300 focus:ring focus:ring-offset-0 focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
||||||
>
|
>
|
||||||
<span class="ml-2 text-gray-700 dark:text-gray-200">{{ field.label }} {% if not field.field.required %}(optional){% endif %}</span>
|
<span class="text-gray-700 dark:text-gray-200">{{ field.label }} {% if not field.field.required %}(optional){% endif %}</span>
|
||||||
</label>
|
</label>
|
||||||
|
|||||||
@@ -1,25 +0,0 @@
|
|||||||
<label class="block">
|
|
||||||
<span class="text-gray-700 dark:text-gray-200">{{ field.label }} {% if not field.field.required %}(optional){% endif %}</span>
|
|
||||||
{% if field.errors %}
|
|
||||||
<div class="alert alert-danger">
|
|
||||||
<div class="alert-body">{{ field.errors }}</div>
|
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<div class="flex flex-col md:flex-row gap-y-2 md:gap-y-0 md:gap-x-2">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
name="{{ field.name }}"
|
|
||||||
{% if field.value %}value="{{ field.value }}"{% endif %}
|
|
||||||
{% if field.field.required %}required{% endif %}
|
|
||||||
{% if field.field.disabled %}disabled{% endif %}
|
|
||||||
{% if field.field.autofocus %}autofocus{% endif %}
|
|
||||||
class="mt-1 block w-full disabled:bg-gray-200 rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
|
||||||
>
|
|
||||||
<a href="" class="block btn btn-primary md:flex-grow lg:flex-grow-0"><i class="fa-solid fa-plus-square my-2"></i></a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{% if field.help_text %}
|
|
||||||
<span class="text-gray-700 dark:text-gray-200">{{ field.help_text }}</span>
|
|
||||||
{% endif %}
|
|
||||||
</label>
|
|
||||||
@@ -11,6 +11,7 @@
|
|||||||
{% if field.field.disabled %}disabled{% endif %}
|
{% if field.field.disabled %}disabled{% endif %}
|
||||||
{% if field.field.autofocus %}autofocus{% endif %}
|
{% if field.field.autofocus %}autofocus{% endif %}
|
||||||
{% if field.field.placeholder %}placeholder="{{ field.field.placeholder }}"{% endif %}
|
{% if field.field.placeholder %}placeholder="{{ field.field.placeholder }}"{% endif %}
|
||||||
|
{% if field.field.cols %}cols="{{ field.field.cols }}"{% endif %}
|
||||||
{% if field.field.rows %}rows="{{ field.field.rows }}"{% endif %}
|
{% if field.field.rows %}rows="{{ field.field.rows }}"{% endif %}
|
||||||
class="mt-1 block w-full disabled:bg-gray-200 rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
class="mt-1 block w-full disabled:bg-gray-200 rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
||||||
>{% if field.value %}{{ field.value }}{% endif %}</textarea>
|
>{% if field.value %}{{ field.value }}{% endif %}</textarea>
|
||||||
|
|||||||
@@ -7,60 +7,103 @@
|
|||||||
<main class="container mx-auto w-full px-4 my-8 flex-1">
|
<main class="container mx-auto w-full px-4 my-8 flex-1">
|
||||||
<h1 class="page-title">Neue Rechnung einreichen</h1>
|
<h1 class="page-title">Neue Rechnung einreichen</h1>
|
||||||
<div class="w-full h-full flex-1 flex justify-center items-center">
|
<div class="w-full h-full flex-1 flex justify-center items-center">
|
||||||
<form action="" enctype="multipart/form-data" method="POST" class="w-full max-w-xs sm:max-w-prose sm:px-28 sm:py-4 grid grid-cols-1 gap-y-3 sm:gap-y-6 text-gray-900">
|
<form action="" enctype="multipart/form-data" method="POST" class="multiSectionForm max-w-2xl">
|
||||||
{% csrf_token %}
|
{% csrf_token %}
|
||||||
{% include "baseform/non_field_errors.html" %}
|
{% include "baseform/non_field_errors.html" %}
|
||||||
|
|
||||||
{% include "baseform/select.html" with field=form.bill_creator %}
|
<section>
|
||||||
|
<h2>Bankdaten</h2>
|
||||||
|
<small>Angaben zu den Bankdaten für die Rückerstattung des Rechnungsbetrags.</small>
|
||||||
|
|
||||||
<hr>
|
<div class="grid grid-cols-1 gap-x-6 gap-y-6 sm:grid-cols-6">
|
||||||
<span class="text-gray-700 dark:text-gray-200">Bankdaten</span>
|
<div class="sm:col-span-3">
|
||||||
|
{% include "baseform/select.html" with field=form.payer %}
|
||||||
{% include "baseform/select.html" with field=form.payer %}
|
|
||||||
{% include "baseform/text_with_suggestions.html" with field=form.name_text %}
|
|
||||||
{% include "baseform/text.html" with field=form.iban_text %}
|
|
||||||
{% include "baseform/text.html" with field=form.bic_text %}
|
|
||||||
|
|
||||||
<hr>
|
|
||||||
<span class="text-gray-700 dark:text-gray-200">Rechnung</span>
|
|
||||||
|
|
||||||
{% include "baseform/date.html" with field=form.date %}
|
|
||||||
{% include "baseform/textarea.html" with field=form.invoice %}
|
|
||||||
{% include "baseform/text.html" with field=form.purpose %}
|
|
||||||
|
|
||||||
<label class="block">
|
|
||||||
<span class="text-gray-700 dark:text-gray-200">{{ form.amount.label }}</span>
|
|
||||||
{% if form.amount.errors %}
|
|
||||||
<div class="alert alert-danger">
|
|
||||||
<div class="alert-body">{{ form.amount.errors }}</div>
|
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
<div class="sm:col-span-4">
|
||||||
<input
|
{% include "baseform/text.html" with field=form.name_text %}
|
||||||
type="number"
|
</div>
|
||||||
value={{ form.amount.value }}
|
<div class="sm:col-span-3">
|
||||||
min="0.00"
|
{% include "baseform/text.html" with field=form.iban_text %}
|
||||||
step="0.01"
|
</div>
|
||||||
name="amount"
|
<div class="sm:col-span-3">
|
||||||
class="mt-1 block w-full rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
{% include "baseform/text.html" with field=form.bic_text %}
|
||||||
required
|
</div>
|
||||||
>
|
<div class="col-span-full">
|
||||||
</label>
|
<label>
|
||||||
|
<input type="checkbox">
|
||||||
|
<span>Bankdaten speichern.</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<h2>Rechnungsdetails</h2>
|
||||||
|
<small>Details zur ursprünglichen bereits bezahlten Rechnung angeben.</small>
|
||||||
|
|
||||||
{% include "baseform/checkbox.html" with field=form.only_digital %}
|
<div class="grid grid-cols-1 gap-x-6 gap-y-6 sm:grid-cols-6">
|
||||||
{% include "baseform/file.html" with field=form.file_field %}
|
<div class="sm:col-span-4">
|
||||||
|
{% include "baseform/textarea.html" with field=form.invoice %}
|
||||||
|
</div>
|
||||||
|
<div class="col-span-full">
|
||||||
|
{% include "baseform/text.html" with field=form.purpose %}
|
||||||
|
</div>
|
||||||
|
<div class="sm:col-span-3">
|
||||||
|
{% include "baseform/date.html" with field=form.date %}
|
||||||
|
</div>
|
||||||
|
<div class="sm:col-span-2">
|
||||||
|
<label>
|
||||||
|
<span class="text-gray-700 dark:text-gray-200">{{ form.amount.label }}</span>
|
||||||
|
{% if form.amount.errors %}
|
||||||
|
<div class="alert alert-danger">
|
||||||
|
<div class="alert-body">{{ form.amount.errors }}</div>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
name="amount"
|
||||||
|
value={{ form.amount.value }}
|
||||||
|
required
|
||||||
|
min="0.00"
|
||||||
|
step="0.01"
|
||||||
|
placeholder="123,99"
|
||||||
|
class="mt-1 block w-full rounded-md border-gray-300 dark:border-none shadow-sm focus:border-none focus:ring focus:ring-blue-200 dark:focus:ring-sky-700 focus:ring-opacity-50"
|
||||||
|
>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-full">
|
||||||
|
{% include "baseform/file.html" with field=form.file_field %}
|
||||||
|
</div>
|
||||||
|
<div class="col-span-full">
|
||||||
|
{% include "baseform/checkbox.html" with field=form.only_digital %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<h2>Beschlusslage</h2>
|
||||||
|
<small>Informationen zur Beschlusslage dieser Rechnung.</small>
|
||||||
|
|
||||||
<hr>
|
<div class="grid grid-cols-1 gap-x-6 gap-y-6 sm:grid-cols-6">
|
||||||
<span class="text-gray-700 dark:text-gray-200">Beschlusslage</span>
|
<div class="sm:col-span-3">
|
||||||
|
{% include "baseform/select.html" with field=form.affiliation %}
|
||||||
|
</div>
|
||||||
|
<div class="sm:col-span-3">
|
||||||
|
{% include "baseform/text.html" with field=form.resolution_text %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<h2>Kommentar</h2>
|
||||||
|
<small>Erfordert etwas zusätzlichen Erklärungsbedarf oder sollen nachträglich Informationen bearbeitet werden?</small>
|
||||||
|
|
||||||
{% include "baseform/select.html" with field=form.affiliation %}
|
<div class="grid grid-cols-1 gap-x-6 gap-y-6 sm:grid-cols-6">
|
||||||
{% include "baseform/text.html" with field=form.resolution_text %}
|
<div class="col-span-full">
|
||||||
|
{% include "baseform/textarea.html" with field=form.comment %}
|
||||||
<hr>
|
</div>
|
||||||
{% include "baseform/textarea.html" with field=form.comment %}
|
</div>
|
||||||
|
</section>
|
||||||
<div class="flex flex-col-reverse sm:flex-row gap-3 justify-end pt-4 sm:pt-0">
|
<section class="flex justify-end">
|
||||||
<input type="submit" class="block btn btn-primary" value="Einreichen">
|
<button type="submit" class="btn btn-primary w-full sm:w-auto" value="Einreichen">Rechnung einreichen</button>
|
||||||
</div>
|
</section>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
Reference in New Issue
Block a user