forms: use checkboxes for scope selection in UserForm

Enable selection of multiple scopes in user/add and user/edit
for restricted users.
Replace quick form creation with an inline form definition in
add_user.html and edit_user.html
master
Alejandro Sirgo Rica 2024-06-14 10:47:32 +02:00
parent a90f4207bd
commit c3a2dc028d
3 changed files with 83 additions and 10 deletions

View File

@ -7,7 +7,7 @@
from wtforms import (
Form, SubmitField, HiddenField, SelectField, BooleanField, IntegerField,
StringField, RadioField, PasswordField, SelectMultipleField
StringField, RadioField, PasswordField, SelectMultipleField, widgets
)
from wtforms.validators import InputRequired
from flask_wtf import FlaskForm
@ -47,6 +47,8 @@ class UserForm(FlaskForm):
scopes = SelectMultipleField(
label=_l('Allowed scopes'),
description=_l('Leave this empty to give full permissions'),
option_widget=widgets.CheckboxInput(),
widget=widgets.ListWidget(prefix_label=False)
)
submit_btn = SubmitField(
label=_l('Submit')

View File

@ -9,9 +9,45 @@
<h1 class="m-5">{{_('Add a user')}}</h1>
{{ wtf.quick_form(form,
action=url_for('user_add_post'),
method='post',
button_map={'submit_btn':'primary'}) }}
<form action="{{ url_for('user_add_post') }}" method="post" class="form">
{{ form.hidden_tag() }}
<div class="form-group">
{{ form.username.label(class_='form-label') }}
{{ form.username(class_='form-control') }}
</div>
<div class="form-group">
{{ form.pwd.label(class_='form-label') }}
{{ form.pwd(class_='form-control') }}
</div>
<div class="form-group">
{{ form.pwd_confirm.label(class_='form-label') }}
{{ form.pwd_confirm(class_='form-control') }}
</div>
<div class="form-group form-check">
{{ form.admin(class_='form-check-input') }}
{{ form.admin.label(class_='form-check-label') }}
</div>
<div class="form-group">
{{ form.scopes.label(class_='form-label') }}
<div class="form-text text-muted">{{ form.scopes.description }}</div>
<div>
{% for value, label, checked in form.scopes.iter_choices() %}
<div class="form-check">
<input class="form-check-input" type="checkbox" name="{{ form.scopes.name }}" value="{{ value }}" {% if checked %} checked {% endif %}>
<label class="form-check-label">{{ label }}</label>
</div>
{% endfor %}
</div>
</div>
<div class="form-group">
{{ form.submit_btn(class_='btn btn-primary') }}
</div>
</form>
{% endblock %}

View File

@ -9,10 +9,45 @@
<h1 class="m-5">{{_('Edit user {}').format(form.username.data)}}</h1>
{{ wtf.quick_form(form,
action=url_for('user_edit_post'),
method='post',
button_map={'submit_btn':'primary'},
id='user-form') }}
<form action="{{ url_for('user_edit_post') }}" method="post" class="form">
{{ form.hidden_tag() }}
<div class="form-group">
{{ form.username.label(class_='form-label') }}
{{ form.username(class_='form-control') }}
</div>
<div class="form-group">
{{ form.pwd.label(class_='form-label') }}
{{ form.pwd(class_='form-control') }}
</div>
<div class="form-group">
{{ form.pwd_confirm.label(class_='form-label') }}
{{ form.pwd_confirm(class_='form-control') }}
</div>
<div class="form-group form-check">
{{ form.admin(class_='form-check-input') }}
{{ form.admin.label(class_='form-check-label') }}
</div>
<div class="form-group">
{{ form.scopes.label(class_='form-label') }}
<div class="form-text text-muted">{{ form.scopes.description }}</div>
<div>
{% for value, label, checked in form.scopes.iter_choices() %}
<div class="form-check">
<input class="form-check-input" type="checkbox" name="{{ form.scopes.name }}" value="{{ value }}" {% if checked %} checked {% endif %}>
<label class="form-check-label">{{ label }}</label>
</div>
{% endfor %}
</div>
</div>
<div class="form-group">
{{ form.submit_btn(class_='btn btn-primary') }}
</div>
</form>
{% endblock %}