<?= $this->extend('layouts/smarthome'); ?>
<?= $this->section('css'); ?>
<link href="/assets/DataTables/datatables.css" rel="stylesheet"/>   
<?= $this->endSection(); ?>
<?= $this->section('menu'); ?>
    <?= $this->include('menu/dashboard_menu') ?>
<?= $this->endSection(); ?>

<?= $this->section('content'); ?>
    <div class="modal fade" id="modalInviteUser" tabindex="-1" aria-labelledby="Invite User Dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="modalTitle">Benutzer Registrierungslink schicken</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form id="inviteuser" method="post" action="/inviteUser">
                        <div class="form-floating mb-2">
                            <input type="email" name="email" id="email" onchange="add(this);" inputmode="email" autocomplete="email" class="form-control" placeholder="Email" value="<?= set_value('email', $email??'') ?>">
                            <label for="email">Email</label>
                        </div>
                        <div class="d-grid col-12 col-md-8 mx-auto m-3">
                            <button type="submit" class="btn btn-primary btn-block">sende Email</button>
                        </div>
                    </form>
                </div>
                <div class="modal-footer d-none">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Send Email</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="modalChangeUser" tabindex="-1" aria-labelledby="Change User Dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="modalTitle">Benutzer ändern</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form id="edituser" method="post" action="/editUser">
                        <input type="hidden" value=0 name="id" class="changed" id="fuserid">
                        <div class="form-group row my-2">
                            <label for="username" class="col-sm-3 col-form-label">Name</label>
                            <div class="col-sm-9">
                                <input type="text" name="username" id="username" onchange="add(this);" class="form-control" placeholder="Name" value="<?= set_value('username', $username??'') ?>">
                            </div>
                        </div>
                        <div class="form-group row my-2">
                            <label for="email" class="col-sm-3 col-form-label">Email</label>
                            <div class="col-sm-9">
                                <input type="email" name="email" id="email" onchange="add(this);" class="form-control" placeholder="Email" value="<?= set_value('email', $email??'') ?>">
                            </div>
                        </div>
                        <div class="form-group row my-2 mb-3">
                            <label for="group" class="form-label">Auswahl Gruppen</label>
                            <?php foreach ($allowedGroups as $val => $item) : ?>
                            <div class="form-switch">
                                <input class="form-check-input" type="checkbox" onchange="add(this);" role="switch" value="<?=$val?>" name="group[]" id="group<?= $val; ?>">
                                <label for="group[<?= $val; ?>]" class="form-check-label"><?=  $item ?></label>
                            </div>
                            <?php endforeach; ?>
                        </div>
                        <button type="submit" name="cmnd" value="change" id="modalsave" data-bs-toggle="modal" data-bs-target="#myModal" class="btn btn-primary">Submit</button>
                        <button type="submit" name="cmnd" value="resetPWD" id="modal_reset" data-bs-toggle="modal" data-bs-target="#myModal" class="btn btn-warning">Passwort Reset</button>
                        <button type="submit" name="cmnd" value="banUser" id="modal_ban" data-bs-toggle="modal" data-bs-target="#myModal" class="btn btn-danger">Zugang Sperren</button>
                    </form>
                </div>
                <div class="modal-footer d-none">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="submit" id="modal_save" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>
<div class="container-lg ms-0">
    <table class="table table-striped table-sm display no-wrap" id="usersTable" width="100%" cellspacing="0"
        data-paging="false" 
        data-scrollX="false" 
        data-info="false" 
        data-responsive="{details: false}"
        data-order='[[ 2, "desc" ]]''
        data-ajax='{"url":"/viewUsers","dataSrc":""}'>
    </table>
</div>
<?= $this->endSection(); ?>
<?= $this->section('scripts'); ?>
    <script src="/js/userstab.js"></script>   
    <script src="/assets/DataTables/datatables.js"></script>
<?= $this->endSection(); ?>