troy-grunt/netwatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

defekter floorplan

Browse Source
This commit is contained in:
fixclean
2026-02-13 12:51:09 +01:00
parent 2c90ff8ddf
commit 2891f52f84
9 changed files with 465 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

268
app/modules/floor_infrastructure/list.php
View File

@@ -2,12 +2,12 @@
/**
* app/modules/floor_infrastructure/list.php
*
* Übersicht über Patchpanels und Netzwerkbuchsen auf Stockwerken
* Uebersicht ueber Patchpanels und Netzwerkbuchsen auf Stockwerken
*/
$floorId = (int)($_GET['floor_id'] ?? 0);
$floors = $sql->get("SELECT id, name FROM floors ORDER BY name", "", []);
$floors = $sql->get("SELECT id, name, svg_path FROM floors ORDER BY name", "", []);
$where = '';
$types = '';
@@ -30,7 +30,7 @@ $patchPanels = $sql->get(
);
$networkOutlets = $sql->get(
"SELECT o.*, r.name AS room_name, f.name AS floor_name
"SELECT o.*, r.name AS room_name, f.name AS floor_name, f.id AS floor_id
FROM network_outlets o
LEFT JOIN rooms r ON r.id = o.room_id
LEFT JOIN floors f ON f.id = r.floor_id
@@ -38,6 +38,62 @@ $networkOutlets = $sql->get(
"",
[]
);
$floorMap = [];
foreach ($floors as $floor) {
$id = (int)$floor['id'];
$svgPath = trim((string)($floor['svg_path'] ?? ''));
$floorMap[$id] = [
'id' => $id,
'name' => (string)($floor['name'] ?? ''),
'svg_url' => $svgPath !== '' ? '/' . ltrim($svgPath, '/\\') : ''
];
}
$editorFloorId = $floorId;
if ($editorFloorId <= 0) {
foreach ($floorMap as $candidate) {
if ($candidate['svg_url'] !== '') {
$editorFloorId = (int)$candidate['id'];
break;
}
}
}
$editorFloor = $floorMap[$editorFloorId] ?? null;
$editorPatchPanels = [];
$editorOutlets = [];
if ($editorFloorId > 0) {
foreach ($patchPanels as $panel) {
if ((int)$panel['floor_id'] === $editorFloorId) {
$editorPatchPanels[] = [
'id' => (int)$panel['id'],
'name' => (string)$panel['name'],
'floor_id' => (int)$panel['floor_id'],
'x' => (int)$panel['pos_x'],
'y' => (int)$panel['pos_y'],
'width' => max(1, (int)$panel['width']),
'height' => max(1, (int)$panel['height']),
'port_count' => (int)$panel['port_count'],
'comment' => (string)($panel['comment'] ?? '')
];
}
}
foreach ($networkOutlets as $outlet) {
if ((int)$outlet['floor_id'] === $editorFloorId) {
$editorOutlets[] = [
'id' => (int)$outlet['id'],
'name' => (string)$outlet['name'],
'room_id' => (int)$outlet['room_id'],
'x' => (int)$outlet['x'],
'y' => (int)$outlet['y'],
'comment' => (string)($outlet['comment'] ?? '')
];
}
}
}
?>
<div class="floor-infra">
@@ -45,10 +101,10 @@ $networkOutlets = $sql->get(
<div class="toolbar">
<a href="?module=floor_infrastructure&action=edit&type=patchpanel" class="button button-primary">
+ Patchpanel hinzufügen
+ Patchpanel hinzufuegen
</a>
<a href="?module=floor_infrastructure&action=edit&type=outlet" class="button">
+ Wandbuchse hinzufügen
+ Wandbuchse hinzufuegen
</a>
</div>
@@ -66,7 +122,7 @@ $networkOutlets = $sql->get(
</select>
<button class="button">Filter</button>
<a href="?module=floor_infrastructure&action=list" class="button">Zurücksetzen</a>
<a href="?module=floor_infrastructure&action=list" class="button">Zuruecksetzen</a>
</form>
<section class="infra-section">
@@ -78,7 +134,7 @@ $networkOutlets = $sql->get(
<th>Name</th>
<th>Stockwerk</th>
<th>Position</th>
<th>Größe</th>
<th>Groesse</th>
<th>Ports</th>
<th>Aktionen</th>
</tr>
@@ -87,9 +143,9 @@ $networkOutlets = $sql->get(
<?php foreach ($patchPanels as $panel): ?>
<tr>
<td><?php echo htmlspecialchars($panel['name']); ?></td>
<td><?php echo htmlspecialchars($panel['floor_name'] ?? '—'); ?></td>
<td><?php echo $panel['pos_x'] . ' × ' . $panel['pos_y']; ?></td>
<td><?php echo $panel['width'] . ' × ' . $panel['height']; ?></td>
<td><?php echo htmlspecialchars($panel['floor_name'] ?? '-'); ?></td>
<td><?php echo $panel['pos_x'] . ' x ' . $panel['pos_y']; ?></td>
<td><?php echo $panel['width'] . ' x ' . $panel['height']; ?></td>
<td><?php echo $panel['port_count']; ?></td>
<td class="actions">
<a href="?module=floor_infrastructure&action=edit&type=patchpanel&id=<?php echo $panel['id']; ?>" class="button button-small">Bearbeiten</a>
@@ -121,9 +177,9 @@ $networkOutlets = $sql->get(
<?php foreach ($networkOutlets as $outlet): ?>
<tr>
<td><?php echo htmlspecialchars($outlet['name']); ?></td>
<td><?php echo htmlspecialchars($outlet['floor_name'] ?? '—'); ?></td>
<td><?php echo htmlspecialchars($outlet['room_name'] ?? '—'); ?></td>
<td><?php echo $outlet['x'] . ' × ' . $outlet['y']; ?></td>
<td><?php echo htmlspecialchars($outlet['floor_name'] ?? '-'); ?></td>
<td><?php echo htmlspecialchars($outlet['room_name'] ?? '-'); ?></td>
<td><?php echo $outlet['x'] . ' x ' . $outlet['y']; ?></td>
<td><?php echo htmlspecialchars($outlet['comment']); ?></td>
<td class="actions">
<a href="?module=floor_infrastructure&action=edit&type=outlet&id=<?php echo $outlet['id']; ?>" class="button button-small">Bearbeiten</a>
@@ -139,8 +195,20 @@ $networkOutlets = $sql->get(
<section class="infra-plan">
<h2>Stockwerksplan-Verortung</h2>
<p>Die eingetragenen Patchpanels und Wandbuchsen erscheinen später als feste Objekte auf dem Stockwerks-SVG. Die Polygon-Positionen werden momentan noch durch numerische X/Y-Werte gesteuert.</p>
<p><small>TODO: SVG-Editor mit Drag & Drop für diese Objekte erweitern (siehe Stockwerke-Modul).</small></p>
<?php if (!$editorFloor): ?>
<p class="empty-state">Kein Stockwerk fuer die Planansicht verfuegbar.</p>
<?php elseif (($editorFloor['svg_url'] ?? '') === ''): ?>
<p class="empty-state">Das gewaehlte Stockwerk hat noch keinen SVG-Plan hinterlegt.</p>
<?php else: ?>
<p>Drag & Drop ist aktiv fuer <strong><?php echo htmlspecialchars($editorFloor['name']); ?></strong>. Aenderungen werden direkt gespeichert.</p>
<div id="infra-floor-canvas"
class="infra-floor-canvas"
data-save-url="?module=floor_infrastructure&action=save"
data-floor-id="<?php echo (int)$editorFloor['id']; ?>">
<img src="<?php echo htmlspecialchars($editorFloor['svg_url']); ?>" class="infra-floor-svg" alt="Stockwerksplan">
</div>
<p class="floor-plan-hint">Patchpanels: blau, Wandbuchsen: gruen. Ziehen und loslassen zum Speichern.</p>
<?php endif; ?>
</section>
</div>
@@ -184,6 +252,54 @@ $networkOutlets = $sql->get(
border: 1px dashed #ccc;
border-radius: 6px;
}
.infra-floor-canvas {
position: relative;
margin-top: 12px;
width: 100%;
min-height: 420px;
border: 1px solid #d4d4d4;
border-radius: 8px;
background: #fff;
overflow: hidden;
}
.infra-floor-svg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: contain;
pointer-events: none;
opacity: 0.85;
}
.infra-marker {
position: absolute;
top: 0;
left: 0;
user-select: none;
touch-action: none;
cursor: move;
z-index: 2;
}
.infra-marker.patchpanel {
background: rgba(13, 110, 253, 0.25);
border: 2px solid #0d6efd;
border-radius: 6px;
}
.infra-marker.outlet {
width: 32px;
height: 32px;
background: rgba(25, 135, 84, 0.25);
border: 2px solid #198754;
border-radius: 4px;
}
.infra-marker.is-saving {
opacity: 0.65;
}
.floor-plan-hint {
margin: 8px 0 0;
font-size: 0.85em;
color: #444;
}
.empty-state {
padding: 20px;
background: #fafafa;
@@ -194,3 +310,125 @@ $networkOutlets = $sql->get(
margin-right: 6px;
}
</style>
<?php if ($editorFloor && ($editorFloor['svg_url'] ?? '') !== ''): ?>
<script>
document.addEventListener('DOMContentLoaded', () => {
const canvas = document.getElementById('infra-floor-canvas');
if (!canvas) {
return;
}
const saveUrl = canvas.dataset.saveUrl;
const floorId = Number(canvas.dataset.floorId || 0);
const outletSize = 32;
const patchPanels = <?php echo json_encode($editorPatchPanels, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES); ?>;
const outlets = <?php echo json_encode($editorOutlets, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES); ?>;
const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
const savePosition = async (entry, type, marker) => {
const form = new FormData();
if (type === 'patchpanel') {
form.append('type', 'patchpanel');
form.append('id', String(entry.id));
form.append('name', entry.name || '');
form.append('floor_id', String(floorId));
form.append('pos_x', String(entry.x));
form.append('pos_y', String(entry.y));
form.append('width', String(entry.width));
form.append('height', String(entry.height));
form.append('port_count', String(entry.port_count || 0));
form.append('comment', entry.comment || '');
} else {
form.append('type', 'outlet');
form.append('id', String(entry.id));
form.append('name', entry.name || '');
form.append('room_id', String(entry.room_id || 0));
form.append('x', String(entry.x));
form.append('y', String(entry.y));
form.append('comment', entry.comment || '');
}
marker.classList.add('is-saving');
try {
await fetch(saveUrl, {
method: 'POST',
body: form,
credentials: 'same-origin'
});
} finally {
marker.classList.remove('is-saving');
}
};
const bindDrag = (marker, entry, type) => {
let dragging = false;
let offsetX = 0;
let offsetY = 0;
marker.addEventListener('pointerdown', (event) => {
dragging = true;
const rect = marker.getBoundingClientRect();
offsetX = event.clientX - rect.left;
offsetY = event.clientY - rect.top;
marker.setPointerCapture(event.pointerId);
});
marker.addEventListener('pointermove', (event) => {
if (!dragging) {
return;
}
const rect = canvas.getBoundingClientRect();
const width = type === 'patchpanel' ? entry.width : outletSize;
const height = type === 'patchpanel' ? entry.height : outletSize;
const maxX = Math.max(0, rect.width - width);
const maxY = Math.max(0, rect.height - height);
entry.x = Math.round(clamp(event.clientX - rect.left - offsetX, 0, maxX));
entry.y = Math.round(clamp(event.clientY - rect.top - offsetY, 0, maxY));
marker.style.left = `${entry.x}px`;
marker.style.top = `${entry.y}px`;
});
const stopDrag = (event) => {
if (!dragging) {
return;
}
dragging = false;
if (marker.hasPointerCapture(event.pointerId)) {
marker.releasePointerCapture(event.pointerId);
}
savePosition(entry, type, marker);
};
marker.addEventListener('pointerup', stopDrag);
marker.addEventListener('pointercancel', stopDrag);
};
const createMarker = (entry, type) => {
const marker = document.createElement('div');
marker.className = `infra-marker ${type}`;
marker.dataset.id = String(entry.id);
marker.dataset.type = type;
marker.title = entry.name || '';
if (type === 'patchpanel') {
marker.style.width = `${entry.width}px`;
marker.style.height = `${entry.height}px`;
}
marker.style.left = `${entry.x}px`;
marker.style.top = `${entry.y}px`;
canvas.appendChild(marker);
bindDrag(marker, entry, type);
};
patchPanels.forEach((entry) => createMarker(entry, 'patchpanel'));
outlets.forEach((entry) => createMarker(entry, 'outlet'));
});
</script>
<?php endif; ?>