location design
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
<?php
|
||||
<?php
|
||||
/**
|
||||
* app/modules/locations/list.php
|
||||
*
|
||||
* Übersicht aller Standorte
|
||||
* Ãœbersicht aller Standorte
|
||||
*/
|
||||
|
||||
// =========================
|
||||
@@ -73,7 +73,7 @@ foreach ($floors as $floor) {
|
||||
<input type="hidden" name="module" value="locations">
|
||||
<input type="hidden" name="action" value="list">
|
||||
|
||||
<input type="text" name="search" placeholder="Suche nach Name…"
|
||||
<input type="text" name="search" placeholder="Suche nach Name…"
|
||||
value="<?php echo htmlspecialchars($search); ?>" class="search-input">
|
||||
|
||||
<button type="submit" class="button">Filter</button>
|
||||
@@ -90,7 +90,7 @@ foreach ($floors as $floor) {
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Gebäude</th>
|
||||
<th>Gebäude</th>
|
||||
<th>Beschreibung</th>
|
||||
<th>Aktionen</th>
|
||||
</tr>
|
||||
@@ -112,7 +112,7 @@ foreach ($floors as $floor) {
|
||||
|
||||
<td class="actions">
|
||||
<a href="?module=locations&action=edit&id=<?php echo $location['id']; ?>" class="button button-small">Bearbeiten</a>
|
||||
<a href="#" class="button button-small button-danger" onclick="confirmDelete(<?php echo $location['id']; ?>)">Löschen</a>
|
||||
<a href="#" class="button button-small button-danger" onclick="confirmDelete(<?php echo $location['id']; ?>)">Löschen</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
@@ -130,75 +130,85 @@ foreach ($floors as $floor) {
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php
|
||||
//TODO design schlecht, mach es hübscher
|
||||
?>
|
||||
|
||||
<section class="hierarchy-section">
|
||||
<h2>Gebäude & Stockwerke nach Standorten</h2>
|
||||
<?php if (!empty($locations)): ?>
|
||||
<ul class="hierarchy-list">
|
||||
<?php foreach ($locations as $location): ?>
|
||||
<li class="hierarchy-list__item">
|
||||
<div class="hierarchy-location">
|
||||
<div class="hierarchy-location__info">
|
||||
<span class="hierarchy-location__name"><?php echo htmlspecialchars($location['name']); ?></span>
|
||||
<span class="hierarchy-location__meta"><?php echo $location['building_count']; ?> Gebäude</span>
|
||||
</div>
|
||||
<div class="hierarchy-actions">
|
||||
<a href="?module=buildings&action=edit&location_id=<?php echo $location['id']; ?>" class="button button-small">+ Gebäude</a>
|
||||
</div>
|
||||
</div>
|
||||
<table class="hierarchy-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Standort</th>
|
||||
<th>Gebäude</th>
|
||||
<th>Stockwerk</th>
|
||||
<th>Details</th>
|
||||
<th class="actions">Aktionen</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($locations as $location): ?>
|
||||
<?php $locationBuildings = $buildingsByLocation[$location['id']] ?? []; ?>
|
||||
<tr class="hierarchy-row hierarchy-row--location">
|
||||
<td class="hierarchy-cell hierarchy-cell--location" colspan="3">
|
||||
<strong><?php echo htmlspecialchars($location['name']); ?></strong>
|
||||
<span class="hierarchy-meta">(<?php echo (int) $location['building_count']; ?> Gebäude)</span>
|
||||
</td>
|
||||
<td></td>
|
||||
<td class="actions hierarchy-actions">
|
||||
<a href="?module=buildings&action=edit&location_id=<?php echo $location['id']; ?>" class="button button-small">+ Gebäude</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php if (!empty($locationBuildings)): ?>
|
||||
<ul class="hierarchy-sublist">
|
||||
<?php foreach ($locationBuildings as $building): ?>
|
||||
<li class="hierarchy-sublist__item">
|
||||
<div class="hierarchy-building">
|
||||
<div class="hierarchy-building__info">
|
||||
<span class="hierarchy-building__name"><?php echo htmlspecialchars($building['name']); ?></span>
|
||||
<?php if (!empty($building['comment'])): ?>
|
||||
<span class="hierarchy-building__meta"><?php echo htmlspecialchars($building['comment']); ?></span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="hierarchy-actions">
|
||||
<a href="?module=buildings&action=edit&id=<?php echo $building['id']; ?>" class="button button-small">Bearbeiten</a>
|
||||
<a href="#" class="button button-small button-danger" onclick="confirmBuildingDelete(<?php echo $building['id']; ?>)">Löschen</a>
|
||||
<a href="?module=floors&action=edit&building_id=<?php echo $building['id']; ?>" class="button button-small">+ Stockwerk</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php $buildingFloors = $floorsByBuilding[$building['id']] ?? []; ?>
|
||||
<?php if (!empty($buildingFloors)): ?>
|
||||
<ul class="hierarchy-sublist hierarchy-sublist--nested">
|
||||
<?php foreach ($buildingFloors as $floor): ?>
|
||||
<li>
|
||||
<div class="hierarchy-floor">
|
||||
<div class="hierarchy-floor__info">
|
||||
<span class="hierarchy-floor__name"><?php echo htmlspecialchars($floor['name']); ?></span>
|
||||
<?php if ($floor['level'] !== null): ?>
|
||||
<span class="hierarchy-floor__meta">Ebene <?php echo htmlspecialchars($floor['level']); ?></span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="hierarchy-actions">
|
||||
<a href="?module=floors&action=edit&id=<?php echo $floor['id']; ?>" class="button button-small">Bearbeiten</a>
|
||||
<a href="#" class="button button-small button-danger" onclick="confirmFloorDelete(<?php echo $floor['id']; ?>)">Löschen</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<?php foreach ($locationBuildings as $building): ?>
|
||||
<?php $buildingFloors = $floorsByBuilding[$building['id']] ?? []; ?>
|
||||
<tr class="hierarchy-row hierarchy-row--building">
|
||||
<td class="hierarchy-cell hierarchy-cell--empty"> </td>
|
||||
<td class="hierarchy-cell hierarchy-cell--building" colspan="2"><?php echo htmlspecialchars($building['name']); ?></td>
|
||||
<td>
|
||||
<?php if (!empty($building['comment'])): ?>
|
||||
<span class="hierarchy-meta"><?php echo htmlspecialchars($building['comment']); ?></span>
|
||||
<?php else: ?>
|
||||
<p class="hierarchy-empty">Keine Stockwerke für dieses Gebäude.</p>
|
||||
<span class="hierarchy-meta hierarchy-meta--muted">Kein Kommentar</span>
|
||||
<?php endif; ?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</td>
|
||||
<td class="actions hierarchy-actions">
|
||||
<a href="?module=buildings&action=edit&id=<?php echo $building['id']; ?>" class="button button-small">Bearbeiten</a>
|
||||
<a href="#" class="button button-small button-danger" onclick="confirmBuildingDelete(<?php echo $building['id']; ?>)">Löschen</a>
|
||||
<a href="?module=floors&action=edit&building_id=<?php echo $building['id']; ?>" class="button button-small">+ Stockwerk</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php if (!empty($buildingFloors)): ?>
|
||||
<?php foreach ($buildingFloors as $floor): ?>
|
||||
<tr class="hierarchy-row hierarchy-row--floor">
|
||||
<td class="hierarchy-cell hierarchy-cell--empty"> </td>
|
||||
<td class="hierarchy-cell hierarchy-cell--empty"> </td>
|
||||
<td class="hierarchy-cell hierarchy-cell--floor"><?php echo htmlspecialchars($floor['name']); ?></td>
|
||||
<td>
|
||||
<?php if ($floor['level'] !== null): ?>
|
||||
<span class="hierarchy-meta">Ebene <?php echo htmlspecialchars($floor['level']); ?></span>
|
||||
<?php else: ?>
|
||||
<span class="hierarchy-meta hierarchy-meta--muted">Keine Ebene</span>
|
||||
<?php endif; ?>
|
||||
</td>
|
||||
<td class="actions hierarchy-actions">
|
||||
<a href="?module=floors&action=edit&id=<?php echo $floor['id']; ?>" class="button button-small">Bearbeiten</a>
|
||||
<a href="#" class="button button-small button-danger" onclick="confirmFloorDelete(<?php echo $floor['id']; ?>)">Löschen</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
<?php else: ?>
|
||||
<p class="hierarchy-empty">Für diesen Standort sind noch keine Gebäude hinterlegt.</p>
|
||||
<tr class="hierarchy-row hierarchy-row--empty">
|
||||
<td class="hierarchy-cell hierarchy-cell--empty"> </td>
|
||||
<td class="hierarchy-cell hierarchy-cell--empty"> </td>
|
||||
<td class="hierarchy-cell hierarchy-cell--empty">Keine Gebäude</td>
|
||||
<td><span class="hierarchy-meta hierarchy-meta--muted">Für diesen Standort sind noch keine Gebäude vorhanden.</span></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<?php endif; ?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
<?php else: ?>
|
||||
<p>Keine Standorte gefunden.</p>
|
||||
<?php endif; ?>
|
||||
@@ -320,69 +330,70 @@ foreach ($floors as $floor) {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.hierarchy-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
.hierarchy-table {
|
||||
width: 100%;
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
border: 1px solid #d8dee5;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hierarchy-list__item {
|
||||
padding: 15px;
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 8px;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.hierarchy-location,
|
||||
.hierarchy-building,
|
||||
.hierarchy-floor {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.hierarchy-location__info,
|
||||
.hierarchy-building__info,
|
||||
.hierarchy-floor__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.hierarchy-location__name,
|
||||
.hierarchy-building__name,
|
||||
.hierarchy-floor__name {
|
||||
.hierarchy-table th {
|
||||
background: #f3f6fa;
|
||||
padding: 10px 12px;
|
||||
text-align: left;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
border-bottom: 1px solid #d8dee5;
|
||||
}
|
||||
|
||||
.hierarchy-location__meta,
|
||||
.hierarchy-building__meta,
|
||||
.hierarchy-floor__meta {
|
||||
color: #666;
|
||||
.hierarchy-table td {
|
||||
padding: 9px 12px;
|
||||
border-bottom: 1px solid #eef2f6;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.hierarchy-row:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.hierarchy-row--empty {
|
||||
background: #fcfcfc;
|
||||
}
|
||||
|
||||
.hierarchy-cell {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.hierarchy-cell--location {
|
||||
background: #fbfcfe;
|
||||
font-weight: 600;
|
||||
min-width: 170px;
|
||||
}
|
||||
|
||||
.hierarchy-cell--building {
|
||||
padding-left: 18px;
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
.hierarchy-cell--floor {
|
||||
padding-left: 24px;
|
||||
min-width: 160px;
|
||||
}
|
||||
|
||||
.hierarchy-cell--empty {
|
||||
background: #fafbfd;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.hierarchy-meta {
|
||||
color: #4e5c6b;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.hierarchy-sublist {
|
||||
list-style: none;
|
||||
margin: 10px 0 0 20px;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.hierarchy-sublist--nested {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.hierarchy-empty {
|
||||
margin: 10px 0 0 20px;
|
||||
color: #888;
|
||||
font-size: 0.9rem;
|
||||
.hierarchy-meta--muted {
|
||||
color: #8a94a3;
|
||||
}
|
||||
.hierarchy-actions {
|
||||
display: flex;
|
||||
@@ -402,7 +413,7 @@ foreach ($floors as $floor) {
|
||||
|
||||
<script>
|
||||
function confirmDelete(id) {
|
||||
if (confirm('Diesen Standort wirklich löschen?')) {
|
||||
if (confirm('Diesen Standort wirklich löschen?')) {
|
||||
fetch('?module=locations&action=delete&id=' + encodeURIComponent(id), {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
@@ -415,24 +426,26 @@ function confirmDelete(id) {
|
||||
window.location.reload();
|
||||
return;
|
||||
}
|
||||
alert((data && data.message) ? data.message : 'Löschen fehlgeschlagen');
|
||||
alert((data && data.message) ? data.message : 'Löschen fehlgeschlagen');
|
||||
})
|
||||
.catch(() => {
|
||||
alert('Löschen fehlgeschlagen');
|
||||
alert('Löschen fehlgeschlagen');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function confirmBuildingDelete(id) {
|
||||
if (confirm('Dieses Gebäude wirklich löschen? Alle Stockwerke werden gelöscht.')) {
|
||||
alert('Löschen noch nicht implementiert');
|
||||
if (confirm('Dieses Gebäude wirklich löschen? Alle Stockwerke werden gelöscht.')) {
|
||||
alert('Löschen noch nicht implementiert');
|
||||
}
|
||||
}
|
||||
|
||||
function confirmFloorDelete(id) {
|
||||
if (confirm('Dieses Stockwerk wirklich löschen? Alle Räume und Racks werden gelöscht.')) {
|
||||
alert('Löschen noch nicht implementiert');
|
||||
if (confirm('Dieses Stockwerk wirklich löschen? Alle Räume und Racks werden gelöscht.')) {
|
||||
alert('Löschen noch nicht implementiert');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user