Update templates

This commit is contained in:
Götz 2019-04-09 21:15:56 +02:00
parent aeafadbc94
commit 10fa5a6362
7 changed files with 179 additions and 35 deletions

View File

@ -147,7 +147,7 @@ def user_update_controller(ldap_user, realm_id, realm_obj, request, user_dn, red
form_data = {'username': ldap_user.username, 'first_name': ldap_user.first_name,
'last_name': ldap_user.last_name, 'email': ldap_user.email}
form = UpdateLDAPUserForm(initial=form_data)
return render(request, detail_page, {'form': form, 'realm': realm_obj})
return render(request, detail_page, {'form': form, 'realm': realm_obj, 'user': ldap_user})
def user_delete_controller(ldap_user):

View File

@ -0,0 +1,71 @@
:root {
--input-padding-x: .75rem;
--input-padding-y: .75rem;
}
.form-control {
height: calc(1.5em + 0.75rem + 0.75rem + 2px);
}
.floating-label-form {
width: 100%;
max-width: 420px;
padding: 15px;
margin: 0 auto;
}
.form-group {
position: relative;
margin-bottom: 1rem;
}
.form-group > input,
.form-group > label {
padding: var(--input-padding-y) var(--input-padding-x);
}
.form-group > label {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
margin-bottom: 0; /* Override default `<label>` margin */
line-height: 1.5;
color: #495057;
border: 1px solid transparent;
border-radius: .25rem;
transition: all .1s ease-in-out;
}
.form-group input::-webkit-input-placeholder {
color: transparent;
}
.form-group input:-ms-input-placeholder {
color: transparent;
}
.form-group input::-ms-input-placeholder {
color: transparent;
}
.form-group input::-moz-placeholder {
color: transparent;
}
.form-group input::placeholder {
color: transparent;
}
.form-group input:not(:placeholder-shown) {
padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
padding-bottom: calc(var(--input-padding-y) / 3);
}
.form-group input:not(:placeholder-shown) ~ label {
padding-top: calc(var(--input-padding-y) / 3);
padding-bottom: calc(var(--input-padding-y) / 3);
font-size: 12px;
color: #777;
}

View File

@ -16,7 +16,7 @@
<!-- Bootstrap CSS -->
{# <link rel="stylesheet" href="{{ static('libs/font-awesome-4.7.0/css/font-awesome.css') }}">#}
<link rel="stylesheet" href="{{ static('libs/bootstrap-4.3.1-dist/css/bootstrap.css') }}">
{# <link rel="stylesheet" href="{{ static('home/form.css') }}">#}
<link rel="stylesheet" href="{{ static('css/floating_labels.css') }}">
{# <link rel="stylesheet" href="{{ static('home/main.css') }}">#}
{# <script src="{{ static('libs/jquery-3.3.1.min.js') }}"></script>#}
{# <script src="{{ static('libs/handlebars-379172e.js') }}"></script>#}
@ -51,7 +51,7 @@
{% block body %}
<div class="container-fluid">
<div class="row">{% block bottom_nav %}{% endblock %}</div>
<div class="row bg-dark text-white">
<div class="row">
{% block content %}{% endblock %}
</div>
</div>

View File

@ -1,5 +1,5 @@
{% extends 'realm/realm_detailed.jinja2' %}
{% import 'macros/forms_macro.jinja2' as forms %}
{% import 'macros/form_macros.jinja2' as forms %}
{% block extra_content %}
{% if not form %}
<h1>{{ group.name }}</h1>

View File

@ -20,6 +20,7 @@
<datalist id="{{ list }}">
</datalist>
{% endif %}
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
<small id="{{ field.id_for_label }}_help" class="form-text text-muted">
{% if field.errors %}
<ul>
@ -111,17 +112,17 @@
{% macro image_deletion_input(existing_images) -%}
<div class="card-group">
{% for image in existing_images %}
<div class="col-12 col-xs-12 col-md-6 col-lg-6 col-xl-3 p-1">
<div class="card w-100" style="width: 18rem;" >
<input type="checkbox" id="image{{ image.id }}" name="deleteImages"
value="{{ image.id }}">
<label for="image{{ image.id }}">
<img class="img-fluid" src="{{ image.file.url }}" alt="Item default image">
</label>
{% for image in existing_images %}
<div class="col-12 col-xs-12 col-md-6 col-lg-6 col-xl-3 p-1">
<div class="card w-100" style="width: 18rem;">
<input type="checkbox" id="image{{ image.id }}" name="deleteImages"
value="{{ image.id }}">
<label for="image{{ image.id }}">
<img class="img-fluid" src="{{ image.file.url }}" alt="Item default image">
</label>
</div>
</div>
</div>
{% endfor %}
{% endfor %}
</div>
{% endmacro %}
@ -179,6 +180,7 @@
<datalist id="{{ list }}">
</datalist>
{% endif %}
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
<small id="{{ field.id_for_label }}_help" class="form-text text-muted">
{% if field.errors %}
<ul>
@ -207,6 +209,7 @@
id="{{ field.id_for_label }}"
{% if field.value() != None %}value="{{ field.value() }}"{% endif %}
{% if field.field.required %}required{% endif %}>
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
<small id="{{ field.id_for_label }}_help" class="form-text text-muted">
{% if type %}
{{ field.label }} in {{ type }}
@ -223,4 +226,42 @@
{% endif %}
</small>
</div>
{% endmacro %}
{% macro email_input(field, list='', css_classes='') -%}
<div class="form-group">
<input type="email"
{% if css_classes %}
class="{{ css_classes }}"
{% else %}
class="form-control"
{% endif %}
placeholder="{{ field.label }}"
{% if list %}
list="{{ list }}"
{% endif %}
aria-describedby="{{ field.id_for_label }}_help"
name="{{ field.html_name }}"
id="{{ field.id_for_label }}"
{% if field.value() != None %}value="{{ field.value() }}"{% endif %}
maxlength="{{ field.field.max_length }}"
{% if field.field.required %}required{% endif %}>
{% if list %}
<datalist id="{{ list }}">
</datalist>
{% endif %}
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
<small id="{{ field.id_for_label }}_help" class="form-text text-muted">
{% if field.errors %}
<ul>
{% for error in field.errors %}
<li>{{ error }}</li>
{% endfor %}
</ul>
{% endif %}
{% if field.help_text %}
<br/>
{% endif %}
</small>
</div>
{% endmacro %}

View File

@ -17,7 +17,31 @@
Bestehende Bilder (Zum Löschen selektieren)
</label>
{{ forms.image_deletion_input(existing_images=item.images.all()) }}
<a class="btn btn-primary" href="{{ url('accounts:order-images', args=[item.id]) }}">Bilder manuell sortieren</a>
<a class="btn btn-primary" href="{{ url('accounts:order-images', args=[item.id]) }}">Bilder manuell
sortieren</a>
{% endif %}
{% endmacro %}
{% macro user_update_form(form, form_utils, item) %}
<input type="hidden" name="type" value="{{ form.type.value() }}">
{% for error in item_base_form.non_field_errors() %}
<p class="alert alert-danger" role="alert">
{{ error }}
</p>
{% endfor %}
{{ form_utils.text_input(form.title) }}
{{ form_utils.textarea_input(form.description) }}
{{ form_utils.select_input(form.categories, multiple=True) }}
{{ form_utils.file_input(form.loan_agreement_file) }}
{{ form_utils.file_input(form.images, multiple=True) }}
{% if item and item.images.count() > 0 %}
<label>
Bestehende Bilder (Zum Löschen selektieren)
</label>
{{ forms.image_deletion_input(existing_images=item.images.all()) }}
<a class="btn btn-primary" href="{{ url('accounts:order-images', args=[item.id]) }}">Bilder manuell
sortieren</a>
{% endif %}
{% endmacro %}

View File

@ -1,9 +1,11 @@
{% extends 'base.jinja2' %}
{% import 'macros/form_macros.jinja2' as mform %}
{% block content %}
<div class="col-12 ">
<div class="row justify-content-center justify-content-sm-center">
<div class="col-12 col-sm-6 col-md-5 col-lg-4 col-xl-3 bg-white text-dark p-3 mt-5">
{% if not form %}
{% if not form %}
<div class="col-12 col-sm-8 col-md-7 col-lg-5 col-xl-4 bg-white text-dark p-3 mt-5">
<div class="card">
<div class="card-body">
<h5 class="card-title">{{ user.username }}</h5>
@ -27,29 +29,35 @@
<li class="list-group-item"><span
class="font-weight-bold">Mobiltelefon:</span> {{ user.mobile_phone }}</li>
</ul>
<div class="card-footer row">
<div class="col-6 text-left">
<a href="{{ url('user-update', args = [user.dn, realm.id]) }}"
class="btn btn-primary">Update
User</a>
</div>
<div class="col-6 text-right">
<a href="{{ url('user-delete', args = [user.dn, realm.id]) }}"
class="btn btn-danger">Delete
User</a>
</div>
<div class="card-footer d-flex">
<a href="{{ url('user-update', args = [user.dn, realm.id]) }}"
class="btn btn-primary mr-auto p-2">Update
User</a>
<a href="{{ url('user-delete', args = [user.dn, realm.id]) }}"
class="btn btn-danger p-2">Delete
User</a>
</div>
</div>
</div>
{# <p>DN: {{ user.dn }}</p>#}
{% else %}
<form method="post">
</div>
{% else %}
<div class="col-12 col-sm-8 col-md-7 col-lg-5 col-xl-4 bg-white text-dark p-3 mt-5 border">
<h1 class="mb-4">Nutzerdetails anpassen</h1>
<form method="post" class="floating-label-form">
<input type="hidden" name="csrfmiddlewaretoken" value="{{ csrf_token }}">
{{ form.as_p()|safe }}
<button type="submit">Speichern</button>
{{ mform.email_input(form.email) }}
{{ mform.password_input(form.password) }}
{{ mform.text_input(form.first_name) }}
{{ mform.text_input(form.last_name) }}
<div class="d-flex mt-4">
<button type="submit" class="btn btn-primary mr-auto p-2">Speichern</button>
<a href="{{ url('realm-user-detail', args = [realm.id, user.dn]) }}"
class="btn btn-secondary p-2">Abbrechen</a>
</div>
</form>
{% endif %}
</div>
</div>
{% endif %}
</div>
</div>
</div>
{% endblock %}