291 lines
8.3 KiB
PHP
291 lines
8.3 KiB
PHP
<?php
|
|
/**
|
|
* app/modules/floors/edit.php
|
|
*
|
|
* Floor / Stockwerk anlegen oder bearbeiten
|
|
* - Name, Ebene, Beschreibung
|
|
* - Zugehöriges Gebäude
|
|
* - SVG-Grundriss mit Linien-Editor (Polylinien)
|
|
*/
|
|
|
|
$floorId = (int)($_GET['id'] ?? 0);
|
|
$floor = null;
|
|
|
|
if ($floorId > 0) {
|
|
$floor = $sql->single(
|
|
"SELECT * FROM floors WHERE id = ?",
|
|
"i",
|
|
[$floorId]
|
|
);
|
|
}
|
|
|
|
$isEdit = !empty($floor);
|
|
$pageTitle = $isEdit ? "Stockwerk bearbeiten: " . htmlspecialchars($floor['name']) : "Neues Stockwerk";
|
|
$buildings = $sql->get("SELECT id, name FROM buildings ORDER BY name", "", []);
|
|
$prefillBuildingId = (int)($_GET['building_id'] ?? 0);
|
|
$selectedBuildingId = $floor['building_id'] ?? $prefillBuildingId;
|
|
|
|
$existingSvgContent = '';
|
|
if (!empty($floor['svg_path'])) {
|
|
$relativePath = ltrim((string)$floor['svg_path'], "/\\");
|
|
$absolutePath = __DIR__ . '/../../' . $relativePath;
|
|
if (is_file($absolutePath) && is_readable($absolutePath)) {
|
|
$existingSvgContent = file_get_contents($absolutePath) ?: '';
|
|
}
|
|
}
|
|
?>
|
|
|
|
<div class="floor-edit">
|
|
<h1><?php echo $pageTitle; ?></h1>
|
|
|
|
<form method="post" action="?module=floors&action=save" enctype="multipart/form-data" class="edit-form">
|
|
<?php if ($isEdit): ?>
|
|
<input type="hidden" name="id" value="<?php echo $floorId; ?>">
|
|
<?php endif; ?>
|
|
|
|
<fieldset>
|
|
<legend>Allgemein</legend>
|
|
|
|
<div class="form-group">
|
|
<label for="name">Name <span class="required">*</span></label>
|
|
<input type="text" id="name" name="name" required
|
|
value="<?php echo htmlspecialchars($floor['name'] ?? ''); ?>"
|
|
placeholder="z.B. Erdgeschoss">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="level">Ebene</label>
|
|
<input type="number" id="level" name="level"
|
|
value="<?php echo htmlspecialchars($floor['level'] ?? '0'); ?>"
|
|
placeholder="z.B. 0 für EG, 1 für 1. OG">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="comment">Beschreibung</label>
|
|
<textarea id="comment" name="comment" rows="3"
|
|
placeholder="Notizen zu diesem Stockwerk"><?php echo htmlspecialchars($floor['comment'] ?? ''); ?></textarea>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend>Standort</legend>
|
|
<div class="form-group">
|
|
<label for="building_id">Gebäude <span class="required">*</span></label>
|
|
<select id="building_id" name="building_id" required>
|
|
<option value="">- Wählen -</option>
|
|
<?php foreach ($buildings as $building): ?>
|
|
<option value="<?php echo (int)$building['id']; ?>"
|
|
<?php echo ((int)$selectedBuildingId === (int)$building['id']) ? 'selected' : ''; ?>>
|
|
<?php echo htmlspecialchars($building['name']); ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend>Grundriss (SVG)</legend>
|
|
|
|
<div class="form-group">
|
|
<label for="svg_file">SVG-Datei hochladen</label>
|
|
<input type="file" id="svg_file" name="svg_file" accept=".svg">
|
|
<small>Optional. Wenn ein Zeichnungsinhalt im Editor erstellt wird, wird dieser beim Speichern bevorzugt.</small>
|
|
</div>
|
|
|
|
<textarea id="floor-svg-content" name="floor_svg_content" hidden><?php echo htmlspecialchars($existingSvgContent); ?></textarea>
|
|
|
|
<div id="floor-svg-editor" class="floor-svg-editor">
|
|
<div class="floor-svg-tools">
|
|
<h4>Zeichenwerkzeug</h4>
|
|
<button type="button" class="button" id="floor-start-polyline">Neue Linie starten</button>
|
|
<button type="button" class="button" id="floor-finish-polyline">Linie beenden</button>
|
|
<button type="button" class="button button-danger" id="floor-delete-polyline">Ausgewählte Linie löschen</button>
|
|
<button type="button" class="button button-danger" id="floor-clear-drawing">Alles löschen</button>
|
|
|
|
<label class="inline-checkbox">
|
|
<input type="checkbox" id="floor-lock-45">
|
|
Winkel auf 45°-Vielfache begrenzen
|
|
</label>
|
|
<label class="inline-checkbox">
|
|
<input type="checkbox" id="floor-snap-guides" checked>
|
|
Ecken an Hilfslinien snappen
|
|
</label>
|
|
</div>
|
|
|
|
<div class="floor-svg-canvas-wrap">
|
|
<svg id="floor-svg-canvas" viewBox="0 0 2000 1000" role="img" aria-label="Stockwerk-Zeichnung"></svg>
|
|
<p class="hint">Linien müssen nicht geschlossen sein. Klick auf freie Fläche fügt Punkte hinzu, Punkte sind per Drag verschiebbar.</p>
|
|
</div>
|
|
|
|
<div class="floor-guides">
|
|
<h4>Hilfslinien</h4>
|
|
<div class="floor-guide-form">
|
|
<select id="floor-guide-orientation">
|
|
<option value="vertical">Vertikal</option>
|
|
<option value="horizontal">Horizontal</option>
|
|
</select>
|
|
<input type="number" id="floor-guide-position" placeholder="Position (SVG-Koordinate)">
|
|
<button type="button" class="button" id="floor-add-guide">Hilfslinie setzen</button>
|
|
</div>
|
|
<ul id="floor-guide-list" class="guide-list"></ul>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<fieldset class="form-actions">
|
|
<button type="submit" class="button button-primary">Speichern</button>
|
|
<a href="?module=floors&action=list" class="button">Abbrechen</a>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
|
|
<style>
|
|
.floor-edit {
|
|
max-width: 1200px;
|
|
margin: 20px auto;
|
|
padding: 20px;
|
|
}
|
|
|
|
.edit-form {
|
|
background: white;
|
|
padding: 20px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.edit-form fieldset {
|
|
margin: 20px 0;
|
|
padding: 15px;
|
|
border: 1px solid #e0e0e0;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.edit-form legend {
|
|
padding: 0 10px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.form-group {
|
|
margin: 15px 0;
|
|
}
|
|
|
|
.form-group label {
|
|
display: block;
|
|
margin-bottom: 5px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.form-group input[type="text"],
|
|
.form-group input[type="number"],
|
|
.form-group input[type="file"],
|
|
.form-group select,
|
|
.form-group textarea {
|
|
width: 100%;
|
|
padding: 8px 12px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
font-family: inherit;
|
|
}
|
|
|
|
.floor-svg-editor {
|
|
display: grid;
|
|
grid-template-columns: 240px 1fr 280px;
|
|
gap: 12px;
|
|
}
|
|
|
|
.floor-svg-tools,
|
|
.floor-guides,
|
|
.floor-svg-canvas-wrap {
|
|
border: 1px solid #ddd;
|
|
border-radius: 6px;
|
|
padding: 10px;
|
|
background: #fff;
|
|
}
|
|
|
|
.floor-svg-tools {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
}
|
|
|
|
.floor-svg-canvas-wrap svg {
|
|
width: 100%;
|
|
min-height: 560px;
|
|
display: block;
|
|
border: 1px solid #eee;
|
|
background: #fafafa;
|
|
cursor: crosshair;
|
|
}
|
|
|
|
.floor-guide-form {
|
|
display: grid;
|
|
gap: 8px;
|
|
}
|
|
|
|
.guide-list {
|
|
margin: 10px 0 0;
|
|
padding: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
.guide-list li {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 6px 0;
|
|
border-bottom: 1px solid #eee;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.inline-checkbox {
|
|
display: flex !important;
|
|
align-items: center;
|
|
gap: 6px;
|
|
font-weight: normal !important;
|
|
}
|
|
|
|
.hint {
|
|
font-size: 0.82rem;
|
|
color: #666;
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.required {
|
|
color: red;
|
|
}
|
|
|
|
.form-actions {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.button {
|
|
padding: 10px 15px;
|
|
background: #007bff;
|
|
color: white;
|
|
text-decoration: none;
|
|
border-radius: 4px;
|
|
border: none;
|
|
cursor: pointer;
|
|
font-size: 0.95em;
|
|
}
|
|
|
|
.button-primary {
|
|
background: #28a745;
|
|
}
|
|
|
|
.button-danger {
|
|
background: #dc3545;
|
|
}
|
|
|
|
@media (max-width: 1200px) {
|
|
.floor-svg-editor {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script src="/assets/js/floor-svg-editor.js" defer></script>
|