PackIt/admin/items.php

<?php
require_once __DIR__ . '/auth.php';
require_once __DIR__ . '/layout.php';
require_admin();

$pdo = get_pdo();

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $action = $_POST['action'] ?? '';
    if ($action === 'add') {
        $name  = trim($_POST['itemName'] ?? '');
        $gid   = (int)$_POST['groupID'];
        $order = (int)($_POST['sortOrder'] ?? 0);
        if ($name !== '' && $gid > 0) {
            $pdo->prepare("INSERT INTO items (groupID,itemName,sortOrder) VALUES (?,?,?)")->execute([$gid,$name,$order]);
            flash('success', "Item '$name' added.");
        } else { flash('error', 'Please fill all fields.'); }
    }
    if ($action === 'edit') {
        $id    = (int)$_POST['itemID'];
        $name  = trim($_POST['itemName'] ?? '');
        $gid   = (int)$_POST['groupID'];
        $order = (int)($_POST['sortOrder'] ?? 0);
        if ($name !== '') {
            $pdo->prepare("UPDATE items SET itemName=?,groupID=?,sortOrder=? WHERE itemID=?")->execute([$name,$gid,$order,$id]);
            flash('success', 'Item updated.');
        } else { flash('error', 'Name required.'); }
    }
    if ($action === 'delete') {
        $id = (int)$_POST['itemID'];
        $pdo->prepare("DELETE FROM items WHERE itemID=?")->execute([$id]);
        flash('success', 'Item deleted.');
    }
    header('Location: items.php'); exit;
}

$igroups = $pdo->query("SELECT * FROM item_groups ORDER BY sortOrder,groupID")->fetchAll();
$items   = $pdo->query("
    SELECT i.*, ig.groupName
    FROM items i
    JOIN item_groups ig ON ig.groupID = i.groupID
    ORDER BY ig.sortOrder, i.sortOrder, i.itemID
")->fetchAll();

admin_head('Items', 'items.php');
show_alerts();
?>
<h1>Items</h1>

<div class="card">
  <h2>Add New Item</h2>
  <form method="POST">
    <input type="hidden" name="action" value="add">
    <div class="form-row">
      <div>
        <label>Item Name</label>
        <input type="text" name="itemName" placeholder="e.g. Rain jacket" required>
      </div>
      <div>
        <label>Group</label>
        <select name="groupID" required>
          <option value="">– select –</option>
          <?php foreach ($igroups as $g): ?>
          <option value="<?= $g['groupID'] ?>"><?= htmlspecialchars($g['groupName']) ?></option>
          <?php endforeach; ?>
        </select>
      </div>
    </div>
    <div>
      <label>Sort Order</label>
      <input type="number" name="sortOrder" value="0" min="0" style="max-width:120px;">
    </div>
    <div style="display:flex;gap:.5rem;margin-top:.25rem;">
      <button type="submit" class="btn btn-primary">➕ Add</button>
    </div>
  </form>
</div>

<?php foreach ($items as $item): ?>
<form id="edit-form-<?= $item['itemID'] ?>" method="POST">
  <input type="hidden" name="action" value="edit">
  <input type="hidden" name="itemID" value="<?= $item['itemID'] ?>">
</form>
<?php endforeach; ?>

<table class="tbl">
  <thead><tr><th>#</th><th>Name</th><th>Group</th><th>Sort</th><th></th></tr></thead>
  <tbody>
  <?php foreach ($items as $item):
    $id = $item['itemID'];
  ?>
  <tr id="view-<?= $id ?>">
    <td style="color:var(--muted)"><?= $id ?></td>
    <td><?= htmlspecialchars($item['itemName']) ?></td>
    <td><span class="badge badge-group"><?= htmlspecialchars($item['groupName']) ?></span></td>
    <td><?= $item['sortOrder'] ?></td>
    <td style="display:flex;gap:.4rem;justify-content:flex-end;">
      <button type="button" onclick="startEdit(<?= $id ?>)" class="btn btn-sm btn-teal">Edit</button>
      <form method="POST" onsubmit="return confirm('Delete this item?')">
        <input type="hidden" name="action" value="delete">
        <input type="hidden" name="itemID" value="<?= $id ?>">
        <button class="btn btn-sm btn-danger">Delete</button>
      </form>
    </td>
  </tr>
  <tr id="edit-<?= $id ?>" style="display:none;background:rgba(79,209,197,.04);">
    <td style="color:var(--muted)"><?= $id ?></td>
    <td><input type="text" name="itemName" form="edit-form-<?= $id ?>" value="<?= htmlspecialchars($item['itemName']) ?>" required style="margin:0;width:100%;"></td>
    <td>
      <select name="groupID" form="edit-form-<?= $id ?>" required style="margin:0;width:100%;">
        <?php foreach ($igroups as $g): ?>
        <option value="<?= $g['groupID'] ?>" <?= $item['groupID'] == $g['groupID'] ? 'selected' : '' ?>><?= htmlspecialchars($g['groupName']) ?></option>
        <?php endforeach; ?>
      </select>
    </td>
    <td><input type="number" name="sortOrder" form="edit-form-<?= $id ?>" value="<?= (int)$item['sortOrder'] ?>" min="0" style="margin:0;width:100%;max-width:80px;"></td>
    <td style="display:flex;gap:.4rem;justify-content:flex-end;">
      <button type="submit" form="edit-form-<?= $id ?>" class="btn btn-sm btn-primary">💾 Save</button>
      <button type="button" onclick="cancelEdit(<?= $id ?>)" class="btn btn-sm btn-secondary">Cancel</button>
    </td>
  </tr>
  <?php endforeach; ?>
  </tbody>
</table>

<script>
function startEdit(id) {
  document.getElementById('view-' + id).style.display = 'none';
  document.getElementById('edit-' + id).style.display = '';
  document.querySelector('#edit-' + id + ' input[name="itemName"]').focus();
}
function cancelEdit(id) {
  document.getElementById('edit-' + id).style.display = 'none';
  document.getElementById('view-' + id).style.display = '';
}
</script>

<?php admin_foot(); ?>