macros.html

 1{% macro task_table(project_name, tasks, caption) %}
 2<div class="table">
 3  <table>
 4    <caption class="sr-only">{{ caption }}</caption>
 5    <thead>
 6      <tr>
 7        <th scope="col">ID</th>
 8        <th scope="col">Status</th>
 9        <th scope="col">Priority</th>
10        <th scope="col">Effort</th>
11        <th scope="col">Title</th>
12        <th scope="col">Created</th>
13      </tr>
14    </thead>
15    <tbody>
16      {% for t in tasks %}
17      <tr>
18        <td><a href="/projects/{{ project_name }}/tasks/{{ t.full_id }}"><code>{{ t.short_id }}</code></a></td>
19        <td><span class="badge{% if t.status == "closed" %} success{% elif t.status == "in_progress" %} secondary{% endif %}">{{ t.status }}</span></td>
20        <td>{{ t.priority }}</td>
21        <td>{{ t.effort }}</td>
22        <td>{{ t.title }}</td>
23        <td><time datetime="{{ t.created_at }}">{{ t.created_at_display }}</time></td>
24      </tr>
25      {% endfor %}
26    </tbody>
27  </table>
28</div>
29{% endmacro %}
30
31{% macro sortable_task_table(project_name, tasks, caption, sort_ctx) %}
32<div class="table">
33  <table>
34    <caption class="sr-only">{{ caption }}</caption>
35    <thead>
36      <tr>
37        <th scope="col"><a href="{{ sort_ctx.column_href("id") }}">ID{{ sort_ctx.arrow("id") }}</a></th>
38        <th scope="col"><a href="{{ sort_ctx.column_href("status") }}">Status{{ sort_ctx.arrow("status") }}</a></th>
39        <th scope="col"><a href="{{ sort_ctx.column_href("priority") }}">Priority{{ sort_ctx.arrow("priority") }}</a></th>
40        <th scope="col"><a href="{{ sort_ctx.column_href("effort") }}">Effort{{ sort_ctx.arrow("effort") }}</a></th>
41        <th scope="col"><a href="{{ sort_ctx.column_href("title") }}">Title{{ sort_ctx.arrow("title") }}</a></th>
42        <th scope="col"><a href="{{ sort_ctx.column_href("created") }}">Created{{ sort_ctx.arrow("created") }}</a></th>
43        <th scope="col">Change status</th>
44      </tr>
45    </thead>
46    <tbody>
47      {% for t in tasks %}
48      <tr>
49        <td><a href="/projects/{{ project_name }}/tasks/{{ t.full_id }}"><code>{{ t.short_id }}</code></a></td>
50        <td><span class="badge{% if t.status == "closed" %} success{% elif t.status == "in_progress" %} secondary{% endif %}">{{ t.status }}</span></td>
51        <td>{{ t.priority }}</td>
52        <td>{{ t.effort }}</td>
53        <td>{{ t.title }}</td>
54        <td><time datetime="{{ t.created_at }}">{{ t.created_at_display }}</time></td>
55        <td>
56          <ot-dropdown>
57            <button popovertarget="status-{{ t.short_id }}" class="outline small" aria-label="Change status of {{ t.short_id }}, currently {{ t.status_display }}">
58              {{ t.status_display }}
59              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>
60            </button>
61            <menu popover id="status-{{ t.short_id }}">
62              <button role="menuitemradio" aria-checked="{{ t.status == "open" }}" {% if t.status == "open" %}disabled{% else %}form="set-open-{{ t.short_id }}"{% endif %}>Open</button>
63              <button role="menuitemradio" aria-checked="{{ t.status == "in_progress" }}" {% if t.status == "in_progress" %}disabled{% else %}form="set-in-progress-{{ t.short_id }}"{% endif %}>In progress</button>
64              <button role="menuitemradio" aria-checked="{{ t.status == "closed" }}" {% if t.status == "closed" %}disabled{% else %}form="set-closed-{{ t.short_id }}"{% endif %}>Closed</button>
65            </menu>
66          </ot-dropdown>
67          {% if t.status != "open" %}
68          <form id="set-open-{{ t.short_id }}" method="post" action="/projects/{{ project_name }}/tasks/{{ t.full_id }}" hidden>
69            <input type="hidden" name="status" value="open">
70            <input type="hidden" name="redirect" value="/projects/{{ project_name }}">
71          </form>
72          {% endif %}
73          {% if t.status != "in_progress" %}
74          <form id="set-in-progress-{{ t.short_id }}" method="post" action="/projects/{{ project_name }}/tasks/{{ t.full_id }}" hidden>
75            <input type="hidden" name="status" value="in_progress">
76            <input type="hidden" name="redirect" value="/projects/{{ project_name }}">
77          </form>
78          {% endif %}
79          {% if t.status != "closed" %}
80          <form id="set-closed-{{ t.short_id }}" method="post" action="/projects/{{ project_name }}/tasks/{{ t.full_id }}" hidden>
81            <input type="hidden" name="status" value="closed">
82            <input type="hidden" name="redirect" value="/projects/{{ project_name }}">
83          </form>
84          {% endif %}
85        </td>
86      </tr>
87      {% endfor %}
88    </tbody>
89  </table>
90</div>
91{% endmacro %}