pagedev.pl/views/notes/index.php

<?php
$pageTitle = 'Notatnik - System 2FA';
$bodyClass = 'bg-light';
$extraHead = '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">'
  . '<link rel="stylesheet" href="/public/css/notes.css">';

ob_start();
?>
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container-fluid">
      <a class="navbar-brand" href="/panel">
        <i class="fas fa-shield-alt"></i> System 2FA
      </a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav me-auto">
          <li class="nav-item">
            <a class="nav-link" href="/pulpit">
              <i class="fas fa-home"></i> Pulpit
            </a>
          </li>
          <li class="nav-item">
            <a class="nav-link active" href="/notatnik">
              <i class="fas fa-sticky-note"></i> Notatnik
            </a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="/kalendarz">
              <i class="fas fa-calendar-alt"></i> Kalendarz
            </a>
          </li>
        </ul>
        <ul class="navbar-nav">
          <li class="nav-item">
            <span class="nav-link text-white">
              <i class="fas fa-user"></i> <?php echo htmlspecialchars($_SESSION['username']); ?>
            </span>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="/wyloguj-sie">
              <i class="fas fa-sign-out-alt"></i> Wyloguj
            </a>
          </li>
        </ul>
      </div>
    </div>
  </nav>

  <div class="container mt-4">
    <?php if (isset($_SESSION['success'])): ?>
      <div class="alert alert-success alert-dismissible fade show" role="alert">
        <i class="fas fa-check-circle"></i> <?php echo htmlspecialchars($_SESSION['success']); unset($_SESSION['success']); ?>
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      </div>
    <?php endif; ?>

    <?php if (isset($_SESSION['error'])): ?>
      <div class="alert alert-danger alert-dismissible fade show" role="alert">
        <i class="fas fa-exclamation-circle"></i> <?php echo htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?>
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      </div>
    <?php endif; ?>

    <div class="d-flex justify-content-between align-items-center mb-4">
      <h2><i class="fas fa-sticky-note text-primary"></i> Moje Notatki</h2>
      <a href="/notatka/nowa" class="btn btn-primary">
        <i class="fas fa-plus"></i> Nowa notatka
      </a>
    </div>

    <?php if (empty($notes)): ?>
      <div class="text-center py-5">
        <i class="fas fa-inbox fa-5x text-muted mb-3"></i>
        <h4 class="text-muted">Brak notatek</h4>
        <p class="text-muted">Stwórz swoją pierwszą notatkę, aby zacząć!</p>
        <a href="/notatka/nowa" class="btn btn-primary btn-lg mt-3">
          <i class="fas fa-plus"></i> Dodaj pierwszą notatkę
        </a>
      </div>
    <?php else: ?>
      <div class="row">
        <?php foreach ($notes as $note): ?>
          <div class="col-md-6 col-lg-4 mb-4">
            <div class="card note-card h-100 shadow-sm">
              <div class="card-body d-flex flex-column">
                <h5 class="card-title">
                  <i class="fas fa-file-alt text-primary"></i>
                  <?php echo htmlspecialchars($note['title']); ?>
                </h5>
                <p class="card-text flex-grow-1 note-content">
                  <?php
                  $content = htmlspecialchars($note['content'] ?? '');
                  echo nl2br(mb_substr($content, 0, 150)) . (mb_strlen($content) > 150 ? '...' : '');
                  ?>
                </p>
                <div class="note-meta text-muted small mb-3">
                  <i class="fas fa-clock"></i>
                  <?php
                  $date = new DateTime($note['updated_at']);
                  echo $date->format('d.m.Y H:i');
                  ?>
                </div>
                <div class="btn-group" role="group">
                  <a href="/notatka/edytuj?id=<?php echo $note['id']; ?>"
                     class="btn btn-sm btn-outline-primary">
                    <i class="fas fa-edit"></i> Edytuj
                  </a>
                  <button type="button"
                      class="btn btn-sm btn-outline-danger"
                      onclick="confirmDelete(<?php echo $note['id']; ?>, '<?php echo htmlspecialchars(addslashes($note['title'])); ?>')">
                    <i class="fas fa-trash"></i> Usuń
                  </button>
                </div>
              </div>
            </div>
          </div>
        <?php endforeach; ?>
      </div>

      <div class="mt-4 text-center text-muted">
        <p>Łącznie notatek: <strong><?php echo $notesCount; ?></strong></p>
      </div>
    <?php endif; ?>
  </div>

  <!-- Modal potwierdzenia usunięcia -->
  <div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
      <div class="modal-content">
        <div class="modal-header bg-danger text-white">
          <h5 class="modal-title" id="deleteModalLabel">
            <i class="fas fa-exclamation-triangle"></i> Potwierdź usunięcie
          </h5>
          <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
          <p>Czy na pewno chcesz usunąć notatkę:</p>
          <p class="fw-bold" id="noteTitle"></p>
          <p class="text-muted small">Tej operacji nie można cofnąć.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
            <i class="fas fa-times"></i> Anuluj
          </button>
          <form method="POST" action="/notatka/usun" id="deleteForm">
            <input type="hidden" name="note_id" id="deleteNoteId">
            <button type="submit" class="btn btn-danger">
              <i class="fas fa-trash"></i> Usuń notatkę
            </button>
          </form>
        </div>
      </div>
    </div>
  </div>
<?php
$content = ob_get_clean();
$extraScript = '<script>
  function confirmDelete(noteId, noteTitle) {
    document.getElementById("deleteNoteId").value = noteId;
    document.getElementById("noteTitle").textContent = noteTitle;

    const deleteModal = new bootstrap.Modal(document.getElementById("deleteModal"));
    deleteModal.show();
  }
</script>';

require __DIR__ . '/../layout.php';
?>