Implement /admin using flask-admin. Overall cleanup

This commit is contained in:
Patrick Jentsch
2024-12-16 15:37:19 +01:00
parent c405061574
commit d4cd313940
25 changed files with 84 additions and 632 deletions

@ -68,8 +68,8 @@
</li>
{% endif %}
{% if current_user.is_administrator %}
<li {% if request.path == url_for('admin.admin') %}class="active"{% endif %}>
<a href="{{ url_for('admin.admin') }}">
<li>
<a href="{{ url_for('admin.index') }}">
<i class="material-icons left">admin_panel_settings</i>
Administration
</a>

@ -118,8 +118,8 @@
{% if current_user.is_administrator %}
{# Administration #}
<li {% if request.path == url_for('admin.admin') %}class="active"{% endif %}>
<a class="waves-effect" href="{{ url_for('admin.admin') }}"><i class="material-icons">admin_panel_settings</i>Administration</a>
<li>
<a class="waves-effect" href="{{ url_for('admin.index') }}"><i class="material-icons">admin_panel_settings</i>Administration</a>
</li>
{% endif %}
</ul>

@ -1,43 +0,0 @@
{% extends "base.html.j2" %}
{% block page_content %}
<div class="container">
<div class="row">
<div class="col s12">
<h1 id="title">{{ title }}</h1>
</div>
<div class="col s12 l4">
<div class="card hoverable">
<a href="{{ url_for('.users') }}" style="position: absolute; width: 100%; height: 100%;"></a>
<div class="card-content">
<span class="card-title"><i class="material-icons left">group</i>Users</span>
<p>Edit the individual user accounts. You have the following options:</p>
<ul>
<li>- View, edit and delete user accounts</li>
<li>- View, edit and delete user corpora</li>
<li>- View, edit and delete user jobs</li>
<li>- View, edit and delete user added Tesseract models</li>
<li>- View, edit and delete user added SpaCy models</li>
</ul>
</div>
</div>
</div>
<div class="col s12 l4">
<div class="card hoverable">
<a href="{{ url_for('.corpora') }}" style="position: absolute; width: 100%; height: 100%;"></a>
<div class="card-content">
<span class="card-title"><i class="nopaque-icons left">I</i>Corpora</span>
<p>Edit all Corpora. You have the following options:</p>
<ul>
<li>- View, edit and delete corpora</li>
<li>- View, edit and delete corpus jobs</li>
<li>- Edit corpus follower roles and the public status of the corpus</li>
</ul>
</div>
</div>
</div>
</div>
</div>
{% endblock page_content %}

@ -1,29 +0,0 @@
{% extends "base.html.j2" %}
{% block page_content %}
<div class="container">
<h1 id="title">{{ title }}</h1>
<div class="card">
<div class="card-content">
<div class="corpus-list no-autoinit" id="corpus-list"></div>
</div>
</div>
</div>
</div>
{% endblock page_content %}
{% block scripts %}
{{ super() }}
<script>
let corpusListElement = document.querySelector('#corpus-list');
let corpusList = new nopaque.resource_lists.CorpusList(corpusListElement);
corpusList.add(
[
{% for corpus in corpora %}
{{ corpus.to_json_serializeable(backrefs=True,relationships=True)|tojson }},
{% endfor %}
]
);
</script>
{% endblock scripts %}

@ -1,104 +0,0 @@
{% extends "base.html.j2" %}
{% import "wtf.html.j2" as wtf %}
{% block page_content %}
<div class="container">
<div class="row">
<div class="col s12">
<h1 id="title">{{ title }}</h1>
</div>
<div class="col s12">
<form method="POST">
{{ edit_profile_settings_form.hidden_tag() }}
<div class="card">
<div class="card-content">
<span class="card-title">General settings</span>
{{ wtf.render_field(edit_profile_settings_form.username, material_icon='person') }}
{{ wtf.render_field(edit_profile_settings_form.email, material_icon='email') }}
</div>
<div class="card-action">
<div class="right-align">
{{ wtf.render_field(edit_profile_settings_form.submit, material_icon='send') }}
</div>
</div>
</form>
</div>
</form>
<form method="POST">
{{ edit_notification_settings_form.hidden_tag() }}
<div class="card">
<div class="card-content">
<span class="card-title">Notification settings</span>
{{ wtf.render_field(edit_notification_settings_form.job_status_mail_notification_level, material_icon='notifications') }}
</div>
<div class="card-action">
<div class="right-align">
{{ wtf.render_field(edit_notification_settings_form.submit, material_icon='send') }}
</div>
</div>
</div>
</form>
<form method="POST">
{{ admin_edit_user_form.hidden_tag() }}
<div class="card">
<div class="card-content">
<span class="card-title">Administrator settings</span>
{{ wtf.render_field(admin_edit_user_form.role, material_icon='swap_vert') }}
<div class="row">
<div class="col s12"><p>&nbsp;</p></div>
<div class="col s1">
<p><i class="material-icons">check</i></p>
</div>
<div class="col s8">
<p>{{ admin_edit_user_form.confirmed.label.text }}</p>
<p class="light">Change confirmation status manually.</p>
</div>
<div class="col s3 right-align">
<div class="switch">
<label>
{{ admin_edit_user_form.confirmed() }}
<span class="lever"></span>
</label>
</div>
</div>
</div>
</div>
<div class="card-action right-align">
{{ wtf.render_field(admin_edit_user_form.submit, material_icon='send') }}
</div>
</div>
</form>
<div class="card">
<div class="card-content">
<span class="card-title">Delete account</span>
<p>Deleting an account has the following effects:</p>
<ul>
<li>All data associated with your corpora and jobs will be permanently deleted.</li>
<li>All settings will be permanently deleted.</li>
</ul>
</div>
<div class="card-action right-align">
<a href="#delete-account-modal" class="btn modal-trigger red waves-effect waves-light"><i class="material-icons left">delete</i>Delete</a>
</div>
</div>
</div>
</div>
{% endblock page_content %}
{% block modals %}
{{ super() }}
<div class="modal" id="delete-account-modal">
<div class="modal-content">
<h4>Confirm deletion</h4>
<p>Do you really want to delete your account and all associated data? All associated corpora, jobs and files will be permanently deleted!</p>
</div>
<div class="modal-footer">
<a href="#!" class="btn modal-close waves-effect waves-light">Cancel</a>
<a href="{{ url_for('.delete_user', user_id=user.id) }}" class="btn red waves-effect waves-light"><i class="material-icons left">delete</i>Delete</a>
</div>
</div>
{% endblock modals %}

@ -1,131 +0,0 @@
{% extends "base.html.j2" %}
{% block page_content %}
<div class="container">
<div class="row">
<div class="col s12 l2">
<p>&nbsp;</p>
{# <img src="{{ url_for('users.user_avatar', user_id=user.id) }}" alt="user-image" class="circle responsive-img"> #}
</div>
<div class="col s12 l10">
<h1 id="title">{{ title }}</h1>
<p>
<span class="chip hoverable tooltipped no-autoinit" id="user-role-chip">{{ user.role.name }}</span>
{% if user.confirmed %}
<span class="chip white-text" id="user-confirmed-chip" style="background-color: #4caf50;">confirmed</span>
{% else %}
<span class="chip white-text" id="user-confirmed-chip" style="background-color: #f44336;">unconfirmed</span>
{% endif %}
</p>
{% if user.about_me %}
<p>{{ user.about_me }}</p>
{% endif %}
</div>
<div class="col s12 hide-on-med-and-down">&nbsp;</div>
<div class="col s12">
<ul class="tabs tabs-fixed-width z-depth-1">
<li class="tab"><a href="#user-info">User info</a></li>
<li class="tab"><a href="#user-corpora">Corpora</a></li>
<li class="tab"><a href="#user-jobs">Jobs</a></li>
<li class="tab"><a href="#user-tesseract-ocr-pipeline-models">Tesseract OCR Pipeline Models</a></li>
<li class="tab"><a href="#user-spacy-nlp-pipeline-models">SpaCy NLP Pipeline Models</a></li>
</ul>
</div>
<div class="col s12" id="user-info">
<div class="card">
<div class="card-content">
<ul>
<li>Username: {{ user.username }}</li>
<li>Email: {{ user.email }}</li>
<li>Id: {{ user.id }}</li>
<li>Hashid: {{ user.hashid }}</li>
<li>Member since: {{ user.member_since.strftime('%Y-%m-%d') }}</li>
<li>Last seen: {% if user.last_seen %}{{ user.last_seen.strftime('%Y-%m-%d') }}</li>{% endif %}
</ul>
</div>
<div class="card-action right-align">
<a class="btn waves-effect waves-light" href="{{ url_for('.user_settings', user_id=user.id) }}"><i class="material-icons left">edit</i>Edit</a>
<a class="btn red modal-trigger waves-effect waves-light" data-target="delete-user-modal"><i class="material-icons left">delete</i>Delete</a>
</div>
</div>
</div>
<div class="col s12" id="user-corpora">
<div class="card">
<div class="card-content">
<div class="corpus-list" data-user-id="{{ user.hashid }}"></div>
</div>
</div>
</div>
<div class="col s12" id="user-jobs">
<div class="card">
<div class="card-content">
<div class="job-list" data-user-id="{{ user.hashid }}"></div>
</div>
</div>
</div>
<div class="col s12" id="user-spacy-nlp-pipeline-models">
<div class="card">
<div class="card-content">
<div class="spacy-nlp-pipeline-model-list" data-user-id="{{ user.hashid }}"></div>
</div>
</div>
</div>
<div class="col s12" id="user-tesseract-ocr-pipeline-models">
<div class="card">
<div class="card-content">
<div class="tesseract-ocr-pipeline-model-list" data-user-id="{{ user.hashid }}"></div>
</div>
</div>
</div>
</div>
</div>
{% endblock page_content %}
{% block modals %}
{{ super() }}
<div id="delete-user-modal" class="modal">
<div class="modal-content">
<h3>Delete user</h3>
<p>Do you really want to delete the user {{ user.username }}? All associated data will be permanently deleted!</p>
</div>
<div class="modal-footer">
<a class="btn modal-close waves-effect waves-light">Cancel</a>
<a class="btn red modal-close waves-effect waves-light"><i class="material-icons left">delete</i>Delete</a>
</div>
</div>
{% endblock modals %}
{% block scripts %}
{{ super() }}
<script>
let userRoleChip = document.querySelector('#user-role-chip');
let userRoleChipTooltip = M.Tooltip.init(
userRoleChip,
{
html: `
<p>Permissions</p>
<p class="left-align">
{% for permission in ['ADMINISTRATE', 'CONTRIBUTE', 'USE_API'] %}
<label>
<input class="filled-in" type="checkbox" {{ 'checked' if user.can(permission) }}>
<span>{{ permission|capitalize }}</span>
</label>
{% if not loop.last %}
<br>
{% endif %}
{% endfor %}
</p>
`.trim()
}
);
</script>
{% endblock scripts %}

@ -1,66 +0,0 @@
{% extends "users/settings/settings.html.j2" %}
{% block admin_settings %}
<div class="col s12"></div>
<div class="col s12 l4">
<h4>Administrator Settings</h4>
<p>Here the Confirmation Status of the user can be set manually and a special role can be assigned.</p>
</div>
<div class="col s12 l8">
<br>
<ul class="collapsible no-autoinit settings-collapsible">
<li>
<div class="collapsible-header" style="justify-content: space-between;">
<span>Confirmation status</span>
<i class="caret material-icons">keyboard_arrow_right</i>
</div>
<div class="collapsible-body">
<div style="overflow: auto;">
<p class="left"><i class="material-icons">check</i></p>
<p class="left" style="margin-left: 10px;">
Confirmed<br>
<span class="light">Change confirmation status manually.</span>
</p>
<br class="hide-on-med-and-down">
<div class="switch right">
<label>
<input {% if user.confirmed %}checked{% endif %} id="user-confirmed-switch" type="checkbox">
<span class="lever"></span>
</label>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header" style="justify-content: space-between;">
<span>Role</span>
<i class="caret material-icons">keyboard_arrow_right</i>
</div>
<div class="collapsible-body">
<form method="POST">
{{ update_user_form.hidden_tag() }}
{{ wtf.render_field(update_user_form.role, material_icon='manage_accounts') }}
<div class="right-align">
{{ wtf.render_field(update_user_form.submit, material_icon='send') }}
</div>
</form>
</div>
</li>
</ul>
</div>
{% endblock admin_settings %}
{% block scripts %}
{{ super() }}
<script>
let userConfirmedSwitchElement = document.querySelector('#user-confirmed-switch');
userConfirmedSwitchElement.addEventListener('change', (event) => {
let newConfirmed = userConfirmedSwitchElement.checked;
nopaque.requests.admin.users.entity.confirmed.update({{ user.hashid|tojson }}, newConfirmed)
.catch((response) => {
userConfirmedSwitchElement.checked = !userConfirmedSwitchElement;
});
});
</script>
{% endblock scripts %}

@ -1,34 +0,0 @@
{% extends "base.html.j2" %}
{% block page_content %}
<div class="container">
<div class="row">
<div class="col s12">
<h1 id="title">{{ title }}</h1>
</div>
<div class="col s12">
<div class="card">
<div class="card-content">
<div class="admin-user-list no-autoinit" id="admin-user-list"></div>
</div>
</div>
</div>
</div>
</div>
{% endblock page_content %}
{% block scripts %}
{{ super() }}
<script>
let adminUserListElement = document.querySelector('#admin-user-list');
let adminUserList = new nopaque.resource_lists.AdminUserList(adminUserListElement);
adminUserList.add(
[
{% for user in users %}
{{ user.to_json_serializeable(backrefs=True)|tojson }},
{% endfor %}
]
);
</script>
{% endblock scripts %}

@ -172,8 +172,6 @@
</li>
</ul>
</div>
{% block admin_settings %}{% endblock admin_settings %}
</div>
</div>
{% endblock page_content %}