crafty-4/app/frontend/templates/panel/panel_edit_user.html
2023-10-30 12:13:14 -04:00

600 lines
26 KiB
HTML

{% extends ../base.html %}
{% block meta %}
{% end %}
{% block title %}Crafty Controller - {{ translate('userConfig', 'userSettings',
data['lang']) }}{% end %}
{% block content %}
<div class="content-wrapper">
<!-- Page Title Header Starts-->
<div class="row page-title-header">
<div class="col-12">
<div class="page-header">
{% if data['new_user'] %}
<h4 class="page-title">
{{ translate('userConfig', 'pageTitleNew', data['lang']) }}
<br />
<small>UID: N/A</small>
</h4>
{% else %}
<h4 class="page-title">
{{ translate('userConfig', 'pageTitle', data['lang']) }}
<br />
<small>UID: {{ data['user']['user_id'] }}</small>
</h4>
{% end %}
</div>
</div>
</div>
<!-- Page Title Header Ends-->
<div class="row">
<div class="col-sm-12 grid-margin">
<div class="card">
<div class="card-body pt-0">
<ul class="nav nav-tabs col-md-12 tab-simple-styled " role="tablist">
<li class="nav-item">
<a class="nav-link active"
href="/panel/{{ 'add_user' if data['new_user'] else 'edit_user' }}?id={{ data['user']['user_id'] }}&subpage=config"
role="tab" aria-selected="true">
<i class="fas fa-cogs"></i> {{ translate('userConfig', 'config', data['lang']) }}</a>
</li>
{% if not data['new_user'] %}
<li class="nav-item">
<a class="nav-link" href="/panel/edit_user_apikeys?id={{ data['user']['user_id'] }}" role="tab"
aria-selected="false">
<i class="fas fa-key"></i>{{ translate('userConfig', 'apiKey', data['lang']) }}</a>
</li>
{% end %}
</ul>
<div class="row">
<div class="col-md-6 col-sm-12">
{% if data['new_user'] %}
<form id="user_form" class="forms-sample">
{% else %}
<form id="user_form" class="forms-sample">
{% end %}
<div class="card">
<div class="card-header header-sm d-flex justify-content-between align-items-center">
<h4 class="card-title"><i class="fas fa-user"></i> {{ translate('userConfig', 'userSettings',
data['lang']) }}</h4>
</div>
<div class="card-body">
{% if data['new_user'] %}
<div class="form-group">
<label class="form-label" for="username">{{ translate('userConfig', 'userName', data['lang'])
}}<small class="text-muted ml-1"> - {{ translate('userConfig', 'userNameDesc', data['lang'])
}}</small> </label>
<input type="text" class="form-control" name="username" id="username" autocomplete="off"
data-lpignore="true" value="{{ data['user']['username'] }}" placeholder="User Name">
</div>
<div class="form-group">
<label class="form-label" for="password0">{{ translate('userConfig', 'password', data['lang'])
}}<small class="text-muted ml-1"> - {{ translate('userConfig', 'leaveBlank', data['lang']) }}
</small> </label>
<input type="password" class="form-control" name="password0" id="password0" value=""
autocomplete="new-password" data-lpignore="true" placeholder="Password" form="dummy">
<span class="passwords-match" ,
data-content="{{ translate('panelConfig', 'match', data['lang']) }}" ,
data-placement="right"></span>
</div>
<div class="form-group">
<label class="form-label" for="password1">{{ translate('userConfig', 'repeat', data['lang']) }}
<small class="text-muted ml-1"> - {{ translate('userConfig', 'leaveBlank', data['lang'])
}}</small> </label>
<input type="password" class="form-control" name="password1" id="password1" value=""
autocomplete="new-password" data-lpignore="true" placeholder="Repeat Password" form="dummy">
<span class="passwords-match" ,
data-content="{{ translate('panelConfig', 'match', data['lang']) }}" ,
data-placement="right"></span>
</div>
{% else %}
<div class="form-group">
<label class="form-label" for="username">{{ translate('userConfig', 'userName', data['lang'])
}}<small class="text-muted ml-1"> - {{ translate('userConfig', 'userNameDesc', data['lang'])
}}</small> </label>
<input type="text" class="form-control" name="username" id="username" autocomplete="off"
data-lpignore="true" value="{{ data['user']['username'] }}" placeholder="User Name" disabled>
</div>
{% end %}
<div class="form-group">
<label class="form-label" for="email">{{ translate('userConfig', 'gravEmail', data['lang'])
}}<small class="text-muted ml-1"> - {{ translate('userConfig', 'gravDesc', data['lang'])
}}</small> </label>
<input type="email" class="form-control" name="email" id="email" autocomplete="off"
data-lpignore="true" value="{{ data['user']['email'] }}" placeholder="Gravatar Email">
</div>
<div class="form-group">
<label class="form-label" for="language">{{ translate('userConfig', 'userLang', data['lang'])
}}</label>
<select class="form-select form-control form-control-lg select-css" id="language"
name="lang" form="user_form">
{% for lang in data['languages'] %}
{% if not 'incomplete' in lang %}
<option value="{{lang}}">{{lang}}</option>
{% else %}
<option value="{{lang}}" disabled>{{lang}}</option>
{% end %}
{% end %}
</select>
</div>
<div class="form-group">
<label class="form-label" for="theme">{{ translate('userConfig', 'userTheme', data['lang'])
}}</label>
<select class="form-select form-control form-control-lg select-css" id="theme"
name="theme" form="user_form">
<option value="{{data['user'].get('theme', 'default')}}">{{data['user'].get('theme', 'default')}}</option>
{% for theme in data['themes'] %}
{% if theme != data['user'].get('theme', 'default') %}
<option value="{{theme}}">{{theme}}</option>
{% end %}
{% end %}
</select>
</div>
{% if data['superuser'] %}
<div class="form-group">
<label class="form-label" for="manager">{{ translate('userConfig', 'selectManager',
data['lang']) }}
</label>
<select class="form-select form-control form-control-lg select-css" id="manager" name="manager"
form="user_form">
{% if data["manager"]["username"] != "None" %}
<option value='{{data["manager"]["user_id"]}}'>{{ data["manager"]["username"]
}}</option>
{% end %}
<option value="">None</option>
{% for user in data['users'] %}
{% if user.username != data['user']['username'] and user.user_id != data['manager']['user_id']
%}
<option value="{{user.user_id}}">{{user.username}}</option>
{% end %}
{% end %}
</select>
</div>
{% end %}
</div>
</div>
<div class="card">
<div class="card-header header-sm d-flex justify-content-between align-items-center">
<h4 class="card-title"><i class="fas fa-user-tag"></i> {{ translate('userConfig', 'userRoles',
data['lang']) }} <small class="text-muted ml-1"> - {{ translate('userConfig', 'userRolesDesc',
data['lang']) }}</small></h4>
</div>
<div class="card-body">
<div class="form-group">
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr class="rounded">
<th>{{ translate('userConfig', 'roleName', data['lang']) }}</th>
<th>{{ translate('userConfig', 'member', data['lang']) }}</th>
</tr>
</thead>
<tbody>
{% for role in data['roles'] %}
<tr>
{% if data['superuser'] or role.role_id in data['user']['roles'] or role.manager == data['exec_user'] %}
<td>{{ role.role_name }}</td>
<td>
{% if role.role_id in data['user']['roles'] %}
{% if role.manager == data['exec_user'] or data['superuser'] %}
<input type="checkbox" class="form-check-input role_check"
id="role_{{ role.role_id }}_membership" name="role_{{ role.role_id }}_membership"
checked="" value="{{role.role_id}}" form="dummy">
{% else %}
<input type="checkbox" class="form-check-input role_check"
id="role_{{ role.role_id }}_membership" name="role_{{ role.role_id }}_membership"
checked="" value="{{role.role_id}}" disabled form="dummy">
{% end %}
{% elif data['superuser'] or role.manager == data['exec_user'] %}
<input type="checkbox" class="form-check-input role_check"
id="role_{{ role.role_id }}_membership" name="role_{{ role.role_id }}_membership"
value="{{role.role_id}}" form="dummy">
{% end %}
</td>
{% end %}
</tr>
{% end %}
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- Put Permissions Crafty part here -->
{% if data['superuser'] %}
<div class="card">
<div class="card-header header-sm d-flex justify-content-between align-items-center">
<h4 class="card-title"><i class="fas fa-user-lock"></i> {{ translate('userConfig', 'craftyPerms',
data['lang']) }} <small class="text-muted ml-1"> - {{ translate('userConfig', 'craftyPermDesc',
data['lang']) }}</small></h4>
</div>
<div class="card-body">
<div class="form-group">
<div class="table-responsive">
<table id="permissions" aria-describedby="User Crafty Permissions" class="table table-hover">
<thead>
<tr class="rounded">
<th>{{ translate('userConfig', 'permName', data['lang']) }}</th>
<th>{{ translate('userConfig', 'auth', data['lang']) }}</th>
<th>{{ translate('userConfig', 'uses', data['lang']) }}</th>
</tr>
</thead>
<tbody>
{% for permission in data['permissions_all'] %}
<tr>
<td>{{ permission.name }}</td>
<td>
{% if permission in data['permissions_list'] %}
<input type="checkbox" class="form-check-input perm-name" id="permission_{{ permission.name }}"
name="permission_{{ permission.name }}" checked="" value="1" data-perm="{{permission.name}}" form="dummy">
{% else %}
<input type="checkbox" class="form-check-input perm-name" id="permission_{{ permission.name }}"
name="permission_{{ permission.name }}" value="1" data-perm="{{permission.name}}" form="dummy">
{% end %}
</td>
<td><input type="text" class="form-control" name="quantity_{{ permission.name }}"
id="quantity_{{ permission.name }}"
value="{{ data['quantity_server'][permission.name] }}" data-perm="{{permission.name}}" form="dummy"></td>
</tr>
{% end %}
</tbody>
</table>
</div>
</div>
</div>
</div>
{% end %}
<div class="form-check-flat">
<label for="enabled" class="form-check-label ml-4 mb-4">
{% if data['user']['enabled'] %}
<input type="checkbox" class="form-check-input" id="enabled" name="enabled" checked=""
value="1">{{ translate('userConfig', 'enabled', data['lang']) }}
{% else %}
<input type="checkbox" class="form-check-input" id="enabled" name="enabled" value="1">{{
translate('userConfig', 'enabled', data['lang']) }}
{% end %}
</label>
<label for="superuser" class="form-check-label ml-4 mb-4">
{% if data['user']['superuser'] %}
<input type="checkbox" onclick="superConfirm()" class="form-check-input" id="superuser"
name="superuser" checked="" value="1" {{ data['super-disabled'] }}>{{ translate('userConfig',
'super', data['lang']) }}
{% else %}
<input type="checkbox" onclick="superConfirm()" class="form-check-input" id="superuser"
name="superuser" {{ data['super-disabled'] }} value="1">{{ translate('userConfig', 'super',
data['lang']) }}
{% end %}
</label>
<label for="hints" class="form-check-label ml-4 mb-4">
{% if data['user']['hints'] %}
<input type="checkbox" class="form-check-input" id="hints" name="hints" checked=""
value="1">Enable Hints?
{% else %}
<input type="checkbox" class="form-check-input" id="hints" name="hints" value="1"> Enable
Hints?
{% end %}
</label>
</div>
<button type="submit" class="btn btn-success mr-2"><i class="fas fa-save"></i> {{
translate('panelConfig', 'save', data['lang']) }}</button>
<button type="reset" onclick="location.href='/panel/panel_config'" class="btn btn-light"><i
class="fas fa-undo-alt"></i> {{ translate('panelConfig', 'cancel', data['lang']) }}</button>
</form>
</div>
<div class="col-md-6 col-sm-12">
<div class="card">
<div class="card-body">
<h4 class="card-title"><i class="fas fa-user-cog"></i> {{ translate('userConfig', 'configArea',
data['lang']) }}</h4>
<p class="card-description"> {{ translate('userConfig', 'configAreaDesc', data['lang']) }}</p>
<blockquote class="blockquote">
<p class="mb-0">
{{ translate('userConfig', 'created', data['lang']) }} {{ str(data['user']['created']) }}
<br />
{{ translate('userConfig', 'lastLogin', data['lang']) }} {{ str(data['user']['last_login']) }}
<br />
{{ translate('userConfig', 'lastUpdate', data['lang']) }} {{ str(data['user']['last_update']) }}
<br />
{{ translate('userConfig', 'lastIP', data['lang']) }} {{ data['user']['last_ip'] }}
<br />
{{ translate('userConfig', 'manager', data['lang'])}}: {{data['manager']['username'] }}
<br />
</p>
</blockquote>
</div>
</div>
<div class="text-center">
{% if data['new_user'] %}
<a class="btn btn-sm btn-danger disabled"><i class="fas fa-trash"></i>{{ translate('userConfig',
'deleteUserB', data['lang']) }}</a><br />
<small>{{ translate('userConfig', 'notExist', data['lang']) }}</small>
{% elif data['user']['superuser'] %}
<a class="btn btn-sm btn-danger disabled"><i class="fas fa-trash"></i> {{ translate('userConfig',
'deleteUserB', data['lang']) }}</a><br />
<small>{{ translate('userConfig', 'delSuper', data['lang']) }}</small>
{% else %}
<button class="btn btn-sm btn-danger delete-user"><i class="fas fa-trash"></i> {{
translate('userConfig', 'deleteUserB', data['lang']) }}</a>
{% end %}</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
.popover-body {
color: white !important;
outline: 1px solid red !important;
;
}
</style>
<!-- content-wrapper ends -->
{% end %}
{% block js %}
<script>
const userId = new URLSearchParams(document.location.search).get('id');
function submit_user(event) {
if (!validateForm()) {
event.preventDefault();
} else {
$('#userForm').submit();
}
}
function validateForm() {
let password0 = document.getElementById("password0").value;
let password1 = document.getElementById("password1").value;
if (password0 === "" && password1 === "" && userId){
return true
}
else if (password0 != password1) {
$('.passwords-match').popover('show');
$('.popover-body').click(function () {
$('.passwords-match').popover("hide");
});
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
$("#password0").css("outline", "1px solid red");
$("#password1").css("outline", "1px solid red");
return false;
} else {
return password1;
}
}
function replacer(key, value) {
if (typeof value == "boolean" || key === "email" || key === "permissions" || key === "roles") {
return value
} else {
console.log(key, value)
return (isNaN(value) ? value : +value);
}
}
$("#user_form").on("submit", async function (e) {
e.preventDefault();
let password = null;
if(!userId){
password = validateForm();
if (!password){
return;
}
}
const token = getCookie("_xsrf")
let userRes = await fetch(`/api/v2/users/@me`, {
method: "GET",
headers: {
'X-XSRFToken': token
},
});
let userData = await userRes.json();
let superuser = null;
if (userData.status === "ok") {
superuser = userData.data["superuser"];
edit_id = userData.data["user_id"];
} else {
bootbox.alert({
title: userData.error,
message: userData.error
});
}
let userForm = document.getElementById("user_form");
let disabled_flag = false;
let roles = null;
if (superuser || userId != edit_id){
roles = $('.role_check').map(function() {
if ($(this).attr("disabled")){
disabled_flag = true;
}
if ($(this).is(':checked')){
return $(this).val();
}
}).get();
let avail_permissions = $('.perm-name').map(function() {
return $(this).data("perm");
}).get();
permissions = []
for(i=0; i < avail_permissions.length; i++){
permissions.push({"name": avail_permissions[i], "quantity": $(`#quantity_${avail_permissions[i]}`).val(), "enabled": $(`#permission_${avail_permissions[i]}`).is(':checked')})
}
}
let formData = new FormData(userForm);
//Create an object from the form data entries
let formDataObject = Object.fromEntries(formData.entries());
if(userId){
delete formDataObject.username
}
if (superuser || userId != edit_id){
if (!disabled_flag){
formDataObject.roles = roles;
}
if ($("#permissions").length){
formDataObject.permissions = permissions;
}
if(!userId){
if(typeof password === "string"){
formDataObject.password = password;
}
}
}
formDataObject.enabled = $("#enabled").is(":checked");
if ($("#superuser").is(":enabled")){
formDataObject.superuser = $("#superuser").is(":checked");
}
formDataObject.hints = $("#hints").is(":checked");
console.log(formDataObject);
//We need to make sure these are sent regardless of whether or not they're checked
// Format the plain form data as JSON
let formDataJsonString = JSON.stringify(formDataObject, replacer);
console.log(formDataJsonString);
if (userId){
url = `/api/v2/users/${userId}`
method = 'PATCH'
}else{
url = `/api/v2/users/`
method = 'POST'
}
let res = await fetch(url, {
method: method,
headers: {
'X-XSRFToken': token
},
body: formDataJsonString,
});
let responseData = await res.json();
if (responseData.status === "ok") {
window.location.href = "/panel/panel_config";
} else {
if (responseData.hasOwnProperty("error_data")){
bootbox.alert({
title: responseData.error,
message: responseData.error_data
});
}else{
bootbox.alert(responseData.error
);
}
}
});
$(".delete-user").click(function () {
var file_to_del = $(this).data("file");
console.log("User to delete is " + userId);
bootbox.confirm({
title: "{% raw translate('userConfig', 'deleteUser', data['lang']) %} " + userId,
message: "{{ translate('userConfig', 'confirmDelete', data['lang']) }}",
buttons: {
cancel: {
label: '<i class="fas fa-times"></i> {{ translate("serverBackups", "cancel", data['lang']) }}'
},
confirm: {
className: 'btn-outline-danger',
label: '<i class="fas fa-check"></i> {{ translate("serverBackups", "confirm", data['lang']) }}'
}
},
callback: async function (result) {
console.log(result);
if (result === true) {
const token = getCookie("_xsrf")
let res = await fetch(`/api/v2/users/${userId}`, {
method: "DELETE",
headers: {
'X-XSRFToken': token
},
});
let responseData = await res.json();
if (responseData.status === "ok") {
window.location.href = "/panel/panel_config";
} else {
bootbox.alert({
title: responseData.error,
message: responseData.error
});
}
}
}
});
});
function superConfirm() {
if (document.getElementById('superuser').checked) {
bootbox.confirm({
title: "{{ translate('panelConfig', 'superConfirmTitle', data['lang']) }}",
message: "{{ translate('panelConfig', 'superConfirm', data['lang']) }}",
buttons: {
cancel: {
label: '<i class="fa fa-times"></i> {{ translate('panelConfig', 'cancel', data['lang']) }}'
},
confirm: {
className: 'btn-outline-warning',
label: '<i class="fa fa-check"></i> {{ translate('serverBackups', 'confirm', data['lang']) }}'
}
},
callback: function (result) {
if (result === true) {
return;
} else {
document.getElementById('superuser').checked = false;
}
}
});
} else {
return
}
}
//used to get cookies from browser - this is part of tornados xsrf protection - it's for extra security
function getCookie(name) {
var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
return r ? r[1] : undefined;
}
$(document).ready(function () {
console.log("ready!");
});
</script>
{% end %}