Add new fragments.

This commit is contained in:
Yaro Kasear 2025-07-15 09:36:21 -05:00
parent 50573df8d7
commit 34f1c5a824
6 changed files with 87 additions and 58 deletions

View file

@ -2,43 +2,23 @@
{% macro breadcrumb_header(breadcrumbs=[], title=None, save_button=False, delete_button=False, create_button=False) %}
<!-- Breadcrumb Fragment -->
<nav class="row d-flex mb-3 justify-content-between">
<div class="col">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="{{ url_for('main.index') }}" class="link-success link-underline-opacity-0">
{{ icons.render_icon('house', 16) }}
</a>
</li>
{% for crumb in breadcrumbs %}
<li class="breadcrumb-item">
{% if crumb.url %}
<a href="{{ crumb.url }}" class="link-success link-underline-opacity-0">{{ crumb.label }}</a>
{% else %}
{{ crumb.label }}
{% endif %}
</li>
{% endfor %}
{% if title %}
<li class="breadcrumb-item active">{{ title }}</li>
<ol class="breadcrumb m-0">
<li class="breadcrumb-item">
<a href="{{ url_for('main.index') }}" class="link-success link-underline-opacity-0">
{{ icons.render_icon('house', 16) }}
</a>
</li>
{% for crumb in breadcrumbs %}
<li class="breadcrumb-item">
{% if crumb.url %}
<a href="{{ crumb.url }}" class="link-success link-underline-opacity-0">{{ crumb.label }}</a>
{% else %}
{{ crumb.label }}
{% endif %}
</ol>
</div>
{% if save_button or delete_button or create_button %}
<div class="col text-end">
<div class="btn-group">
{% if save_button %}
<button type="submit" class="btn btn-primary" id="saveButton">{{ icons.render_icon('floppy', 16) }}</button>
{% endif %}
{% if delete_button %}
<button type="submit" class="btn btn-danger" id="deleteButton">{{ icons.render_icon('trash', 16) }}</button>
{% endif %}
{% if create_button %}
<button type="submit" class="btn btn-primary" id="createButton">{{ icons.render_icon('plus', 16) }}</button>
{% endif %}
</div>
</div>
</li>
{% endfor %}
{% if title %}
<li class="breadcrumb-item active">{{ title }}</li>
{% endif %}
</nav>
</ol>
{% endmacro %}

View file

@ -0,0 +1,16 @@
{% import "fragments/_icon_fragment.html" as icons %}
{% macro render_button(id, icon, style='primary', logic = None) %}
<button type="submit" class="btn btn-{{ style }}" id="{{ id }}Button">{{ icons.render_icon(icon, 16) }}</button>
{% if logic %}
<script>
document.addEventListener("DOMContentLoaded", () => {
{{ id }}Button = document.getElementById("{{ id }}Button");
{{ id }}Button.addEventListener("click", async () =>{
{{ logic }}
});
});
</script>
{% endif %}
{% endmacro %}

View file

@ -0,0 +1,9 @@
{% macro render_toolbar(id, left=None, center=None, right=None) %}
<nav class="navbar navbar-expand bg-light-subtle border-bottom" id="toolbar-{{ id }}">
<div class="d-flex justify-content-between container-fluid">
<div>{{ left if left }}</div>
<div>{{ center if center }}</div>
<div>{{ right if right }}</div>
</div>
</nav>
{% endmacro %}

View file

@ -3,11 +3,13 @@
{% block title %}{{ title }}{% endblock %}
{% block content %}
{{ breadcrumbs.breadcrumb_header(
title=title
) }}
{% block precontent %}
{{ toolbars.render_toolbar('index', left=breadcrumbs.breadcrumb_header(
title=title
)) }}
{% endblock %}
{% block content %}
<div class="container">
{% if not category %}
<div class="row">

View file

@ -1,3 +1,4 @@
{% import "fragments/_button_fragment.html" as buttons %}
{% import "fragments/_breadcrumb_fragment.html" as breadcrumbs %}
{% import "fragments/_combobox_fragment.html" as combos %}
{% import "fragments/_editor_fragment.html" as editor %}
@ -5,6 +6,7 @@
{% import "fragments/_image_fragment.html" as images %}
{% import "fragments/_link_fragment.html" as links %}
{% import "fragments/_table_fragment.html" as tables %}
{% import "fragments/_toolbar_fragment.html" as toolbars %}
<!-- templates/layout.html -->
<!doctype html>
@ -56,6 +58,7 @@
</div>
</div>
</nav>
{% block precontent %}{% endblock %}
<main class="container-flex m-5">
{% block content %}{% endblock %}
</main>

View file

@ -3,28 +3,47 @@
{% block title %}{{ title }}{% endblock %}
{% block precontent %}
{% set createButtonLogic %}
window.location.href = '/{{ entry_route }}/new';
{% endset %}
{{ toolbars.render_toolbar(
'test',
left = breadcrumbs.breadcrumb_header(
title=title,
breadcrumbs=breadcrumb,
create_button=True
),
right = buttons.render_button(id='create', icon='plus-lg', logic=createButtonLogic)
) }}
{% endblock %}
{#
<nav class="row d-flex mb-3 justify-content-between">
{% if save_button or delete_button or create_button %}
<div class="col text-end">
<div class="btn-group">
{% if save_button %}
<button type="submit" class="btn btn-primary" id="saveButton">{{ icons.render_icon('floppy', 16) }}</button>
{% endif %}
{% if delete_button %}
<button type="submit" class="btn btn-danger" id="deleteButton">{{ icons.render_icon('trash', 16) }}</button>
{% endif %}
{% if create_button %}
<button type="submit" class="btn btn-primary" id="createButton">{{ icons.render_icon('plus', 16) }}</button>
{% endif %}
</div>
</div>
{% endif %}
</nav>
#}
{% block content %}
{{ breadcrumbs.breadcrumb_header(
{# { breadcrumbs.breadcrumb_header(
title=title,
breadcrumbs=breadcrumb,
create_button=True
) }}
{#
<div class="btn-group">
<button class="btn btn-primary">{{ icons.render_icon('box-arrow-in-up', 16) }}</button>
<button class="btn btn-primary">{{ icons.render_icon('box-arrow-up', 16) }}</button>
</div>
#}
) } #}
{{ tables.render_table(headers=header, rows=rows, id='table', entry_route=entry_route) }}
{% endblock %}
{% block script %}
createButton = document.getElementById("createButton");
createButton.addEventListener("click", async () => {
window.location.href = "/{{ entry_route }}/new";
})
{% endblock %}