<?php
require_once 'db/config.php';
include '_header.php';
include '_navbar.php';

$pdo = db();
$stmt = $pdo->query("SELECT * FROM bni_groups ORDER BY display_order");
$bni_groups = $stmt->fetchAll(PDO::FETCH_ASSOC);

?>

<div class="container-fluid">
    <div class="row">
        <?php include '_sidebar.php'; ?>
        <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
            <h1 class="h2 pt-3 pb-2 mb-3 border-bottom"><?php echo t('bni_groups.title', 'BNI Groups'); ?></h1>

            <?php if (isset($_SESSION['success_message'])): ?>
            <div class="alert alert-success alert-dismissible fade show mt-3" role="alert">
                <?= $_SESSION['success_message']; ?>
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
            <?php unset($_SESSION['success_message']); ?>
            <?php endif; ?>

            <div class="d-flex justify-content-end mb-3">
                <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addModal">
                    <?php echo t('bni_groups.add_new', 'Add New BNI Group'); ?>
                </button>
            </div>

                        <div class="table-responsive mt-4">
                <table class="table table-striped table-sm">
                    <thead>
                        <tr>
                            <th style="width: 30px;"></th>
                            <th><?php echo t('bni_groups.name', 'Name'); ?></th>
                            <th><?php echo t('bni_groups.city', 'City'); ?></th>
                            <th><?php echo t('bni_groups.active', 'Active'); ?></th>
                            <th><?php echo t('bni_groups.actions', 'Actions'); ?></th>
                        </tr>
                    </thead>
                    <tbody id="sortable-list">
                        <?php foreach ($bni_groups as $group): ?>
                        <tr data-id="<?= $group['id'] ?>">
                            <td class="handle"><i class="bi bi-grip-vertical"></i></td>
                            <td><?= htmlspecialchars($group['name']) ?></td>
                            <td><?= htmlspecialchars($group['city']) ?></td>
                            <td><?= $group['active'] ? t('bni_groups.yes', 'Yes') : t('bni_groups.no', 'No') ?></td>
                            <td>
                                <button type="button" class="btn btn-warning btn-sm" data-bs-toggle="modal" data-bs-target="#editModal" 
                                        data-id="<?= $group['id'] ?>" 
                                        data-name="<?= htmlspecialchars($group['name']) ?>" 
                                        data-city="<?= htmlspecialchars($group['city']) ?>"
                                        data-active="<?= $group['active'] ?>">
                                    <?php echo t('bni_groups.edit', 'Edit'); ?>
                                </button>
                                <button type="button" class="btn btn-danger btn-sm" data-bs-toggle="modal" data-bs-target="#deleteModal" data-id="<?= $group['id'] ?>">
                                    <?php echo t('bni_groups.delete', 'Delete'); ?>
                                </button>
                            </td>
                        </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>

        </main>
    </div>
</div>

<!-- Add Modal -->
<div class="modal fade" id="addModal" tabindex="-1" aria-labelledby="addModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="addModalLabel"><?php echo t('bni_groups.add_title', 'Add BNI Group'); ?></h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <form action="_add_bni_group.php" method="post">
        <div class="modal-body">
            <div class="mb-3">
                <label for="addName" class="form-label"><?php echo t('bni_groups.name', 'Name'); ?></label>
                <input type="text" class="form-control" id="addName" name="name" required>
            </div>
            <div class="mb-3">
                <label for="addCity" class="form-label"><?php echo t('bni_groups.city', 'City'); ?></label>
                <input type="text" class="form-control" id="addCity" name="city">
            </div>
            <div class="form-check mb-3">
                <input class="form-check-input" type="checkbox" value="1" id="addActive" name="active" checked>
                <label class="form-check-label" for="addActive">
                    <?php echo t('bni_groups.active', 'Active'); ?>
                </label>
            </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo t('modal.close', 'Close'); ?></button>
          <button type="submit" name="add" class="btn btn-primary"><?php echo t('bni_groups.add_button', 'Add'); ?></button>
        </div>
      </form>
    </div>
  </div>
</div>

<!-- Edit Modal -->
<div class="modal fade" id="editModal" tabindex="-1" aria-labelledby="editModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="editModalLabel"><?php echo t('bni_groups.edit_title', 'Edit BNI Group'); ?></h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <form action="_update_bni_group.php" method="post">
        <div class="modal-body">
            <input type="hidden" id="editId" name="id">
            <div class="mb-3">
                <label for="editName" class="form-label"><?php echo t('bni_groups.name', 'Name'); ?></label>
                <input type="text" class="form-control" id="editName" name="name" required>
            </div>
            <div class="mb-3">
                <label for="editCity" class="form-label"><?php echo t('bni_groups.city', 'City'); ?></label>
                <input type="text" class="form-control" id="editCity" name="city">
            </div>
            <div class="form-check mb-3">
                <input class="form-check-input" type="checkbox" value="1" id="editActive" name="active">
                <label class="form-check-label" for="editActive">
                    <?php echo t('bni_groups.active', 'Active'); ?>
                </label>
            </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo t('modal.close', 'Close'); ?></button>
          <button type="submit" name="edit" class="btn btn-primary"><?php echo t('modal.save_changes', 'Save changes'); ?></button>
        </div>
      </form>
    </div>
  </div>
</div>

<!-- Delete Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="deleteModalLabel"><?php echo t('bni_groups.delete_title', 'Delete BNI Group'); ?></h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <?php echo t('bni_groups.delete_confirm', 'Are you sure you want to delete this BNI group?'); ?>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo t('modal.cancel', 'Cancel'); ?></button>
        <a href="#" id="deleteLink" class="btn btn-danger"><?php echo t('bni_groups.delete', 'Delete'); ?></a>
      </div>
    </div>
  </div>
</div>


<?php include '_footer.php'; ?>
<script>
document.addEventListener('DOMContentLoaded', function () {
    var editModal = document.getElementById('editModal');
    editModal.addEventListener('show.bs.modal', function (event) {
        var button = event.relatedTarget;
        var id = button.getAttribute('data-id');
        var name = button.getAttribute('data-name');
        var city = button.getAttribute('data-city');
        var active = button.getAttribute('data-active');
        
        var idInput = editModal.querySelector('#editId');
        var nameInput = editModal.querySelector('#editName');
        var cityInput = editModal.querySelector('#editCity');
        var activeInput = editModal.querySelector('#editActive');
        
        idInput.value = id;
        nameInput.value = name;
        cityInput.value = city;
        activeInput.checked = (active == 1);
    });

    var deleteModal = document.getElementById('deleteModal');
    deleteModal.addEventListener('show.bs.modal', function (event) {
        var button = event.relatedTarget;
        var id = button.getAttribute('data-id');
        var deleteLink = deleteModal.querySelector('#deleteLink');
        deleteLink.href = '_delete_bni_group.php?id=' + id;
    });

    $(function() {
        $("#sortable-list").sortable({
            handle: ".handle",
            update: function(event, ui) {
                var order = $(this).sortable('toArray', {attribute: 'data-id'});
                $.post('_update_bni_group_order.php', { order: order });
            }
        }).disableSelection();
    });
});
</script>