<?php
    //////////////// POST ACTION TO CHANGE staff STATUS ///
    if(isset($_POST['change_status_btn'])){
        $status_id = $_POST['staff_hidden_id'];
        $staff_status = $_POST['staff_status'];

        $query = " UPDATE `staff` SET 
                                    `status` = '{$staff_status}' WHERE `id` = '{$status_id}' ";
        $run_query = mysqli_query($connection, $query);

        if($run_query == true){
            $_SESSION['msg'] = "Staff Status Changed";
        		$_SESSION['type'] = "success";  
        }else{
            $_SESSION['msg'] = "Staff Status Changed Failed.";
        		$_SESSION['type'] = "error";  
        }
        // Redirect once after logic
    header("Location: view_staff");
    exit();
    }
?>

<?php
if (isset($_POST['staff_delete_btn'])) {
    $delete_id = $_POST['staff_hidden_id']; // Staff ID to delete

    if (!empty($delete_id)) {
            // Delete the Staff
            $query2 = "DELETE FROM `staff` WHERE `id` = ?";
            $stmt2 = $connection->prepare($query2);
            $stmt2->bind_param("i", $delete_id);
            $result2 = $stmt2->execute();
            $stmt2->close();

            if($run_query == true){
            	$_SESSION['msg'] = "Staff and Related Records Deleted Successfully";
        		$_SESSION['type'] = "success";
                
            } else {
            $_SESSION['msg'] = "Staff Record not Deleted.";
        		$_SESSION['type'] = "error";                
            }        
   }
   // Redirect once after logic
    header("Location: view_staff");
    exit();
    
}
?>



<div class="page-title">
  <div>
    <h1><i class="fa fa-users"></i> Staff</h1>
    <p>View all staff</p>
  </div>
  
</div>
<div class="card">
    <div class="table-scrol">
        <div class='panel panel-primary ch'>
            <div class='panel-heading'>
                <h4 align="center">All staff</h4>
            </div>
            <div class='panel-body'>
            <div class='mb-3 text-right'>
                        <button class="btn btn-success" data-toggle="modal" data-target="#addStaffModal">➕ Add Staff</button>
                    </div>
<?php
$query = "SELECT * FROM `staff`";
$run_query = mysqli_query($connection, $query);

if (mysqli_num_rows($run_query) > 0) {
    $i = 0;
    $staffList = [];

    echo "
        <div class='table-responsive'>
            <table class='table table-hover table-bordered' id='myTable'>
                <thead>
                    <tr>
                        <th>S/N</th>
                        <th>USERNAME</th>
                        <th>NAME</th>
                        <th>SEX</th>
                        <th>PHONE</th>
                        <th>ROLE</th>
                        <th>STATUS</th>
                        <th>ACTION</th>
                    </tr>
                </thead>
                <tbody>
    ";

    while ($result = mysqli_fetch_assoc($run_query)) {
        $i++;
        $staffList[] = $result;
        $staff_id = $result['id'];
        $username = $result['username'];
        $name = $result['name'];
        $sex = $result['sex'];
        $phone = $result['phone'];
        $position = $result['role'];
        $status = $result['status'];

        echo "
            <tr>
                <td>{$i}</td>
                <td>{$username}</td>
                <td>{$name}</td>
                <td>{$sex}</td>
                <td>{$phone}</td>
                <td>{$position}</td>
                <td class='text-success'><b>{$status}</b></td>
                <td>
                    <form method='POST' action='' style='display:inline-block;'>
                        <input type='hidden' name='staff_hidden_id' value='{$staff_id}' />
                        <select name='staff_status' class='form-control'>
                            <option selected>{$status}</option>
                            <option>Active</option>
                            <option>Suspend</option>
                            <option>On Leave</option>
                        </select>
                        <input type='submit' name='change_status_btn' value='Status' class='btn btn-xs btn-info' />
                        <input type='submit' name='staff_delete_btn' value='Delete' class='btn btn-xs btn-danger' />
                    </form>

                    <button type='button' class='btn btn-xs btn-primary mt-1' data-toggle='modal' data-target='#editStaffModal{$staff_id}'>Edit</button>
                </td>
            </tr>
        ";
    }

    echo "
                </tbody>
            </table>
        </div>
    ";

    foreach ($staffList as $staff) {
        $staff_id = $staff['id'];
        ?>
        <div class="modal fade" id="editStaffModal<?= $staff_id ?>" tabindex="-1" role="dialog" aria-labelledby="editStaffModalLabel<?= $staff_id ?>" aria-hidden="true">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <form method="POST" enctype="multipart/form-data">
                        <div class="modal-header">
                            <h5 class="modal-title">Edit Staff</h5>
                            <button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
                        </div>
                        <div class="modal-body">
                            <input type="hidden" name="edit_staff_id" value="<?= $staff_id ?>">
                            <div class='form-group text-center'>
                                <label for='uploadImage'><b>Upload Staff Image</b></label><br>
                                <img id='preview<?= $staff_id ?>' src='../<?= htmlspecialchars($staff['passport']) ?>' class='img-thumbnail rounded-circle mb-2' width='150' height='150' alt='Profile Preview'>
                                <input type='file' name='file' id='uploadImage<?= $staff_id ?>' class='form-control-file d-block mx-auto' onchange="previewImage(event, 'preview<?= $staff_id ?>')">
                            </div>
                            <div class="form-group">
                                <label>Username</label>
                                <input type="text" name="username" value="<?= htmlspecialchars($staff['username']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>Full Name</label>
                                <input type="text" name="name" value="<?= htmlspecialchars($staff['name']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>Date of Birth</label>
                                <input type="text" name="dob" value="<?= htmlspecialchars($staff['dob']) ?>" class="form-control datepicker" required>
                            </div>
                            <div class="form-group">
                                <label>Role</label>
                                <input type="text" name="role" value="<?= htmlspecialchars($staff['role']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>Country</label>
                                <input type="text" name="country" value="<?= htmlspecialchars($staff['country']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>State</label>
                                <input type="text" name="state" value="<?= htmlspecialchars($staff['state']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>LGA</label>
                                <input type="text" name="lga" value="<?= htmlspecialchars($staff['lga']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>Sex</label>
                                <select name="sex" class="form-control" required>
                                    <option <?= $staff['sex'] == 'Male' ? 'selected' : '' ?>>Male</option>
                                    <option <?= $staff['sex'] == 'Female' ? 'selected' : '' ?>>Female</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label>Address</label>
                                <input type="text" name="address" value="<?= htmlspecialchars($staff['address']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>Phone</label>
                                <input type="text" name="phone" value="<?= htmlspecialchars($staff['phone']) ?>" class="form-control" required>
                            </div>
                            <div class="form-group">
                                <label>Email</label>
                                <input type="email" name="email" value="<?= htmlspecialchars($staff['email']) ?>" class="form-control" required>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" name="update_staff_btn" class="btn btn-success">Update Staff</button>
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <?php
    }
} else {
    echo "<p class='text-danger'><b>No staff found.</b></p>";
}
?>


                <!-- DataTable JS init -->
            </div>
        </div>
    </div>
</div>

<!-- Staff Registration Modal -->
<div class="modal fade" id="addStaffModal" tabindex="-1" role="dialog" aria-labelledby="addStaffModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <form action="" method="POST" enctype="multipart/form-data">
                <div class="modal-header">
                    <h5 class="modal-title" id="addStaffModalLabel">Add New Staff</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span>&times;</span></button>
                </div>

                <div class="modal-body">
                    <!-- Profile Image Upload with Preview -->
                    <div class='form-group text-center'>
                        <label for='uploadImage'><b>Upload Staff Image</b></label><br>
                        <img id='preview' src='../uploads/staff/none.jpg' class='img-thumbnail rounded-circle mb-2' width='150' height='150' alt='Profile Preview'>
                        <input type='file' name='file' id='uploadImage' class='form-control-file d-block mx-auto' onchange="previewImage(event)" required>
                    </div>

                    <div class="form-group">
                        <label>Username</label>
                        <input type="text" name="username" class="form-control" required>
                    </div>

                    <div class="form-group">
                        <label>Password</label>
                        <input type="password" name="password" class="form-control" required>
                    </div>

                    <div class="form-group">
                        <label>Full Name</label>
                        <input type="text" name="name" placeholder="Full Name" class="form-control" required>
                    </div>

                    <div class="form-group">
                        <label>Date of Birth</label>
                        <input type="text" name="dob" class="form-control datepicker" required>
                    </div>

                    <div class="form-group">
                        <label>Role</label>
                        <select name="role" class="form-control" required>
                            <option>Select Role</option>
                            <?php
                            $query = "SELECT * FROM `role`";
                            $run_query = mysqli_query($connection, $query);
                            while ($result = mysqli_fetch_assoc($run_query)) {
                                echo "<option>{$result['role_name']}</option>";
                            }
                            ?>
                        </select>
                    </div>

                    <div class="form-group">
                        <label>Country</label>
                        <input type="text" name="country" value="Nigeria" class="form-control" required>
                    </div>

                    <div class="form-group">
                        <label>State</label>
                        <select name="state" id="state" class="form-control" onchange="toggleLGA(this);" required>
                            <option value="">- Select -</option>
                            <?php
                            $states = ["Abia", "Adamawa", "AkwaIbom", "Anambra", "Bauchi", "Bayelsa", "Benue", "Borno",
                                "Cross River", "Delta", "Ebonyi", "Edo", "Ekiti", "Enugu", "FCT", "Gombe", "Imo",
                                "Jigawa", "Kaduna", "Kano", "Katsina", "Kebbi", "Kogi", "Kwara", "Lagos", "Nasarawa",
                                "Niger", "Ogun", "Ondo", "Osun", "Oyo", "Plateau", "Rivers", "Sokoto", "Taraba",
                                "Yobe", "Zamfara"];
                            foreach ($states as $state) echo "<option value='$state'>$state</option>";
                            ?>
                        </select>
                    </div>

                    <div class="form-group">
                        <label>LGA</label>
                        <select name="lga" id="lga" class="form-control select-lga" required></select>
                    </div>

                    <div class="form-group">
                        <label>Sex</label>
                        <select name="sex" class="form-control" required>
                            <option>Male</option>
                            <option>Female</option>
                        </select>
                    </div>

                    <div class="form-group">
                        <label>Staff Address</label>
                        <input type="text" name="address" class="form-control" placeholder="Staff Address" required>
                    </div>

                    <div class="form-group">
                        <label>Staff Phone Number</label>
                        <input type="tel" name="phone" pattern="[0-9]+" title="Input must be a valid phone number" class="form-control" placeholder="Phone Number" required>
                    </div>

                    <div class="form-group">
                        <label>Staff Email</label>
                        <input type="email" name="email" class="form-control" placeholder="Staff Email e.g me@gmail.com" required>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="submit" name="staff_register_btn" class="btn btn-primary">Register</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                </div>
            </form>
        </div>
    </div>
</div>
