🚸 (admin): rework user pages

This commit is contained in:
Kazhnuz 2025-01-18 16:11:19 +01:00
parent 6a39877747
commit 466afdbbf4
3 changed files with 129 additions and 106 deletions

View file

@ -2,24 +2,26 @@
<?php echo Bootstrap::formOpen(array('id' => 'jsform', 'class' => 'tab-content')); ?> <?php echo Bootstrap::formOpen(array('id' => 'jsform', 'class' => 'tab-content')); ?>
<div class="align-middle"> <div class="d-flex justify-content-between mb-2">
<div class="float-right mt-1">
<button type="submit" class="btn btn-primary btn-sm" name="save"><?php $L->p('Save') ?></button>
<a class="btn btn-secondary btn-sm" href="<?php echo HTML_PATH_ADMIN_ROOT . 'users' ?>" role="button"><?php $L->p('Cancel') ?></a>
</div>
<?php echo Bootstrap::pageTitle(array('title' => $L->g('Edit user'), 'icon' => 'user')); ?> <?php echo Bootstrap::pageTitle(array('title' => $L->g('Edit user'), 'icon' => 'user')); ?>
<div>
<button type="submit" class="btn btn-primary" name="save"><?php $L->p('Save') ?></button>
<a class="btn btn-secondary" href="<?php echo HTML_PATH_ADMIN_ROOT . 'users' ?>" role="button"><?php $L->p('Cancel') ?></a>
</div>
</div> </div>
<!-- TABS --> <div class="d-flex align-items-start">
<nav class="mb-3"> <div>
<div class="nav nav-tabs" id="nav-tab" role="tablist"> <!-- TABS -->
<a class="nav-item nav-link active" id="nav-profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="nav-profile" aria-selected="false"><?php $L->p('Profile') ?></a> <nav>
<a class="nav-item nav-link" id="nav-picture-tab" data-toggle="tab" href="#picture" role="tab" aria-controls="nav-picture" aria-selected="false"><?php $L->p('Profile picture') ?></a> <div class="nav flex-column nav-pills me-3" id="nav-tab" role="tablist">
<a class="nav-item nav-link" id="nav-security-tab" data-toggle="tab" href="#security" role="tab" aria-controls="nav-security" aria-selected="false"><?php $L->p('Security') ?></a> <a class="nav-item nav-link active" id="nav-profile-tab" data-bs-toggle="tab" data-bs-target="#profile" role="tab" aria-controls="nav-profile" aria-selected="false"><?php $L->p('Profile') ?></a>
<a class="nav-item nav-link" id="nav-social-tab" data-toggle="tab" href="#social" role="tab" aria-controls="nav-social" aria-selected="false"><?php $L->p('Social Networks') ?></a> <a class="nav-item nav-link" id="nav-picture-tab" data-bs-toggle="tab" data-bs-target="#picture" role="tab" aria-controls="nav-picture" aria-selected="false"><?php $L->p('Profile picture') ?></a>
<a class="nav-item nav-link" id="nav-security-tab" data-bs-toggle="tab" data-bs-target="#security" role="tab" aria-controls="nav-security" aria-selected="false"><?php $L->p('Security') ?></a>
<a class="nav-item nav-link" id="nav-social-tab" data-bs-toggle="tab" data-bs-target="#social" role="tab" aria-controls="nav-social" aria-selected="false"><?php $L->p('Social Networks') ?></a>
</div>
</nav>
</div> </div>
</nav>
<?php <?php
// Token CSRF // Token CSRF
echo Bootstrap::formInputHidden(array( echo Bootstrap::formInputHidden(array(
@ -34,12 +36,12 @@ echo Bootstrap::formInputHidden(array(
)); ));
?> ?>
<div class="tab-content" id="nav-tabContent"> <div class="tab-content w-100" id="nav-tabContent">
<!-- Profile tab --> <!-- Profile tab -->
<div class="tab-pane fade show active" id="profile" role="tabpanel" aria-labelledby="nav-profile-tab"> <div class="tab-pane fade show active" id="profile" role="tabpanel" aria-labelledby="nav-profile-tab">
<?php <?php
echo Bootstrap::formTitle(array('title' => $L->g('Base Infos'))); echo Bootstrap::cardBegin($L->g('Base Infos'));
// Display username but disable the field // Display username but disable the field
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
@ -72,7 +74,8 @@ echo Bootstrap::formInputHidden(array(
'tip' => '' 'tip' => ''
)); ));
echo Bootstrap::formTitle(array('title' => $L->g('Name'))); echo Bootstrap::cardEnd();
echo Bootstrap::cardBegin($L->g('Name'));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name' => 'nickname', 'name' => 'nickname',
@ -109,8 +112,8 @@ echo Bootstrap::formInputHidden(array(
'class' => '', 'class' => '',
'tip' => $L->g('if-not-present-fallback-on-username') 'tip' => $L->g('if-not-present-fallback-on-username')
)); ));
echo Bootstrap::cardEnd();
echo Bootstrap::formTitle(array('title' => $L->g('More Infos'))); echo Bootstrap::cardBegin($L->g('More Infos'));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name' => 'pronouns', 'name' => 'pronouns',
@ -138,22 +141,26 @@ echo Bootstrap::formInputHidden(array(
'placeholder' => '', 'placeholder' => '',
'tip' => '' 'tip' => ''
)); ));
echo Bootstrap::cardEnd();
?> ?>
</div> </div>
<!-- Profile picture tab --> <!-- Profile picture tab -->
<div class="tab-pane fade" id="picture" role="tabpanel" aria-labelledby="nav-picture-tab"> <div class="tab-pane fade" id="picture" role="tabpanel" aria-labelledby="nav-picture-tab">
<div class="container"> <div class="card">
<div class="row"> <h6 class="card-header"><?php echo $L->g('Profile picture'); ?></h6>
<div class="col-lg-4 col-sm-12 p-0 pr-2"> <div class="container card-body">
<div class="custom-file"> <div class="row">
<input type="file" class="custom-file-input" id="jsprofilePictureInputFile" name="profilePictureInputFile"> <div class="col-lg-4 col-sm-12 p-0 pr-2">
<label class="custom-file-label" for="jsprofilePictureInputFile"><?php $L->p('Upload image'); ?></label> <div class="custom-file">
<input type="file" class="form-control custom-file-input" id="jsprofilePictureInputFile" name="profilePictureInputFile">
<label class="custom-file-label" for="jsprofilePictureInputFile"><?php $L->p('Upload image'); ?></label>
</div>
<!-- <button id="jsbuttonRemovePicture" type="button" class="btn btn-primary w-100 mt-4 mb-4"><i class="fa fa-trash"></i> Remove picture</button> -->
</div>
<div class="col-lg-8 col-sm-12 p-0 text-center">
<img id="jsprofilePicturePreview" class="img-fluid img-thumbnail" alt="Profile picture preview" src="<?php echo (Sanitize::pathFile(PATH_UPLOADS_PROFILES . $user->username() . '.png') ? DOMAIN_UPLOADS_PROFILES . $user->username() . '.png?version=' . time() : HTML_PATH_CORE_IMG . 'default.svg') ?>" />
</div> </div>
<!-- <button id="jsbuttonRemovePicture" type="button" class="btn btn-primary w-100 mt-4 mb-4"><i class="fa fa-trash"></i> Remove picture</button> -->
</div>
<div class="col-lg-8 col-sm-12 p-0 text-center">
<img id="jsprofilePicturePreview" class="img-fluid img-thumbnail" alt="Profile picture preview" src="<?php echo (Sanitize::pathFile(PATH_UPLOADS_PROFILES . $user->username() . '.png') ? DOMAIN_UPLOADS_PROFILES . $user->username() . '.png?version=' . time() : HTML_PATH_CORE_IMG . 'default.svg') ?>" />
</div> </div>
</div> </div>
</div> </div>
@ -190,7 +197,7 @@ echo Bootstrap::formInputHidden(array(
<!-- Security tab --> <!-- Security tab -->
<div class="tab-pane fade" id="security" role="tabpanel" aria-labelledby="nav-security-tab"> <div class="tab-pane fade" id="security" role="tabpanel" aria-labelledby="nav-security-tab">
<?php <?php
echo Bootstrap::formTitle(array('title' => $L->g('Password'))); echo Bootstrap::cardBegin($L->g('Password'));
echo ' echo '
<div class="form-group"> <div class="form-group">
@ -208,8 +215,9 @@ echo Bootstrap::formInputHidden(array(
'tip' => $L->g('this-token-is-similar-to-a-password-it-should-not-be-shared') 'tip' => $L->g('this-token-is-similar-to-a-password-it-should-not-be-shared')
)); ));
echo Bootstrap::cardEnd();
if (checkRole(array('admin'), false)) { if (checkRole(array('admin'), false)) {
echo Bootstrap::formTitle(array('title' => $L->g('Status'))); echo Bootstrap::cardBegin($L->g('Status'));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name' => 'status', 'name' => 'status',
@ -225,13 +233,14 @@ echo Bootstrap::formInputHidden(array(
<div class="form-group row"> <div class="form-group row">
<div class="col-sm-2"></div> <div class="col-sm-2"></div>
<div class="col-sm-10"> <div class="col-sm-10">
<button type="submit" class="btn btn-warning mr-2" id="jsdisableUser" name="disableUser">' . $L->g('Disable user') . '</button> <button type="submit" class="btn btn-warning me-2" id="jsdisableUser" name="disableUser">' . $L->g('Disable user') . '</button>
<button type="submit" class="btn btn-danger mr-2" id="jsdeleteUserAndKeepContent" name="deleteUserAndKeepContent">' . $L->g('Delete user and keep content') . '</button> <button type="submit" class="btn btn-danger me-2" id="jsdeleteUserAndKeepContent" name="deleteUserAndKeepContent">' . $L->g('Delete user and keep content') . '</button>
<button type="submit" class="btn btn-danger mr-2" id="jsdeleteUserAndDeleteContent" name="deleteUserAndDeleteContent">' . $L->g('Delete user and delete content') . '</button> <button type="submit" class="btn btn-danger me-2" id="jsdeleteUserAndDeleteContent" name="deleteUserAndDeleteContent">' . $L->g('Delete user and delete content') . '</button>
</div> </div>
</div> </div>
'; ';
} }
echo Bootstrap::cardEnd();
} }
?> ?>
</div> </div>
@ -239,6 +248,7 @@ echo Bootstrap::formInputHidden(array(
<!-- Social Networks tab --> <!-- Social Networks tab -->
<div class="tab-pane fade" id="social" role="tabpanel" aria-labelledby="nav-social-tab"> <div class="tab-pane fade" id="social" role="tabpanel" aria-labelledby="nav-social-tab">
<?php <?php
echo Bootstrap::cardBegin($L->g('Social Networks'));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name' => 'twitter', 'name' => 'twitter',
'label' => 'Twitter', 'label' => 'Twitter',
@ -337,6 +347,7 @@ echo Bootstrap::formInputHidden(array(
'placeholder' => '', 'placeholder' => '',
'tip' => '' 'tip' => ''
)); ));
echo Bootstrap::cardEnd();
?> ?>
</div> </div>
</div> </div>
@ -357,3 +368,4 @@ echo Bootstrap::formInputHidden(array(
} }
}); });
</script> </script>
</div>

View file

@ -2,66 +2,70 @@
<?php echo Bootstrap::formOpen(array('id'=>'jsform', 'class'=>'tab-content')); ?> <?php echo Bootstrap::formOpen(array('id'=>'jsform', 'class'=>'tab-content')); ?>
<div class="align-middle"> <div class="d-flex justify-content-between mb-2">
<div class="float-right mt-1">
<button type="submit" class="btn btn-primary btn-sm" name="save"><?php $L->p('Save') ?></button>
<a class="btn btn-secondary btn-sm" href="<?php echo HTML_PATH_ADMIN_ROOT.'users' ?>" role="button"><?php $L->p('Cancel') ?></a>
</div>
<?php echo Bootstrap::pageTitle(array('title'=>$L->g('Add a new user'), 'icon'=>'user')); ?> <?php echo Bootstrap::pageTitle(array('title'=>$L->g('Add a new user'), 'icon'=>'user')); ?>
<div>
<button type="submit" class="btn btn-primary" name="save"><?php $L->p('Save') ?></button>
<a class="btn btn-secondary" href="<?php echo HTML_PATH_ADMIN_ROOT.'users' ?>" role="button"><?php $L->p('Cancel') ?></a>
</div>
</div> </div>
<?php <div class="card">
echo Bootstrap::formInputHidden(array( <div class="card-body">
'name'=>'tokenCSRF', <?php
'value'=>$security->getTokenCSRF() echo Bootstrap::formInputHidden(array(
)); 'name'=>'tokenCSRF',
'value'=>$security->getTokenCSRF()
));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name'=>'new_username', 'name'=>'new_username',
'label'=>$L->g('Username'), 'label'=>$L->g('Username'),
'value'=>(isset($_POST['new_username'])?$_POST['new_username']:''), 'value'=>(isset($_POST['new_username'])?$_POST['new_username']:''),
'class'=>'', 'class'=>'',
'placeholder'=>'', 'placeholder'=>'',
'tip'=>'' 'tip'=>''
)); ));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name'=>'new_password', 'name'=>'new_password',
'type'=>'password', 'type'=>'password',
'label'=>$L->g('Password'), 'label'=>$L->g('Password'),
'value'=>'', 'value'=>'',
'class'=>'', 'class'=>'',
'placeholder'=>'', 'placeholder'=>'',
'tip'=>'' 'tip'=>''
)); ));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name'=>'confirm_password', 'name'=>'confirm_password',
'type'=>'password', 'type'=>'password',
'label'=>$L->g('Confirm Password'), 'label'=>$L->g('Confirm Password'),
'value'=>'', 'value'=>'',
'class'=>'', 'class'=>'',
'placeholder'=>'', 'placeholder'=>'',
'tip'=>'' 'tip'=>''
)); ));
echo Bootstrap::formSelect(array( echo Bootstrap::formSelect(array(
'name'=>'role', 'name'=>'role',
'label'=>$L->g('Role'), 'label'=>$L->g('Role'),
'options'=>array('author'=>$L->g('Author'), 'editor'=>$L->g('Editor'), 'admin'=>$L->g('Administrator')), 'options'=>array('author'=>$L->g('Author'), 'editor'=>$L->g('Editor'), 'admin'=>$L->g('Administrator')),
'selected'=>'Author', 'selected'=>'Author',
'class'=>'', 'class'=>'',
'tip'=>$L->g('author-can-write-and-edit-their-own-content') 'tip'=>$L->g('author-can-write-and-edit-their-own-content')
)); ));
echo Bootstrap::formInputText(array( echo Bootstrap::formInputText(array(
'name'=>'email', 'name'=>'email',
'label'=>$L->g('Email'), 'label'=>$L->g('Email'),
'value'=>(isset($_POST['email'])?$_POST['email']:''), 'value'=>(isset($_POST['email'])?$_POST['email']:''),
'class'=>'', 'class'=>'',
'placeholder'=>'', 'placeholder'=>'',
'tip'=>'' 'tip'=>''
)); ));
?> ?>
<?php echo Bootstrap::formClose(); ?> <?php echo Bootstrap::formClose(); ?>
</div>
</div>

View file

@ -2,36 +2,42 @@
<?php <?php
echo "<div class='d-flex justify-content-between align-content-center'>";
echo Bootstrap::pageTitle(array('title'=>$L->g('Users'), 'icon'=>'users')); echo Bootstrap::pageTitle(array('title'=>$L->g('Users'), 'icon'=>'users'));
echo "<div>";
echo Bootstrap::link(array( echo Bootstrap::link(array(
'title'=>$L->g('add-a-new-user'), 'title'=>$L->g('add-a-new-user'),
'href'=>HTML_PATH_ADMIN_ROOT.'new-user', 'href'=>HTML_PATH_ADMIN_ROOT.'new-user',
'icon'=>'plus' 'icon'=>'plus',
'class'=>'btn btn-outline-success'
)); ));
echo ' echo '
<table class="table table-striped mt-3"> </div></div>
<thead> <div class="card">
<tr> <table class="table m-0">
<th class="border-bottom-0" scope="col">'.$L->g('Username').'</th> <thead>
<th class="border-bottom-0 d-none d-lg-table-cell" scope="col">'.$L->g('Nickname').'</th> <tr class="card-header">
<th class="border-bottom-0" scope="col">'.$L->g('Email').'</th> <th class="border-bottom-0" scope="col">'.$L->g('User').'</th>
<th class="border-bottom-0" scope="col">'.$L->g('Status').'</th> <th class="border-bottom-0 d-none d-lg-table-cell" scope="col">'.$L->g('Username').'</th>
<th class="border-bottom-0" scope="col">'.$L->g('Role').'</th> <th class="border-bottom-0" scope="col">'.$L->g('Email').'</th>
<th class="border-bottom-0 d-none d-lg-table-cell" scope="col">'.$L->g('Registered').'</th> <th class="border-bottom-0" scope="col">'.$L->g('Status').'</th>
</tr> <th class="border-bottom-0" scope="col">'.$L->g('Role').'</th>
</thead> <th class="border-bottom-0 d-none d-lg-table-cell" scope="col">'.$L->g('Registered').'</th>
<tbody> </tr>
</thead>
<tbody>
'; ';
$list = $users->keys(); $list = $users->keys();
foreach ($list as $username) { foreach ($list as $username) {
try { try {
$user = new User($username); $user = new User($username);
echo '<tr>'; echo '<tr class="card-tablebody">';
echo '<td><img class="profilePicture mr-1" alt="" src="'.(Sanitize::pathFile(PATH_UPLOADS_PROFILES.$user->username().'.png')?DOMAIN_UPLOADS_PROFILES.$user->username().'.png':HTML_PATH_CORE_IMG.'default.svg').'" /><a href="'.HTML_PATH_ADMIN_ROOT.'edit-user/'.$username.'">'.$username.'</a></td>'; echo '<td><img class="profilePicture me-1" alt="" src="'.(Sanitize::pathFile(PATH_UPLOADS_PROFILES.$user->username().'.png')?DOMAIN_UPLOADS_PROFILES.$user->username().'.png':HTML_PATH_CORE_IMG.'default.svg').'" /><a href="'.HTML_PATH_ADMIN_ROOT.'edit-user/'.$username.'">'.$user->displayName().'</a></td>';
echo '<td class="d-none d-lg-table-cell">'.$user->nickname().'</td>'; echo '<td class="d-none d-lg-table-cell">'.$user->username().'</td>';
echo '<td>'.$user->email().'</td>'; echo '<td>'.$user->email().'</td>';
echo '<td>'.($user->enabled()?'<b>'.$L->g('Enabled').'</b>':$L->g('Disabled')).'</td>'; echo '<td>'.($user->enabled()?'<b>'.$L->g('Enabled').'</b>':$L->g('Disabled')).'</td>';
if ($user->role()=='admin') { if ($user->role()=='admin') {
@ -51,6 +57,7 @@ foreach ($list as $username) {
} }
echo ' echo '
</tbody> </tbody>
</table> </table>
</div>
'; ';