256 lines
10 KiB
HTML
256 lines
10 KiB
HTML
{% macro render_field(field, disabled_fields=[], exclude_fields=[]) %}
|
|
{% set disabled = field.name in disabled_fields %}
|
|
{% set exclude_fields = exclude_fields + ['csrf_token', 'submit'] %}
|
|
{% if field.name not in exclude_fields %}
|
|
{% if field.type == 'BooleanField' %}
|
|
<div class="form-check">
|
|
{{ field(class="form-check-input", type="checkbox", id="flexSwitchCheckDefault") }}
|
|
{{ field.label(class="form-check-label", for="flexSwitchCheckDefault", disabled=disabled) }}
|
|
</div>
|
|
{% else %}
|
|
<div class="form-group">
|
|
{{ field.label(class="form-label") }}
|
|
{{ field(class="form-control", disabled=disabled) }}
|
|
{% if field.errors %}
|
|
<div class="invalid-feedback">
|
|
{% for error in field.errors %}
|
|
{{ error }}
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
{% endmacro %}
|
|
|
|
{% macro render_included_field(field, disabled_fields=[], include_fields=[]) %}
|
|
{% set disabled = field.name in disabled_fields %}
|
|
{% if field.name in include_fields %}
|
|
{% if field.type == 'BooleanField' %}
|
|
<div class="form-check">
|
|
{{ field(class="form-check-input", type="checkbox", id="flexSwitchCheckDefault") }}
|
|
{{ field.label(class="form-check-label", for="flexSwitchCheckDefault", disabled=disabled) }}
|
|
</div>
|
|
{% else %}
|
|
<div class="form-group">
|
|
{{ field.label(class="form-label") }}
|
|
{{ field(class="form-control", disabled=disabled) }}
|
|
{% if field.errors %}
|
|
<div class="invalid-feedback">
|
|
{% for error in field.errors %}
|
|
{{ error }}
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
{% endmacro %}
|
|
|
|
{% macro render_table(headers, rows) %}
|
|
<div class="card">
|
|
<div class="table-responsive">
|
|
<table class="table align-items-center mb-0">
|
|
<thead>
|
|
<tr>
|
|
{% for header in headers %}
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ header }}</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in rows %}
|
|
<tr>
|
|
{% for cell in row %}
|
|
<td class="{{ cell.class }}">
|
|
{% if cell.type == 'image' %}
|
|
<div class="d-flex px-2 py-1">
|
|
<div>
|
|
<img src="{{ cell.value }}" class="avatar avatar-sm me-3">
|
|
</div>
|
|
</div>
|
|
{% elif cell.type == 'text' %}
|
|
<p class="text-xs {{ cell.text_class }}">{{ cell.value }}</p>
|
|
{% elif cell.type == 'badge' %}
|
|
<span class="badge badge-sm {{ cell.badge_class }}">{{ cell.value }}</span>
|
|
{% elif cell.type == 'link' %}
|
|
<a href="{{ cell.href }}" class="text-secondary font-weight-normal text-xs" data-toggle="tooltip" data-original-title="{{ cell.title }}">{{ cell.value }}</a>
|
|
{% else %}
|
|
{{ cell.value }}
|
|
{% endif %}
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% macro render_selectable_table(headers, rows, selectable, id) %}
|
|
<div class="card">
|
|
<div class="table-responsive">
|
|
<table class="table align-items-center mb-0" id="{{ id }}">
|
|
<thead>
|
|
<tr>
|
|
{% if selectable %}
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Select</th>
|
|
{% endif %}
|
|
{% for header in headers %}
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ header }}</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in rows %}
|
|
<tr>
|
|
{% if selectable %}
|
|
<td><input type="radio" name="selected_row" value="{{ row[0] }}" required></td>
|
|
{% endif %}
|
|
{% for cell in row %}
|
|
<td class="{{ cell.class }}">
|
|
{% if cell.type == 'image' %}
|
|
<div class="d-flex px-2 py-1">
|
|
<div>
|
|
<img src="{{ cell.value }}" class="avatar avatar-sm me-3">
|
|
</div>
|
|
</div>
|
|
{% elif cell.type == 'text' %}
|
|
<p class="text-xs {{ cell.text_class }}">{{ cell.value }}</p>
|
|
{% elif cell.type == 'badge' %}
|
|
<span class="badge badge-sm {{ cell.badge_class }}">{{ cell.value }}</span>
|
|
{% elif cell.type == 'link' %}
|
|
<a href="{{ cell.href }}" class="text-secondary font-weight-normal text-xs" data-toggle="tooltip" data-original-title="{{ cell.title }}">{{ cell.value }}</a>
|
|
{% else %}
|
|
{{ cell.value }}
|
|
{% endif %}
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% macro render_accordion(accordion_id, accordion_items, header_title, header_description) %}
|
|
<div class="accordion-1">
|
|
<div class="container">
|
|
<div class="row my-5">
|
|
<div class="col-md-6 mx-auto text-center">
|
|
<h2>{{ header_title }}</h2>
|
|
<p>{{ header_description }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-10 mx-auto">
|
|
<div class="accordion" id="{{ accordion_id }}">
|
|
{% for item in accordion_items %}
|
|
<div class="accordion-item mb-3">
|
|
<h5 class="accordion-header" id="heading{{ loop.index }}">
|
|
<button class="accordion-button border-bottom font-weight-bold collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse{{ loop.index }}" aria-expanded="false" aria-controls="collapse{{ loop.index }}">
|
|
{{ item.title }}
|
|
<i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3" aria-hidden="true"></i>
|
|
<i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3" aria-hidden="true"></i>
|
|
</button>
|
|
</h5>
|
|
<div id="collapse{{ loop.index }}" class="accordion-collapse collapse" aria-labelledby="heading{{ loop.index }}" data-bs-parent="#{{ accordion_id }}">
|
|
<div class="accordion-body text-sm opacity-8">
|
|
{{ item.content }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% macro render_nested_table(headers, rows) %}
|
|
<div class="">
|
|
<div class="table-responsive">
|
|
<table class="table align-items-center mb-0">
|
|
<thead>
|
|
<tr>
|
|
{% for header in headers %}
|
|
<th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ header }}</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in rows %}
|
|
<tr>
|
|
{% for cell in row %}
|
|
{% if cell.is_group %}
|
|
<td colspan="{{ cell.colspan }}" class="{{ cell.class }}">
|
|
{{ render_nested_table(cell.headers, cell.sub_rows) }}
|
|
</td>
|
|
{% else %}
|
|
<td class="{{ cell.class }}">
|
|
{% if cell.type == 'image' %}
|
|
<div class="d-flex px-2 py-1">
|
|
<div>
|
|
<img src="{{ cell.value }}" class="avatar avatar-sm me-3">
|
|
</div>
|
|
</div>
|
|
{% elif cell.type == 'text' %}
|
|
<p class="text-xs {{ cell.text_class }}">{{ cell.value }}</p>
|
|
{% elif cell.type == 'badge' %}
|
|
<span class="badge badge-sm {{ cell.badge_class }}">{{ cell.value }}</span>
|
|
{% elif cell.type == 'link' %}
|
|
<a href="{{ cell.href }}" class="text-secondary font-weight-normal text-xs" data-toggle="tooltip" data-original-title="{{ cell.title }}">{{ cell.value }}</a>
|
|
{% else %}
|
|
{{ cell.value }}
|
|
{% endif %}
|
|
</td>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% macro render_pagination(pagination, endpoint) %}
|
|
<nav aria-label="Page navigation">
|
|
<ul class="pagination">
|
|
<!-- Previous Button -->
|
|
<li class="page-item {{ 'disabled' if not pagination.has_prev }}">
|
|
<a class="page-link" href="{{ url_for(endpoint, page=pagination.prev_num) if pagination.has_prev else 'javascript:;' }}" tabindex="-1">
|
|
<span class="material-symbols-outlined">keyboard_double_arrow_left</span>
|
|
{# <span class="sr-only">Previous</span>#}
|
|
</a>
|
|
</li>
|
|
|
|
<!-- Page Number Buttons -->
|
|
{% for page in pagination.iter_pages(left_edge=1, left_current=2, right_current=3, right_edge=1) %}
|
|
<li class="page-item {{ 'active' if page == pagination.page }}">
|
|
<a class="page-link" href="{{ url_for(endpoint, page=page) }}">
|
|
{% if page == pagination.page %}
|
|
<span class="material-symbols-outlined">target</span>
|
|
{# <span class="sr-only">(current)</span>#}
|
|
{% else %}
|
|
{{ page }}
|
|
{% endif %}
|
|
</a>
|
|
</li>
|
|
{% endfor %}
|
|
|
|
<!-- Next Button -->
|
|
<li class="page-item {{ 'disabled' if not pagination.has_next }}">
|
|
<a class="page-link" href="{{ url_for(endpoint, page=pagination.next_num) if pagination.has_next else 'javascript:;' }}">
|
|
<span class="material-symbols-outlined">keyboard_double_arrow_right</span>
|
|
{# <span class="sr-only">Next</span>#}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
{% endmacro %}
|
|
|