2020-02-08 17:05:48 -05:00

130 lines
4.4 KiB
HTML

{% macro UserTab() %}
<div id="user-modal" class="modal">
<div class="modal-content">
<div class="row mt-2">
<div class="col s12">
<form id="edit-user-form">
{{ user_form.hidden_tag() }}
{{ select(
id='user-form-role',
form_obj=user_form.role,
size="s12",
label='Role'
) }}
{{ input(
label="Username",
id="user-form-username",
size="s12",
form_obj=user_form.username
) }}
{{ input(
label="Password",
id="user-form-password",
form_obj=user_form.password,
size="s12"
) }}
{{ input(
label="Confirm Password",
id="user-form-confirm_password",
form_obj=user_form.confirm_password,
required='required',
size="s12"
) }}
{{ user_form.id(class="hide", id="user-form-id") }}
</form>
{{ button(
icon="save",
float="left",
id="save-user-btn",
class="mb-2",
data={'url': url_for('settings_system.edit_user')},
text="save"
) }}
</div>
</div>
</div>
</div>
<div class="row mt-2">
<div class="col s12">
<h5>Users
<a href="#user-modal" class="modal-trigger">
<i class="material-icons-outlined theme-secondary-text icon-btn ml-2 toggle-config-help" style="position: relative; top: 4px;">add</i>
</a>
</h5>
<div id="users-div">
{{ Users(users) }}
</div>
</div>
</div>
<div class="row mt-4">
<h5>DashMachine</h5>
<p class="mb-2">version: {{ version }}</p>
</div>
{% endmacro %}
{% macro Users(users) %}
{% for user in users %}
<div class="card theme-surface-1">
<div class="card-content">
<span style="font-size: 1.3rem">
{{ user.username }}
<span class="theme-secondary-text">{{ user.role }}</span>
</span>
<span class="right pb-2">
<i class="material-icons-outlined icon-btn edit-user-btn"
data-role="{{ user.role }}"
data-id="{{ user.id }}"
data-username="{{ user.username }}">edit</i>
<i class="material-icons-outlined icon-btn delete-user-btn"
data-id="{{ user.id }}"
data-url="{{ url_for('settings_system.delete_user') }}">close</i>
</span>
</div>
</div>
{% endfor %}
<script>
$(".edit-user-btn").on('click', function(e) {
$("#user-modal").modal('open');
$("#user-form-username").val($(this).attr("data-username"));
$("#user-form-role").val($(this).attr("data-role"));
$("#user-form-id").val($(this).attr("data-id"));
M.updateTextFields();
});
$(".delete-user-btn").on('click', function(e) {
var r = confirm("Are you sure?");
if (r == true) {
$.ajax({
url: $(this).attr('data-url'),
type: 'GET',
data: {id: $(this).attr('data-id')},
success: function(data){
if (data.data.err !== 'success') {
M.toast({html: data.data.err, classes: 'theme-failure'});
} else {
$("#users-div").empty();
$("#users-div").append(data.data.html);
$("#edit-user-modal").modal('close');
M.toast({html: 'User deleted'});
}
}
});
}
});
</script>
{% endmacro %}
{{Users(users)}}