1
0
mirror of https://github.com/tabler/tabler.git synced 2025-12-22 01:44:25 +04:00
Files
tabler/preview/pages/tasks-list.html
2025-11-15 13:45:53 +01:00

93 lines
3.8 KiB
HTML

---
title: Task List
page-header: Task List
page-menu: extra.tasks.list
layout: default
permalink: tasks-list.html
---
<div class="row">
<div class="col-12">
{% for section in tasks.columns %}
<div class="card mb-4">
<div class="card-header">
<h3 class="card-title mb-0">{{ section.name }}</h3>
<div class="card-actions">
{% include "ui/button.html" text="New Task" icon="plus" modal-id="add-task" size="sm" %}
</div>
</div>
<div class="table-responsive">
<table class="table table-vcenter card-table table-selectable">
<thead>
<tr>
<th class="w-1">
<input type="checkbox" class="form-check-input align-middle table-selectable-check"
aria-label="Select all tasks">
</th>
<th class="w-50">Name</th>
<th class="d-none d-xl-table-cell">Assigned To</th>
<th class="d-none d-xxl-table-cell">Due Date</th>
<th>Priority</th>
<th class="text-end">Actions</th>
</tr>
</thead>
<tbody>
{% for task in section.tasks %}
{% if task.assigned_to %}
{% assign person-id = task.assigned_to | minus: 1 %}
{% assign person = people[person-id] %}
{% endif %}
<tr>
<td>
<input type="checkbox" class="form-check-input align-middle table-selectable-check"
aria-label="Select task">
</td>
<td>
{{ task.name }}
</td>
<td>
{% if task.assigned_to and person %}
<div class="d-flex align-items-center">
{% include "ui/avatar.html" person-id=task.assigned_to size="xs" class="me-2" %}
<span>{{ person.full_name }}</span>
</div>
{% else %}
<span class="text-secondary">Unassigned</span>
{% endif %}
</td>
<td class="text-secondary">
{% if task.due_date %}
{% include "ui/icon.html" icon="calendar" class="me-1" %}
{{ task.due_date }}
{% elsif task.due-date %}
{% include "ui/icon.html" icon="calendar" class="me-1" %}
{{ task.due-date }}
{% else %}
<span class="text-muted"></span>
{% endif %}
</td>
<td>
{% if task.priority == "High" %}
{% include "ui/badge.html" text="High" color="red" light %}
{% elsif task.priority == "Medium" %}
{% include "ui/badge.html" text="Medium" color="yellow" light %}
{% elsif task.priority == "Low" %}
{% include "ui/badge.html" text="Low" color="blue" light %}
{% else %}
{% include "ui/badge.html" text="—" light %}
{% endif %}
</td>
<td class="text-end">
{% include "ui/button.html" text="View" size="sm" %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
{% endfor %}
</div>
</div>
{% include "ui/modal.html" modal-id="add-task" %}