daboh/vault171
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Room and some little design updates
Some checks failed
CI / scan_ruby (push) Has been cancelled
Details
CI / scan_js (push) Has been cancelled
Details
CI / lint (push) Has been cancelled
Details
CI / test (push) Has been cancelled
Details
CI / system-test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
David Böhm
2026-05-28 01:04:19 +02:00
parent e161582c4a
commit af10dca289
17 changed files with 750 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
app/views/rooms/_form.html.erb Normal file
View File

@@ -0,0 +1,51 @@
<%= form_with(model: room, class: "space-y-6 max-w-xl mx-auto bg-white border border-gray-200 rounded-xl shadow-sm p-6 md:p-8") do |form| %>
<% if room.errors.any? %>
<div class="p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 border border-red-200" role="alert">
<h2 class="font-bold mb-1"><%= pluralize(room.errors.count, "Fehler") %> verhinderten das Speichern:</h2>
<ul class="list-disc list-inside text-xs">
<% room.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>
<div>
<h2 class="text-xl font-bold text-gray-800">
<%= room.new_record? ? "Raum anlegen" : "Raum bearbeiten" %>
</h2>
<p class="text-sm text-gray-500 mt-1">
<%= room.new_record? ? "Definiere einen neuen physischen Standort für deine Inventargegenstände." : "Aktualisiere die Standortbezeichnung oder die Etage." %>
</p>
</div>
<hr class="border-gray-200">
<!-- Raumnummer / Name -->
<div>
<%= form.label :name, "Raumbezeichnung / Raumnummer", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :name, placeholder: "z.B. Raum 101, Serverraum, Werkstatt", class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50 focus:border-blue-500 focus:ring-blue-500" %>
</div>
<!-- Gebäude & Etage im Grid nebeneinander -->
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div>
<%= form.label :building, "Gebäude / Gebäudeteil", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :building, placeholder: "z.B. Hauptgebäude, Bau B", class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50 focus:border-blue-500 focus:ring-blue-500" %>
</div>
<div>
<%= form.label :floor, "Etage / Stockwerk", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :floor, placeholder: "z.B. EG, 1. OG, Keller", class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50 focus:border-blue-500 focus:ring-blue-500" %>
</div>
</div>
<hr class="border-gray-200">
<!-- Aktions-Buttons -->
<div class="flex justify-end gap-x-3">
<%= link_to "Abbrechen", rooms_path, class: "py-2.5 px-4 inline-flex items-center text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition shadow-sm" %>
<%= form.submit room.new_record? ? "Raum erstellen" : "Änderungen speichern", class: "py-2.5 px-4 inline-flex items-center text-sm font-semibold rounded-lg bg-blue-600 text-white hover:bg-blue-700 shadow-sm transition cursor-pointer" %>
</div>
<% end %>

2
app/views/rooms/_room.html.erb Normal file
View File

@@ -0,0 +1,2 @@
<div id="<%= dom_id room %>" class="w-full sm:w-auto my-5 space-y-5">
</div>

2
app/views/rooms/_room.json.jbuilder Normal file
View File

@@ -0,0 +1,2 @@
json.extract! room, :id, :created_at, :updated_at
json.url room_url(room, format: :json)

27
app/views/rooms/edit.html.erb Normal file
View File

@@ -0,0 +1,27 @@
<% content_for :title, "Raum bearbeiten: #{@room.name}" %>
<% content_for :top_bar_actions do %>
<%= link_to rooms_path, class: "py-2 px-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center gap-1.5 shadow-sm transition" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" /></svg>
Zurück zur Übersicht
<% end %>
<% end %>
<div class="space-y-6 p-4 md:p-6">
<%= render "form", room: @room %>
<!-- GEFAHRENBEREICH: Raum löschen -->
<div class="max-w-xl mx-auto bg-red-50/50 border border-red-200 rounded-xl p-6 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 shadow-sm">
<div class="flex items-start gap-3">
<div class="p-2 bg-red-100 text-red-700 rounded-lg shrink-0 mt-0.5">
<svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" /></svg>
</div>
<div>
<h3 class="text-sm font-bold text-red-800">Raum löschen</h3>
<p class="text-xs text-red-600 mt-0.5">In diesem Raum gelistete Artikel verlieren ihren Standort und werden automatisch ins Hauptlager umgebucht.</p>
</div>
</div>
<%= link_to "Raum löschen", room_path(@room), data: { turbo_method: :delete, turbo_confirm: "Möchtest du diesen Standort wirklich löschen?" }, class: "py-2 px-4 text-sm font-semibold text-white bg-red-600 hover:bg-red-700 rounded-lg shadow-sm transition" %>
</div>
</div>

138
app/views/rooms/index.html.erb Normal file
View File

@@ -0,0 +1,138 @@
<div class="w-full space-y-4">
<% content_for :title, "Räume" %>
<% content_for :top_bar_actions do %>
<%= link_to new_room_path, data: { turbo_frame: "_top" }, class: "py-2 px-4 text-sm font-semibold rounded-lg bg-blue-600 text-white hover:bg-blue-700 flex items-center gap-1.5 shadow-sm transition" do %>
<!-- Heroicon: plus -->
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
</svg>
Raum anlegen
<% end %>
<% end %>
<!-- 1. Suchleiste steht außerhalb des Frames (CSV-Export bleibt hier aus) -->
<%= render "items/search_bar", show_csv: false %>
<!-- 2. NUR DIE TABELLE WIRD IN DEN TURBO-FRAME GEPAKT -->
<%= turbo_frame_tag "items_list_frame" do %>
<% if @rooms.any? %>
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden">
<!-- ========================================================================= -->
<!-- 1. HANDY-ANSICHT: KOMPAKTE CARDS MIT KLEINEN BUTTONS (Bis md:) -->
<!-- ========================================================================= -->
<div class="block md:hidden divide-y divide-gray-200 bg-white">
<% @rooms.each do |room| %>
<div class="p-3 hover:bg-gray-50/50 transition space-y-2">
<!-- OBERE ZEILE: Icon + Name & Geräte-Badge -->
<div class="flex items-start justify-between gap-3 w-full">
<div class="flex items-start gap-2 text-gray-500 min-w-0 flex-1">
<svg class="h-5 w-5 shrink-0 mt-0.5" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25s-7.5-4.108-7.5-11.25a7.5 7.5 0 1 1 15 0Z" />
</svg>
<div class="min-w-0">
<h4 class="font-black text-gray-900 text-base leading-tight truncate"><%= room.name %></h4>
<div class="flex items-center gap-1.5 text-xs font-semibold text-gray-400 font-sans mt-0.5">
<span><%= room.building %></span>
<span class="text-gray-300">•</span>
<span>Etage <%= room.floor %></span>
</div>
</div>
</div>
<div class="shrink-0">
<span class="inline-flex items-center py-0.5 px-2 rounded-full text-xs font-bold <%= room.items.count > 0 ? 'bg-blue-50 text-blue-800 border border-blue-200' : 'bg-gray-100 text-gray-500 border border-gray-200' %>">
<%= room.items.count %> <%= room.items.count == 1 ? "Gerät" : "Geräte" %>
</span>
</div>
</div>
<!-- UNTERE ZEILE: RECHTSBÜNDIGE, QUADRATISCHE BUTTONS (WICHTIG: 'w-auto' erzwingt Kompaktheit) -->
<div class="flex items-center justify-end gap-1.5 w-full">
<!-- DETAILS BUTTON (Durch w-8 h-8 flex-initial garantiert quadratisch und kompakt) -->
<%= link_to room_path(room), data: { turbo_frame: "_top" }, class: "w-8 h-8 text-gray-500 hover:text-blue-600 hover:bg-blue-50 rounded-lg border border-gray-200 bg-white shadow-sm flex items-center justify-center transition flex-initial shrink-0", title: "Inventar anzeigen" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" /><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /></svg>
<% end %>
<!-- BEARBEITEN BUTTON (Durch w-8 h-8 flex-initial garantiert quadratisch und kompakt) -->
<%= link_to edit_room_path(room), data: { turbo_frame: "_top" }, class: "w-8 h-8 text-gray-500 hover:text-amber-600 hover:bg-amber-50 rounded-lg border border-gray-200 bg-white shadow-sm flex items-center justify-center transition flex-initial shrink-0", title: "Bearbeiten" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" /></svg>
<% end %>
</div>
</div>
<% end %>
</div>
<!-- ========================================================================= -->
<!-- 2. DESKTOP-ANSICHT: STICKY-RÄUME-TABELLE -->
<!-- ========================================================================= -->
<div class="hidden md:block overflow-x-auto max-h-[calc(100vh-12rem)]">
<table class="min-w-full divide-y divide-gray-200 text-sm">
<thead class="bg-gray-50 sticky top-0 z-20 shadow-[0_1px_0_0_rgba(229,231,235,1)]">
<tr>
<th scope="col" class="px-6 py-3 text-start font-semibold text-gray-500 uppercase tracking-wider">Raum</th>
<th scope="col" class="px-6 py-3 text-start font-semibold text-gray-500 uppercase tracking-wider">Gebäudeteil</th>
<th scope="col" class="px-6 py-3 text-start font-semibold text-gray-500 uppercase tracking-wider">Etage</th>
<th scope="col" class="px-6 py-3 text-center font-semibold text-gray-500 uppercase tracking-wider">Aktiver Bestand</th>
<th scope="col" class="px-6 py-3 text-end font-semibold text-gray-500 uppercase tracking-wider">Aktionen</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 bg-white">
<% @rooms.each do |room| %>
<tr class="hover:bg-gray-50/50 transition">
<td class="px-6 py-4 whitespace-nowrap">
<div class="flex items-center gap-3 text-gray-400">
<svg class="h-5 w-5 shrink-0 ml-0.5" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25s-7.5-4.108-7.5-11.25a7.5 7.5 0 1 1 15 0Z" />
</svg>
<div class="font-semibold text-gray-900"><%= room.name %></div>
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap text-gray-700 font-medium"><%= room.building %></td>
<td class="px-6 py-4 whitespace-nowrap text-gray-500 font-mono text-xs"><%= room.floor %></td>
<td class="px-6 py-4 whitespace-nowrap text-center">
<span class="inline-flex items-center py-0.5 px-2.5 rounded-full text-xs font-semibold <%= room.items.count > 0 ? 'bg-blue-50 text-blue-800 border border-blue-200' : 'bg-gray-100 text-gray-500 border border-gray-200' %>">
<%= room.items.count %> <%= room.items.count == 1 ? "Gerät" : "Geräte" %>
</span>
</td>
<td class="px-6 py-4 whitespace-nowrap text-end font-medium text-xs">
<!-- KORREKTUR FÜR DIE RÄUME-ÜBERSICHT (Mobil-Bereich) -->
<div class="flex items-center justify-end gap-2 shrink-0">
<!-- DETAILS BUTTON im edlen weißen Design -->
<%= link_to room_path(room), data: { turbo_frame: "_top" },
class: "p-2.5 text-gray-500 hover:text-blue-600 hover:bg-blue-50 rounded-lg border border-gray-200 bg-white shadow-sm flex items-center justify-center",
title: "Inventar öffnen" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" /><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /></svg>
<% end %>
<!-- BEARBEITEN BUTTON im edlen weißen Design -->
<%= link_to edit_room_path(room), data: { turbo_frame: "_top" },
class: "p-2.5 text-gray-500 hover:text-amber-600 hover:bg-amber-50 rounded-lg border border-gray-200 bg-white shadow-sm flex items-center justify-center",
title: "Bearbeiten" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" /></svg>
<% end %>
</div>
</td>
</tr>
<% end %>
</tbody>
</table>
</div>
</div>
<% else %>
<div class="text-center py-16 text-gray-400 bg-white border border-gray-200 rounded-xl shadow-sm">
<p class="text-sm font-medium">Keine passenden Gebäude oder Büros gefunden.</p>
</div>
<% end %>
<% end %>
</div>

1
app/views/rooms/index.json.jbuilder Normal file
View File

@@ -0,0 +1 @@
json.array! @rooms, partial: "rooms/room", as: :room

12
app/views/rooms/new.html.erb Normal file
View File

@@ -0,0 +1,12 @@
<% content_for :title, "Neuen Raum hinzufügen" %>
<% content_for :top_bar_actions do %>
<%= link_to rooms_path, class: "py-2 px-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center gap-1.5 shadow-sm transition" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" /></svg>
Zurück zur Übersicht
<% end %>
<% end %>
<div class="p-4 md:p-6">
<%= render "form", room: @room %>
</div>

38
app/views/rooms/show.html.erb Normal file
View File

@@ -0,0 +1,38 @@
<% content_for :title, "Standort: #{@room.name}" %>
<% content_for :top_bar_actions do %>
<%= link_to rooms_path, class: "py-2 px-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 flex items-center gap-1.5 shadow-sm transition" do %>
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" /></svg>
Alle Räume
<% end %>
<% end %>
<div class="w-full space-y-6">
<!-- Metadaten des Raums -->
<div class="bg-white border border-gray-200 rounded-xl p-6 shadow-sm grid grid-cols-1 sm:grid-cols-2 gap-4 text-sm max-w-xl">
<div>
<p class="text-[10px] font-bold text-gray-400 uppercase tracking-wider">Gebäude</p>
<p class="text-gray-800 font-semibold mt-0.5"><%= @room.building %></p>
</div>
<div>
<p class="text-[10px] font-bold text-gray-400 uppercase tracking-wider">Stockwerk / Etage</p>
<p class="text-gray-800 font-semibold mt-0.5"><%= @room.floor %></p>
</div>
</div>
<div>
<!-- 1. Suchleiste steht außerhalb des Frames (CSV-Export hier deaktiviert) -->
<%= render "items/search_bar", show_csv: false %>
<!-- 2. NUR DAS REUSE-LIST-PARTIAL IN DEN FRAME GEPAKT -->
<%= turbo_frame_tag "items_list_frame" do %>
<% if @items.any? %>
<%= render "items/list", items: @items %>
<% else %>
<div class="text-center py-12 text-gray-400 bg-white border border-gray-200 rounded-xl shadow-sm">
<p class="text-sm">Keine passenden Artikel an diesem Standort gefunden.</p>
</div>
<% end %>
<% end %>
</div>
</div>

1
app/views/rooms/show.json.jbuilder Normal file
View File

@@ -0,0 +1 @@
json.partial! "rooms/room", room: @room