OpenNIT
Quelltext des aktuellen Standes
Fassung 1.1.1
form.php
9 KB<?php $this->layout('layouts/main', [
'page_title' => $page_title,
'current_route' => 'stock',
'full_width' => true,
]); ?>
<div class="sk-wrap">
<!-- Content Header -->
<div class="content-header">
<div>
<h1><?= $item ? 'Artikel bearbeiten' : 'Neuer Artikel' ?></h1>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/"><?= $this->te('Home') ?></a></li>
<li class="breadcrumb-item"><a href="/stock"><?= $this->te('Lagerbestand') ?></a></li>
<li class="breadcrumb-item active"><?= $item ? 'Bearbeiten' : 'Neuer Artikel' ?></li>
</ol>
</div>
</div>
<div class="page-body">
<form method="POST" action="<?= $item ? '/stock/' . (int)$item['id'] . '/update' : '/stock' ?>" class="sk-form">
<input type="hidden" name="_csrf" value="<?= $this->csrf() ?>">
<section class="sk-card">
<h2 class="sk-card-head">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>
<?= $this->te('Artikeldaten') ?>
</h2>
<div class="sk-card-body">
<div class="sk-field">
<label for="category_id"><?= $this->te('Kategorie') ?> <span class="sk-req">*</span></label>
<select id="category_id" name="category_id" required>
<option value=""><?= $this->te('— bitte wählen —') ?></option>
<?php foreach ($categories as $cat): ?>
<option value="<?= $cat['id'] ?>"
<?= ((int)($item['category_id'] ?? 0)) === (int)$cat['id'] ? 'selected' : '' ?>>
<?= $this->e($cat['icon']) ?> <?= $this->e($cat['name']) ?>
</option>
<?php endforeach; ?>
</select>
</div>
<div class="sk-field">
<label for="name"><?= $this->te('Bezeichnung') ?> <span class="sk-req">*</span></label>
<input type="text" id="name" name="name" required
value="<?= $this->e($item['name'] ?? '') ?>" maxlength="255"
placeholder='z. B. Dell Monitor 24"'>
</div>
<div class="sk-field">
<label for="model"><?= $this->te('Modell / Artikelnummer') ?></label>
<input type="text" id="model" name="model"
value="<?= $this->e($item['model'] ?? '') ?>" maxlength="255"
placeholder="z. B. P2422H">
</div>
<div class="sk-field">
<label for="description"><?= $this->te('Beschreibung') ?></label>
<textarea id="description" name="description" rows="2"
placeholder="<?= $this->te('Optionale Zusatzinfos') ?>"><?= $this->e($item['description'] ?? '') ?></textarea>
</div>
<div class="sk-row-2">
<?php if (!$item): ?>
<div class="sk-field">
<label for="quantity"><?= $this->te('Anfangsbestand') ?></label>
<input type="number" id="quantity" name="quantity" min="0" value="0">
<span class="sk-hint"><?= $this->te('Wird als erste Einbuchung gespeichert.') ?></span>
</div>
<?php endif; ?>
<div class="sk-field">
<label for="min_quantity"><?= $this->te('Mindestbestand') ?></label>
<input type="number" id="min_quantity" name="min_quantity"
min="0" value="<?= (int)($item['min_quantity'] ?? 0) ?>">
<span class="sk-hint"><?= $this->te('Artikel wird gelb markiert bei Unterschreitung.') ?></span>
</div>
</div>
<div class="sk-field">
<label for="location"><?= $this->te('Lagerort') ?></label>
<input type="text" id="location" name="location"
value="<?= $this->e($item['location'] ?? '') ?>" maxlength="255"
placeholder="<?= $this->te('z. B. Regal 3, IT-Lager Raum 1.12') ?>">
</div>
</div>
</section>
<div class="sk-form-actions">
<?php if ($item): ?>
<button type="submit" form="sk-delete-form" class="btn btn-outline-danger">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="15" height="15"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>
<?= $this->te('Artikel löschen') ?>
</button>
<?php endif; ?>
<div class="sk-form-actions-right">
<a href="/stock" class="btn btn-default"><?= $this->te('Abbrechen') ?></a>
<button type="submit" class="btn btn-primary">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="15" height="15"><polyline points="20 6 9 17 4 12"/></svg>
<?= $this->te('Speichern') ?>
</button>
</div>
</div>
</form>
<?php if ($item): ?>
<form id="sk-delete-form" method="POST" action="/stock/<?= (int)$item['id'] ?>/delete"
onsubmit="return confirm('Artikel „<?= $this->e(addslashes($item['name'])) ?>“ wirklich löschen?\nAlle Buchungen werden ebenfalls gelöscht.')">
<input type="hidden" name="_csrf" value="<?= $this->csrf() ?>">
</form>
<?php endif; ?>
</div>
</div>
<style>
/* ====================================================
Lager-Formular · Prefix: sk-
==================================================== */
.sk-wrap { display: flex; flex-direction: column; }
.sk-form { max-width: 680px; }
/* ── Karte ────────────────────────────────────────── */
.sk-card {
background: var(--color-bg);
border: 1px solid var(--gray-200);
border-radius: 0.375rem;
box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.03);
overflow: hidden;
}
.sk-card-head {
display: flex;
align-items: center;
gap: 0.5rem;
margin: 0;
padding: 0.875rem 1.25rem;
font-size: 0.92rem;
font-weight: 600;
color: var(--gray-700);
background: var(--slate-50);
border-bottom: 1px solid var(--gray-200);
}
.sk-card-head svg { color: var(--color-primary); flex-shrink: 0; }
.sk-card-body { padding: 1.25rem; }
/* ── Felder ───────────────────────────────────────── */
.sk-field { margin-bottom: 1rem; }
.sk-field:last-child { margin-bottom: 0; }
.sk-field > label {
display: block;
font-size: 0.8rem;
font-weight: 600;
color: var(--gray-700);
margin-bottom: 0.35rem;
}
.sk-req { color: var(--red-600); }
.sk-field input[type="text"],
.sk-field input[type="number"],
.sk-field select,
.sk-field textarea {
width: 100%;
padding: 0.5rem 0.7rem;
font-size: 0.9rem;
color: var(--gray-900);
background: var(--color-bg);
border: 1px solid var(--gray-300);
border-radius: 0.375rem;
transition: border-color .12s, box-shadow .12s;
appearance: none;
}
.sk-field textarea { resize: vertical; min-height: 60px; }
.sk-field select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 0.6rem center;
background-size: 1rem;
padding-right: 2.2rem;
cursor: pointer;
}
.sk-field input:focus,
.sk-field select:focus,
.sk-field textarea:focus {
outline: none;
border-color: var(--color-primary);
box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb), 0.15);
}
.sk-field input::placeholder,
.sk-field textarea::placeholder { color: var(--gray-400); }
.sk-hint { display: block; font-size: 0.75rem; color: var(--gray-400); margin-top: 0.3rem; }
.sk-row-2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
/* ── Aktionen ─────────────────────────────────────── */
.sk-form-actions {
display: flex;
align-items: center;
gap: 0.75rem;
margin-top: 1.25rem;
max-width: 680px;
}
.sk-form-actions-right { margin-left: auto; display: flex; gap: 0.5rem; }
@media (max-width: 768px) {
.sk-row-2 { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
.sk-form-actions { flex-wrap: wrap; }
.sk-form-actions-right { width: 100%; }
}
</style>