aboutsummaryrefslogtreecommitdiff
path: root/templates/payment
diff options
context:
space:
mode:
Diffstat (limited to 'templates/payment')
-rw-r--r--templates/payment/create.html93
-rw-r--r--templates/payment/table.html259
-rw-r--r--templates/payment/update.html117
3 files changed, 240 insertions, 229 deletions
diff --git a/templates/payment/create.html b/templates/payment/create.html
index 5bae767..8defad3 100644
--- a/templates/payment/create.html
+++ b/templates/payment/create.html
@@ -6,7 +6,7 @@
{% block main %}
- <div>
+ <section class="g-Section">
<p class="g-Paragraph">
<a
class="g-Link g-Media__Large"
@@ -34,47 +34,51 @@
<div class="g-Form__Error">{{ error }}</div>
{% endif %}
- <label class="g-Form__Label" for="name">Nom</label>
- <input
- name="name"
- class="g-Form__Input"
- id="name"
- value="{{ form.name | default(value="") }}"
- required
- {% if not form %} autofocus {% endif %}
- />
+ <label class="g-Form__Label">
+ Nom
+ <input
+ name="name"
+ class="g-Form__Input"
+ value="{{ form.name | default(value="") }}"
+ required
+ {% if not form %} autofocus {% endif %}
+ />
+ </label>
- <label class="g-Form__Label" for="cost">Coût</label>
- <input
- name="cost"
- type="number"
- class="g-Form__Input"
- id="cost"
- value="{{ form.cost | default(value="") }}"
- required
- />
+ <label class="g-Form__Label">
+ Coût
+ <input
+ name="cost"
+ type="number"
+ class="g-Form__Input"
+ value="{{ form.cost | default(value="") }}"
+ required
+ />
+ </label>
{% set user_id = form.user_id | default(value="" ~ connected_user.id) %}
- <label class="g-Form__Label" for="user_id">Personne</label>
- <select name="user_id" id="user_id" class="g-Form__Select" required>
- {% for user in users %}
- <option
- value="{{ user.id }}"
- {% if "" ~ user.id == user_id %}
- selected
- {% endif %}
- >
- {{ user.name }}
- </option>
- {% endfor %}
- </select>
+ <label class="g-Form__Label">
+ Personne
+ <select name="user_id" class="g-Form__Select" required>
+ {% for user in users %}
+ <option
+ value="{{ user.id }}"
+ {% if "" ~ user.id == user_id %}
+ selected
+ {% endif %}
+ >
+ {{ user.name }}
+ </option>
+ {% endfor %}
+ </select>
+ </label>
{% set category_id = form.category_id | default(value="") %}
- <label class="g-Form__Label" for="category_id">
+ <label class="g-Form__Label">
Catégorie
- <select name="category_id" id="category_id" class="g-Form__Select" required>
+ <select name="category_id" class="g-Form__Select" required>
{% for category in categories %}
<option
value="{{ category.id }}"
@@ -90,15 +94,16 @@
{% set date = form.date | default(value=now() | date(format="%Y-%m-%d")) %}
{% if query.frequency != "Monthly" %}
- <label class="g-Form__Label" for="date">Date</label>
- <input
- name="date"
- type="date"
- class="g-Form__Input"
- id="date"
- value="{{ date }}"
- required
- />
+ <label class="g-Form__Label">
+ Date
+ <input
+ name="date"
+ type="date"
+ class="g-Form__Input"
+ value="{{ date }}"
+ required
+ />
+ </label>
{% else %}
<input
name="date"
@@ -117,6 +122,6 @@
<input class="g-Button__Validate" type="submit" value="Créer" />
</div>
</form>
- </div>
+ </section>
{% endblock main %}
diff --git a/templates/payment/table.html b/templates/payment/table.html
index 5234e05..da15b22 100644
--- a/templates/payment/table.html
+++ b/templates/payment/table.html
@@ -8,139 +8,138 @@
{% block main %}
- <div class="g-Paragraph g-Payments__Header">
- <div class="g-Payments__FrequenciesAndSearch">
- <div class="g-Payments__Frequencies">
- {% if query.frequency == "Monthly" %}
- <a
- class="g-Payments__Frequency g-Link"
- href="/{{ payments_params(frequency="Punctual") }}"
- >
- Ponctuels
- </a>
- /
- <span class="g-Payments__Frequency g-Payments__Frequency--Selected">
- Mensuels
- </span>
- {% else %}
- <span class="g-Payments__Frequency g-Payments__Frequency--Selected">
- Ponctuels
- </span>
- /
- <a
- class="g-Payments__Frequency g-Link"
- href="/{{ payments_params(frequency="Monthly") }}"
- >
- Mensuels
- </a>
- {% endif %}
+ <aside class="g-Aside">
+ <form action="/" method="GET" class="g-Payments__Filters">
+ <label class="g-Form__Label">
+ Fréquence
+ <select name="frequency" class="g-Form__Select">
+ <option value="Punctual" {% if query.frequency == "Punctual" %} selected {% endif %}>
+ Ponctuelle
+ </option>
+ <option value="Monthly" {% if query.frequency == "Monthly" %} selected {% endif %}>
+ Mensuelle
+ </option>
+ </select>
+ </label>
+
+ <label class="g-Form__Label">
+ Recherche
+ <input
+ type="search"
+ name="search"
+ class="g-Form__Input"
+ value="{{ query.search }}"
+ />
+ </label>
+
+ <label class="g-Form__Label">
+ Catégorie
+ <select name="category" class="g-Form__Select">
+ <option selected disabled hidden></option>
+ {% for category in categories %}
+ <option
+ value="{{ category.id }}"
+ style="color: {{ category.color }}"
+ {% if category.id == query.category %} selected {% endif %}
+ >
+ {{ category.name }}
+ </option>
+ {% endfor %}
+ </select>
+ </label>
+
+ <input type="submit" class="g-Button__Validate" value="Rechercher">
+ </form>
+ </aside>
+
+ <section class="g-Section">
+ {% if not payments %}
+
+ <div class="g-Payments__NoResults">
+ Aucun paiement ne correspond à votre recherche.
</div>
- {% if query.frequency != "Monthly" %}
- <form action="/" method="GET" class="g-Payments__Search">
- <input
- type="search"
- name="search"
- class="g-Form__Input g-Payments__SearchInput"
- value="{{ query.search }}"
- />
-
- <label class="g-Form__Label">
- Catégorie
- <select name="category" class="g-Form__Select">
- <option disabled selected value></option>
- {% for category in categories %}
- <option
- value="{{ category.id }}"
- style="color: {{ category.color }}"
- {% if category.id == query.category %} selected {% endif %}
- >
- {{ category.name }}
- </option>
- {% endfor %}
- </select>
- </label>
-
- <input type="submit" class="g-Button__Search" value="🔍">
- </form>
- {% endif %}
- </div>
-
- <a
- class="g-Button__Validate g-Payments__New"
- href="/payment{{ payments_params(
- page=query.page,
- search=query.search,
- frequency=query.frequency
- ) }}"
- >
- Nouveau
- </a>
- </div>
-
- {% if not payments %}
-
- <div class="g-Payments__NoResults">
- Aucun paiement ne correspond à votre recherche.
- </div>
-
- {% else %}
-
- <div class="g-Paragraph">
- {{ count | numeric }} paiement{{ count | pluralize }} comptabilisant {{ total_cost | euros() }}.
- </div>
-
- <div class="g-Table">
- <div class="g-Table__Row g-Table__Row--Header">
- <span class="g-Table__Cell">Nom</span>
- <span class="g-Table__Cell">Coût</span>
- <span class="g-Table__Cell">Personne</span>
- <span class="g-Media__Large g-Table__Cell">Catégorie</span>
- {% if query.frequency != "Monthly" %}
- <span class="g-Table__Cell">Date</span>
- {% endif %}
+ <a
+ class="g-Button__Validate g-Payments__New"
+ href="/payment{{ payments_params(
+ page=query.page,
+ search=query.search,
+ frequency=query.frequency
+ ) }}"
+ >
+ Nouveau
+ </a>
+
+ {% else %}
+
+ <div class="g-Paragraph">
+ {{ count | numeric }} paiement{{ count | pluralize }} comptabilisant {{ total_cost | euros() }}.
</div>
- {% for payment in payments %}
- <a
- class="g-Table__Row {% if query.highlight == payment.id %} g-Table__Row--Highlight {% endif %}"
- href="/payment/{{ payment.id }}{{ payments_params(
- page=query.page,
- search=query.search,
- frequency=query.frequency
- ) }}"
- >
- <span class="g-Table__Cell">{{ payment.name }}</span>
- <span class="
- g-Table__Cell
- g-Table__NumericCell
- {% if payment.cost < 0 %} g-Payments__Refund {% endif %}
- ">
- {{ payment.cost | euros() }}
- </span>
- <span class="g-Table__Cell">{{ payment.user }}</span>
- <span class="g-Table__Cell g-Media__Large">
- <span style="color: {{ payment.category_color }}">
- {{ payment.category_name }}
- </span>
- </span>
+
+ <a
+ class="g-Paragraph g-Button__Validate g-Payments__New"
+ href="/payment{{ payments_params(
+ page=query.page,
+ search=query.search,
+ frequency=query.frequency
+ ) }}"
+ >
+ Ajouter un paiement
+ </a>
+
+ <div class="g-Table">
+ <div class="g-Table__Row g-Table__Row--Header">
+ <span class="g-Table__Cell">Nom</span>
+ <span class="g-Table__Cell">Coût</span>
+ <span class="g-Table__Cell">Personne</span>
+ <span class="g-Media__Large g-Table__Cell">Catégorie</span>
{% if query.frequency != "Monthly" %}
- <span class="g-Table__Cell">
- {{ payment.date }}
- </span>
+ <span class="g-Table__Cell">Date</span>
{% endif %}
- </a>
- {% endfor %}
- </div>
-
- {{ paging::paging(
- url="/" ~ payments_params(
- search=query.search,
- frequency=query.frequency,
- category=query.category
- ),
- page=page,
- max_page=max_page
- ) }}
-
- {% endif %}
+ </div>
+ {% for payment in payments %}
+ <a
+ class="g-Table__Row {% if query.highlight == payment.id %} g-Table__Row--Highlight {% endif %}"
+ href="/payment/{{ payment.id }}{{ payments_params(
+ page=query.page,
+ search=query.search,
+ frequency=query.frequency
+ ) }}"
+ >
+ <span class="g-Table__Cell">{{ payment.name }}</span>
+ <span class="
+ g-Table__Cell
+ g-Table__NumericCell
+ {% if payment.cost < 0 %} g-Payments__Refund {% endif %}
+ ">
+ {{ payment.cost | euros() }}
+ </span>
+ <span class="g-Table__Cell">{{ payment.user }}</span>
+ <span class="g-Table__Cell g-Media__Large">
+ <span style="color: {{ payment.category_color }}">
+ {{ payment.category_name }}
+ </span>
+ </span>
+ {% if query.frequency != "Monthly" %}
+ <span class="g-Table__Cell">
+ {{ payment.date }}
+ </span>
+ {% endif %}
+ </a>
+ {% endfor %}
+ </div>
+
+ {{ paging::paging(
+ url="/" ~ payments_params(
+ search=query.search,
+ frequency=query.frequency,
+ category=query.category
+ ),
+ page=page,
+ max_page=max_page
+ ) }}
+
+ {% endif %}
+ </section>
+
{% endblock main %}
diff --git a/templates/payment/update.html b/templates/payment/update.html
index 25e6915..4e244f4 100644
--- a/templates/payment/update.html
+++ b/templates/payment/update.html
@@ -6,7 +6,7 @@
{% block main %}
- <div>
+ <section class="g-Section">
<p class="g-Paragraph">
<a
class="g-Link g-Media__Large"
@@ -42,66 +42,73 @@
>
<h1 class="g-H1">Modification</h1>
- <label class="g-Form__Label" for="name">Nom</label>
- <input
- name="name"
- class="g-Form__Input"
- id="name"
- value="{{ form.name | default(value=payment.name) }}"
- required
- />
-
- <label class="g-Form__Label" for="cost">Coût</label>
- <input
- name="cost"
- type="number"
- class="g-Form__Input"
- id="cost"
- value="{{ form.cost | default(value=payment.cost) }}"
- required
- />
+ <label class="g-Form__Label">
+ Nom
+ <input
+ name="name"
+ class="g-Form__Input"
+ value="{{ form.name | default(value=payment.name) }}"
+ required
+ />
+ </label>
+
+ <label class="g-Form__Label">
+ Coût
+ <input
+ name="cost"
+ type="number"
+ class="g-Form__Input"
+ value="{{ form.cost | default(value=payment.cost) }}"
+ required
+ />
+ </label>
{% set user_id = form.user_id | default(value="" ~ payment.user_id) %}
- <label class="g-Form__Label" for="user_id">Personne</label>
- <select name="user_id" id="user_id" class="g-Form__Select" required>
- {% for user in users %}
- <option
- value="{{ user.id }}"
- {% if "" ~ user.id == user_id %} selected {% endif %}
- >
- {{ user.name }}
- </option>
- {% endfor %}
- </select>
+ <label class="g-Form__Label">
+ Personne
+ <select name="user_id" class="g-Form__Select" required>
+ {% for user in users %}
+ <option
+ value="{{ user.id }}"
+ {% if "" ~ user.id == user_id %} selected {% endif %}
+ >
+ {{ user.name }}
+ </option>
+ {% endfor %}
+ </select>
+ </label>
{% set category_id = form.category_id | default(value="" ~ payment.category_id) %}
- <label class="g-Form__Label" for="category_id">Catégorie</label>
- <select name="category_id" id="category_id" class="g-Form__Select" required>
- {% for category in categories %}
- <option
- value="{{ category.id }}"
- style="color: {{ category.color }}"
- {% if "" ~ category.id == category_id %} selected {% endif %}
- >
- {{ category.name }}
- </option>
- {% endfor %}
- </select>
+ <label class="g-Form__Label">
+ Catégorie
+ <select name="category_id" class="g-Form__Select" required>
+ {% for category in categories %}
+ <option
+ value="{{ category.id }}"
+ style="color: {{ category.color }}"
+ {% if "" ~ category.id == category_id %} selected {% endif %}
+ >
+ {{ category.name }}
+ </option>
+ {% endfor %}
+ </select>
+ </label>
{% set date = form.date | default(value=payment.date) %}
{% if payment.frequency == "Punctual" %}
- <label class="g-Form__Label" for="date">Date</label>
- <input
- name="date"
- type="date"
- class="g-Form__Input"
- id="date"
- value="{{ date }}"
- required
- />
+ <label class="g-Form__Label">
+ Date
+ <input
+ name="date"
+ type="date"
+ class="g-Form__Input"
+ value="{{ date }}"
+ required
+ />
+ </label>
{% else %}
<input
name="date"
@@ -127,18 +134,18 @@
>
<h1 class="g-H1">Suppression</h1>
- <label class="g-Form__Label" for="remove-input">
+ <label class="g-Form__Label">
Veuillez recopier le nom du paiement : « {{ payment.name }} ».
+ <input name="remove-input" class="g-Form__Input" data-name="{{ payment.name }}" />
</label>
- <input name="remove-input" class="g-Form__Input" id="remove-input" data-name="{{ payment.name }}" />
<div>
- <input class="g-Button__Danger" type="submit" value="Supprimer" id="remove-button" disabled />
+ <input id="remove-button"class="g-Button__Danger" type="submit" value="Supprimer" disabled />
</div>
</form>
{% endif %}
- </div>
+ </section>
{% endblock main %}