Add Breadcrumbs and UserList to admin package

This commit is contained in:
Patrick Jentsch
2021-01-13 11:57:46 +01:00
parent 3d53b673fd
commit a8643aa9f4
6 changed files with 58 additions and 19 deletions

View File

@ -0,0 +1,19 @@
<ul class="tabs tabs-transparent">
<li class="tab"><a href="{{ url_for('main.index') }}" target="_self"><i class="material-icons">home</i></a></li>
<li class="tab disabled"><i class="material-icons">navigate_next</i></li>
<li class="tab"><a href="{{ url_for('.index') }}" target="_self">Administration</a></li>
<li class="tab disabled"><i class="material-icons">navigate_next</i></li>
{% if request.path == url_for('.users') %}
<li class="tab"><a class="active" href="{{ url_for('.users') }}" target="_self">Users</a></li>
{% elif request.path == url_for('.user', user_id=user.id) %}
<li class="tab"><a href="{{ url_for('.users') }}" target="_self">Users</a></li>
<li class="tab disabled"><i class="material-icons">navigate_next</i></li>
<li class="tab"><a class="active" href="{{ url_for('.user', user_id=user.id) }}" target="_self">{{ user.username }}</a></li>
{% elif request.path == url_for('.edit_user', user_id=user.id) %}
<li class="tab"><a href="{{ url_for('.users') }}" target="_self">Users</a></li>
<li class="tab disabled"><i class="material-icons">navigate_next</i></li>
<li class="tab"><a href="{{ url_for('.user', user_id=user.id) }}" target="_self">{{ user.username }}</a></li>
<li class="tab disabled"><i class="material-icons">navigate_next</i></li>
<li class="tab"><a class="active" href="{{ url_for('.edit_user', user_id=user.id) }}" target="_self">Edit</a></li>
{% endif %}
</ul>

View File

@ -1,6 +1,10 @@
{% extends "nopaque.html.j2" %}
{% import 'materialize/wtf.html.j2' as wtf %}
{% block nav_content %}
{% include 'admin/_breadcrumbs.html.j2' %}
{% endblock nav_content %}
{% block page_content %}
<div class="container">
<div class="row">

View File

@ -1,5 +1,9 @@
{% extends "nopaque.html.j2" %}
{% block nav_content %}
{% include 'admin/_breadcrumbs.html.j2' %}
{% endblock nav_content %}
{% block page_content %}
<div class="container">
<div class="row">
@ -30,7 +34,7 @@
</ul>
</div>
<div class="card-action right-align">
<a href="{{ url_for('.edit_general_settings', user_id=user.id) }}" class="waves-effect waves-light btn"><i class="material-icons left">edit</i>Edit</a>
<a href="{{ url_for('.edit_user', user_id=user.id) }}" class="waves-effect waves-light btn"><i class="material-icons left">edit</i>Edit</a>
<a data-target="delete-user-modal" class="waves-effect waves-light btn red modal-trigger"><i class="material-icons left">delete</i>Delete</a>
</div>
</div>

View File

@ -1,5 +1,9 @@
{% extends "nopaque.html.j2" %}
{% block nav_content %}
{% include 'admin/_breadcrumbs.html.j2' %}
{% endblock nav_content %}
{% block page_content %}
<div class="container">
<div class="row">
@ -7,28 +11,28 @@
<h1 id="title">{{ title }}</h1>
</div>
<div class="col s12">
<div class="col s12" id="users">
<div class="card">
<div class="card-content" id="users">
<div class="card-content">
<div class="input-field">
<i class="material-icons prefix">search</i>
<input id="search-user" class="search" type="text"></input>
<label for="search-user">Search user</label>
</div>
<ul class="pagination paginationTop"></ul>
<table class="highlight responsive-table">
<table class="highlight ressource-list">
<thead>
<tr>
<th class="sort" data-sort="id">Id</th>
<th class="sort" data-sort="username">Username</th>
<th class="sort" data-sort="email">Email</th>
<th class="sort" data-sort="role_id">Role</th>
<th>{# Actions #}</th>
<th class="sort" data-sort="last_seen">Last seen</th>
<th class="sort" data-sort="role">Role</th>
<th></th>
</tr>
</thead>
<tbody class="list"></tbody>
</table>
<ul class="pagination paginationBottom"></ul>
<ul class="pagination"></ul>
</div>
</div>
</div>
@ -38,9 +42,8 @@
{% block scripts %}
{{ super() }}
<script type="module">
import {RessourceList} from '{{ url_for('static', filename='js/nopaque.lists.js') }}';
let userList = new RessourceList('users', null, "User", RessourceList.options.extended);
userList._add({{ users|tojson }});
<script>
let userList = new UserList(document.querySelector('#users'), {page: 10});
userList.init({{ users|tojson }});
</script>
{% endblock scripts %}