Bootstrap admin home page
This commit is contained in:
parent
d1f7c97455
commit
cd9043d8f3
@ -69,3 +69,45 @@
|
||||
font-size: 12px;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
/*SIDEBAR*/
|
||||
.sidebar-wrapper {
|
||||
min-height: 100vh;
|
||||
margin-left: -15rem;
|
||||
-webkit-transition: margin .25s ease-out;
|
||||
-moz-transition: margin .25s ease-out;
|
||||
-o-transition: margin .25s ease-out;
|
||||
transition: margin .25s ease-out;
|
||||
}
|
||||
|
||||
.sidebar-wrapper .sidebar-heading {
|
||||
padding: 0.875rem 1.25rem;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.sidebar-wrapper .list-group {
|
||||
width: 15rem;
|
||||
}
|
||||
|
||||
.page-content-wrapper {
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.wrapper.toggled .sidebar-wrapper {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.sidebar-wrapper {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.page-content-wrapper {
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wrapper.toggled .sidebar-wrapper {
|
||||
margin-left: -15rem;
|
||||
}
|
||||
}
|
||||
@ -49,12 +49,12 @@
|
||||
</nav>
|
||||
|
||||
{% block body %}
|
||||
<div class="container-fluid">
|
||||
<div class="row">{% block bottom_nav %}{% endblock %}</div>
|
||||
<div class="row">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
{# <div class="container-fluid">#}
|
||||
{# <div class="row">{% block bottom_nav %}{% endblock %}</div>#}
|
||||
{# <div class="row">#}
|
||||
{% block content %}{% endblock %}
|
||||
{# </div>#}
|
||||
{# </div>#}
|
||||
{% endblock %}
|
||||
<script src="{{ static('js/form.js') }}"></script>
|
||||
{% block js_tail %}{% endblock %}
|
||||
|
||||
29
templates/base_admin.jinja2
Normal file
29
templates/base_admin.jinja2
Normal file
@ -0,0 +1,29 @@
|
||||
{% extends 'base.jinja2' %}
|
||||
|
||||
{% block body %}
|
||||
<div class="d-flex wrapper">
|
||||
<div class="bg-light border-right sidebar-wrapper">
|
||||
<h2 class="sidebar-heading">Realms</h2>
|
||||
<div class="list-group list-group-flush">
|
||||
{% for realm_item in realms %}
|
||||
<a href="{{ url('realm-detail', args=[realm_item.id]) }}"
|
||||
class="list-group-item list-group-item-action bg-light">{{ realm_item.name }} </a>
|
||||
{# {% if request.user.is_superuser %}#}
|
||||
{# <a href="{{ url('realm-delete', args=[realm_item.id]) }}">Delete</a>#}
|
||||
{# {% endif %}#}
|
||||
{% endfor %}
|
||||
{% if realm %}
|
||||
<h2 class="sidebar-heading">{{ realm.name }}</h2>
|
||||
{# <a href="{{ }}">Users</a>#}
|
||||
{# <a href="{{ }}">Groups</a>#}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-content-wrapper">
|
||||
<div class="container-fluid">
|
||||
{% block admin_content %}{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@ -1,257 +1,24 @@
|
||||
{# author: Marius Hofmann #}
|
||||
|
||||
{% macro format_money(float_value) -%}
|
||||
{{ '{:10.2f} €'.format(float_value).replace('.', ',') }}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro format_mass(float_value) -%}
|
||||
{{ '{:10.2f} kg'.format(float_value).replace('.', ',') }}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro format_distance(float_value) -%}
|
||||
{{ '{:10.2f}m'.format(float_value).replace('.', ',') }}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro get_item_default_image(item) -%}
|
||||
{% if item.images.all()[0] %}
|
||||
<img class="card-img-top" src="{{ item.images.all()[0].file.url }}" alt="Item default image">
|
||||
{% else %}
|
||||
<i class="far fa-image fa-10x" title="Kein Standard-Bild definiert" alt="Kein Standard-Bild definiert!"></i>
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro get_item_shortened_desc(item) -%}
|
||||
{% if item.description %}
|
||||
{{ item.description|truncate(20, True, '...') }}
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro get_item_image_ligthbox(item) -%}
|
||||
{% if item.images.all()[0] %}
|
||||
{# Used this https://lokeshdhakar.com/projects/lightbox2/ to realize the lightbox#}
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
$('#lightbox-trigger').click(function () {
|
||||
$('.lightbox-item').first().trigger('click');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<a id="lightbox-trigger" href="#">
|
||||
<img class="img-fluid" src="{{ item.images.all()[0].file.url }}"
|
||||
alt="Item default image">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row px-2">
|
||||
{% for image in item.images.all() %}
|
||||
<div class="col-2 px-1">
|
||||
<a class="lightbox-item" href="{{ image.file.url }}" data-lightbox="{{ title }}"
|
||||
data-title="{{ item.title }}">
|
||||
<img src="{{ image.thumb.url }}" class="media-object img-thumbnail" alt="Bild">
|
||||
</a>
|
||||
</div>
|
||||
{% macro get_sidebar(realms, realm=None) -%}
|
||||
{# <div class="col-2 col-xl-3 sidebar">#}
|
||||
<div class="bg-light border-right sidebar-wrapper">
|
||||
<h2 class="sidebar-heading">Realms</h2>
|
||||
<div class="list-group list-group-flush">
|
||||
<a href="#" class="list-group-item list-group-item-action bg-light">Dashboard</a>
|
||||
{% for realm_item in realms %}
|
||||
<a href="{{ url('realm-detail', args=[realm_item.id]) }}">{{ realm_item.name }}</a>
|
||||
{# {% if request.user.is_superuser %}#}
|
||||
{# <a href="{{ url('realm-delete', args=[realm_item.id]) }}">Delete</a>#}
|
||||
{# {% endif %}#}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<i class="far fa-image fa-10x" title="Kein Standard-Bild definiert" alt="Kein Standard-Bild definiert!"></i>
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
|
||||
{% macro print_item_images(item, include_default=False) -%}
|
||||
{% for image in item.images.all() %}
|
||||
{% if loop.index0 > 0 or include_default %}
|
||||
<div class="col-12 col-xs-12 col-md-6 col-lg-6 col-xl-3 pb-2">
|
||||
<div class="card w-100" style="width: 18rem;">
|
||||
<img class="img-fluid" src="{{ image.file.url }}" alt="Item image">
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro mini_map(location, zoomlevel=13, width=300, height=300) -%}
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function (event) {
|
||||
let map = L.map('mini-map').setView([{{ location.latitude }}, {{ location.longitude }}], {{ zoomlevel }});
|
||||
|
||||
|
||||
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
|
||||
}).addTo(map);
|
||||
marker = L.marker([{{ location.latitude }}, {{ location.longitude }}]);
|
||||
marker.addTo(map);
|
||||
map.addControl(new L.Control.Fullscreen());
|
||||
});
|
||||
</script>
|
||||
<div id="mini-map" style="width: {{ width }}px; height: {{ height }}px;">
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
{% macro filter_panel(types) %}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 mb-2 text-center">
|
||||
<div class="btn-group" role="group" aria-label="Basic example">
|
||||
<button type="button" class="btn btn-secondary type-button" value="{{ types.venue }}">Venue</button>
|
||||
<button type="button" class="btn btn-secondary type-button" value="{{ types.service }}">Service</button>
|
||||
<button type="button" class="btn btn-secondary type-button" value="{{ types.object }}">Objekt</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#categories-collapse"
|
||||
aria-expanded="false" aria-controls="categories-collapse">
|
||||
Kategorien
|
||||
</button>
|
||||
<div id="categories-collapse" class="collapse bg-secondary text-dark p-1 border-top border-primary">
|
||||
<div id="category-sidebar"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#options-collapse"
|
||||
aria-expanded="false" aria-controls="options-collapse">
|
||||
Optionen
|
||||
</button>
|
||||
<div id="options-collapse" class="collapse bg-secondary text-dark p-1 border-top border-primary">
|
||||
<input type="number" class="form-control mb-2 mr-sm-2" id="min-amount"
|
||||
placeholder="Minimale Anzahl" min="0">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="max-weight"
|
||||
placeholder="Maximales Gewicht" min="0">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#sizing-collapse"
|
||||
aria-expanded="false" aria-controls="sizing-collapse">
|
||||
Abmessungen
|
||||
</button>
|
||||
<div class="collapse bg-secondary text-dark p-1 border-top border-primary" id="sizing-collapse">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="min-height"
|
||||
placeholder="Min. Höhe" min="0">
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="max-height"
|
||||
placeholder="Max. Höhe" min="0">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="min-width"
|
||||
placeholder="Min. Breite" min="0">
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="max-width"
|
||||
placeholder="Max. Breite" min="0">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="min-depth"
|
||||
placeholder="Min. Tiefe" min="0">
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<input type="number" step="0.01" class="form-control mb-2 mr-sm-2" id="max-depth"
|
||||
placeholder="Max. Tiefe" min="0">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#lender-collapse"
|
||||
aria-expanded="false" aria-controls="lender-collapse">
|
||||
Verleiher
|
||||
</button>
|
||||
<div id="lender-collapse" class="collapse bg-secondary text-dark p-1 border-top border-primary">
|
||||
<select multiple class="form-control" id="lenderSelect"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#loan-agreement-collapse"
|
||||
aria-expanded="false" aria-controls="loan-agreement-collapse">
|
||||
Leihvereinbarung
|
||||
</button>
|
||||
<div id="loan-agreement-collapse" class="collapse bg-secondary text-dark p-1 border-top border-primary">
|
||||
<input type="number" class="form-control mb-2 mr-sm-2" id="max-caution"
|
||||
placeholder="Max. Kaution" min="0">
|
||||
<input type="number" class="form-control mb-2 mr-sm-2" id="max-single-rent"
|
||||
placeholder="Max. einmalige Leihgebühr" min="0">
|
||||
<div id="rental-fee-selection-group" class="form-group">
|
||||
<label for="rentalFeeIntervalSelect">Zahlungsintervall</label>
|
||||
<select class="form-control" id="rentalFeeIntervalSelect"></select>
|
||||
</div>
|
||||
<input type="number" class="form-control mb-2 mr-sm-2" id="max-rental-fee-costs"
|
||||
placeholder="Max. Mietkosten" min="0">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#availability-collapse"
|
||||
aria-expanded="false" aria-controls="availability-collapse">
|
||||
Verfügbarkeit
|
||||
</button>
|
||||
<div id="availability-collapse" class="collapse bg-secondary text-dark p-1 border-top border-primary">
|
||||
<div class="form-group row">
|
||||
<label for="start-date" class="col-2 col-form-label">Von</label>
|
||||
<div class="col-10">
|
||||
<input class="form-control" type="date" value="" id="start-date">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label for="end-date" class="col-2 col-form-label">Bis</label>
|
||||
<div class="col-10">
|
||||
<input class="form-control" type="date" value="" id="end-date">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1">
|
||||
<button class="btn btn-secondary w-100" type="button" data-toggle="collapse"
|
||||
data-target="#radius-based-search-collapse"
|
||||
aria-expanded="false" aria-controls="radius-based-search-collapse">
|
||||
Umkreissuche
|
||||
</button>
|
||||
<div id="radius-based-search-collapse"
|
||||
class="collapse bg-secondary text-dark p-1 border-top border-primary">
|
||||
<input type="number" class="form-control mb-2 mr-sm-2" id="house-number"
|
||||
placeholder="Hausnummer" min="0">
|
||||
<input class="form-control mb-2 mr-sm-2" type="text" placeholder="Straße" id="street">
|
||||
<input class="form-control mb-2 mr-sm-2" type="text" placeholder="Ort" id="city">
|
||||
<input type="number" step="0.1" class="form-control mb-2 mr-sm-2" id="distance"
|
||||
placeholder="Distanz in km" min="0">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-sm-6 col-md-12 col-lg-12 col-xl-12 mb-1 text-center">
|
||||
<button id="reset-filter" class="btn btn-light w-50" type="button">Filter zurücksetzen</button>
|
||||
{% if realm %}
|
||||
<h2>{{ realm.name }}</h2>
|
||||
{# <a href="{{ }}">Users</a>#}
|
||||
{# <a href="{{ }}">Groups</a>#}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{# </div>#}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro mailto(lender, subject, content) -%}
|
||||
mailto:{{ lender.user.email }}?subject={{ subject|urlencode }}&body={{ content|urlencode }}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro request_mail_subject(items) -%}
|
||||
Resourcenpool Bamberg: Anfrage zu {{ items|length }} Artikeln
|
||||
{% endmacro %}
|
||||
|
||||
{% macro request_mail_content(lender, items, requesting_user=None) -%}
|
||||
Guten Tag {{ lender.user.first_name }} {{ lender.user.last_name }}
|
||||
|
||||
Ich habe mich über den Resourcenpool Bamberg über Ihre Angebot informiert und würde gerne folgende{{ 'n' if items|count == 1 else '' }} Artikel ausleihen/buchen:
|
||||
{% for item in items %}
|
||||
- {{ item.title }}
|
||||
{% endfor %}
|
||||
Ich freue mich auf Ihre Antwort.
|
||||
|
||||
Mit freundlichen Grüßen
|
||||
{% if requesting_user %}
|
||||
{{ requesting_user.first_name }} {{ requesting_user.last_name }}
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
@ -1,19 +1,19 @@
|
||||
{% extends 'base.jinja2' %}
|
||||
{% block content %}
|
||||
{% if request.user.is_superuser %}
|
||||
<h2>Neuen Bereich anlegen</h2>
|
||||
<form method="post">
|
||||
<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrf_token }}">
|
||||
{{ form.as_p()|safe }}
|
||||
<button type="submit">Anlegen</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
<h2>Realms</h2>
|
||||
{% for realm in realms %}
|
||||
<p><a href="{{ url('realm-detail', args=[realm.id]) }}">{{ realm.name }}</a>
|
||||
{% extends 'base_admin.jinja2' %}
|
||||
{% import 'macros/form_macros.jinja2' as mform %}
|
||||
{% import 'macros/utils_macros.jinja2' as mutils %}
|
||||
|
||||
{% block admin_content %}
|
||||
<div class="row justify-content-center justify-content-sm-center">
|
||||
<div class="col-12 col-sm-8 col-md-8 col-lg-6 col-xl-5 bg-white text-dark p-3 mt-5">
|
||||
{% if request.user.is_superuser %}
|
||||
<a href="{{ url('realm-delete', args=[realm.id]) }}">Delete</a>
|
||||
<h2>Neuen Bereich anlegen</h2>
|
||||
<form method="post">
|
||||
<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrf_token }}">
|
||||
{{ mform.text_input(form.name) }}
|
||||
{{ mform.text_input(form.ldap_base_dn) }}
|
||||
<button type="submit" class="btn btn-primary btn-block">Anlegen</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</p>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user