UserManagement.php-Dateireferenz

Funktionen
<?=$this->	extend ('Layouts/MemberLogin') ?><?
function	editUser (userId)
function	deleteUser (userId)
function	loadRoles (selectedRoleId=null)
function	loadDepartments (selectedDepartmentId=null)
function	saveUserChanges ()
function	loadUsers ()
document	addEventListener ("DOMContentLoaded", function() { loadUsers();})

Variablen
<?=$this-> table	td
	btn
font	size
</style >< div class="container-xxl flex-grow-1 container-p-y">< div class="row">< div class="col-12 mb-4">< div class="card">< div class="card-header">< h1 class="page-title"> Mitarbeiterliste</h1 ></div >< div class="card-body">< div class="table-responsive">< table id="mitarbeiterTabelle" class="table table-bordered display">< thead >< tr >< th > ID</th >< th > Vorname</th >< th > Nachname</th >< th > Email</th >< th > Rolle</th >< th > Abteilung</th >< th > Aktionen</th ></tr ></thead >< tbody ><!-- Inhalte werden dynamisch mit JavaScript eingefügt --></tbody ></table ></div ></div ></div ></div ></div ></div ><!-- Bootstrap Modal -->< div class="modal fade" id="editUserModal" tabindex="-1" aria-labelledby="editUserModalLabel" aria-hidden="true">< div class="modal-dialog">< div class="modal-content">< div class="modal-header">< h5 class="modal-title" id="editUserModalLabel"> Mitarbeiter bearbeiten</h5 >< button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button ></div >< div class="modal-body">< form id="editUserForm">< input type="hidden" id="userId">< div class="mb-3">< label for="firstName" class="form-label"> Vorname</label >< input type="text" class="form-control" id="firstName" required ></div >< div class="mb-3">< label for="lastName" class="form-label"> Nachname</label >< input type="text" class="form-control" id="lastName" required ></div >< div class="mb-3">< label for="email" class="form-label"> E Mail</label >< input type="email" class="form-control" id="email" required ></div >< div class="mb-3">< label for="role" class="form-label"> Rolle</label >< select class="form-select" id="role" required ></select ></div >< div class="mb-3">< label for="department" class="form-label"> Abteilung</label >< select class="form-select" id="department" required ></select ></div ></form ></div >< div class="modal-footer">< button type="button" class="btn btn-secondary" data-bs-dismiss="modal"> Schließen</button >< button type="button" class="btn btn-primary" onclick="saveUserChanges()"> Änderungen speichern</button ></div ></div ></div ></div >< script > const	apiBaseUrl = "<?= base_url() ?>api/user-management"

Dokumentation der Funktionen

addEventListener()

document addEventListener	(	"DOMContentLoaded"	,
		function() { loadUsers();}	)

deleteUser()

function deleteUser

(

userId

)

editUser()

function editUser

(

userId

)

extend()

<?=$this-> extend

(

'Layouts/MemberLogin'

)

loadDepartments()

function loadDepartments

(

selectedDepartmentId

= null

)

loadRoles()

function loadRoles

(

selectedRoleId

= null

)

loadUsers()

function loadUsers

(

)

saveUserChanges()

function saveUserChanges

(

)

Variablen-Dokumentation

apiBaseUrl

</style><div class="container-xxl flex-grow-1 container-p-y"><div class="row"><div class="col-12 mb-4"><div class="card"><div class="card-header"><h1 class="page-title"> Mitarbeiterliste</h1></div><div class="card-body"><div class="table-responsive"><table id="mitarbeiterTabelle" class="table table-bordered display"><thead><tr><th> ID</th><th> Vorname</th><th> Nachname</th><th> Email</th><th> Rolle</th><th> Abteilung</th><th> Aktionen</th></tr></thead><tbody><!-- Inhalte werden dynamisch mit JavaScript eingefügt --></tbody></table></div></div></div></div></div></div><!-- Bootstrap Modal --><div class="modal fade" id="editUserModal" tabindex="-1" aria-labelledby="editUserModalLabel" aria-hidden="true"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="editUserModalLabel"> Mitarbeiter bearbeiten</h5><button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><form id="editUserForm"><input type="hidden" id="userId"><div class="mb-3"><label for="firstName" class="form-label"> Vorname</label><input type="text" class="form-control" id="firstName" required></div><div class="mb-3"><label for="lastName" class="form-label"> Nachname</label><input type="text" class="form-control" id="lastName" required></div><div class="mb-3"><label for="email" class="form-label"> E Mail</label><input type="email" class="form-control" id="email" required></div><div class="mb-3"><label for="role" class="form-label"> Rolle</label><select class="form-select" id="role" required></select></div><div class="mb-3"><label for="department" class="form-label"> Abteilung</label><select class="form-select" id="department" required></select></div></form></div><div class="modal-footer"><button type="button" class="btn btn-secondary" data-bs-dismiss="modal"> Schließen</button><button type="button" class="btn btn-primary" onclick="saveUserChanges()"> Änderungen speichern</button></div></div></div></div><script> const apiBaseUrl = "<?= base_url() ?>api/user-management"

btn

btn

Initialisierung:

{
        padding: 8px 16px

size

font size

td

<?=$this-> table td

Initialisierung:

{
        text-align: center