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

Updated/Fixed Item form and item show
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-23 03:18:56 +02:00
parent ae05cb53b6
commit a19cc6984f
4 changed files with 216 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
app/views/items/show.html.erb
View File

@@ -31,90 +31,90 @@
</div>
<% end %>
<div class="max-w-4xl mx-auto space-y-6">
<div class="w-full space-y-6">
<!-- ZWEI-SPALTIGES CORE-LAYOUT -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<!-- LINKE SEITE: STAMMDATEN & VERANTWORTLICHKEIT (2 Spalten breit) -->
<div class="md:col-span-2 space-y-6">
<!-- LINKER BEREICH: STAMMDATEN & VERANTWORTLICHKEIT (Nimmt auf Desktop 2 Spalten ein) -->
<div class="lg:col-span-2 space-y-6 w-full min-w-0">
<!-- STAMMDATEN-BOX -->
<div class="bg-white border border-gray-200 rounded-xl shadow-sm p-6 space-y-4">
<div>
<span class="inline-flex items-center py-0.5 px-2.5 rounded-full text-xs font-semibold bg-blue-50 text-blue-800 border border-blue-200">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm p-4 md:p-6 space-y-4">
<div class="flex items-start justify-between flex-wrap gap-2">
<h2 class="text-lg md:text-xl font-bold text-gray-900 leading-tight"><%= @item.name %></h2>
<span class="inline-flex items-center py-0.5 px-2.5 rounded-full text-xs font-semibold bg-blue-50 text-blue-800 border border-blue-200 shrink-0">
<%= @item.category.name %>
</span>
<h2 class="text-xl font-bold text-gray-900 mt-2"><%= @item.name %></h2>
</div>
<hr class="border-gray-200">
<!-- Raster für Metadaten -->
<div class="grid grid-cols-2 gap-4 text-sm">
<div>
<p class="text-xs font-semibold text-gray-400 uppercase">Artikelnummer (SKU)</p>
<p class="font-mono text-gray-800 font-semibold mt-0.5"><%= @item.sku %></p>
<div class="min-w-0">
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Artikelnummer (SKU)</p>
<p class="font-mono text-gray-800 font-semibold mt-0.5 truncate"><%= @item.sku %></p>
</div>
<div class="min-w-0">
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Seriennummer (SN)</p>
<p class="font-mono text-gray-800 font-semibold mt-0.5 truncate"><%= @item.serial_number %></p>
</div>
<div>
<p class="text-xs font-semibold text-gray-400 uppercase">Seriennummer (Hersteller)</p>
<p class="font-mono text-gray-800 font-semibold mt-0.5"><%= @item.serial_number %></p>
</div>
<div>
<p class="text-xs font-semibold text-gray-400 uppercase">Anschaffungspreis</p>
<p class="text-gray-800 mt-0.5 font-medium">
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Anschaffungspreis</p>
<p class="text-gray-800 mt-0.5 font-semibold">
<%= number_to_currency(@item.price, unit: "€", separator: ",", delimiter: ".", format: "%n %u") %>
</p>
</div>
<div>
<p class="text-xs font-semibold text-gray-400 uppercase">Registriert am</p>
<p class="text-gray-600 mt-0.5"><%= l(@item.created_at, format: :short) %></p>
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Erfasst am</p>
<p class="text-gray-600 mt-0.5 text-xs"><%= l(@item.created_at, format: "%d.%m.%Y") %></p>
</div>
</div>
<% if @item.notes.present? %>
<hr class="border-gray-200">
<div>
<p class="text-xs font-semibold text-gray-400 uppercase">Beschreibung / Notizen</p>
<p class="text-sm text-gray-600 mt-1 leading-relaxed"><%= @item.notes %></p>
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Beschreibung / Notizen</p>
<p class="text-sm text-gray-600 mt-1 leading-relaxed whitespace-pre-line"><%= @item.notes %></p>
</div>
<% end %>
</div>
<!-- STANDORT / AKTUELLE ZUWEISUNG -->
<div class="bg-white border border-gray-200 rounded-xl shadow-sm p-6">
<h3 class="text-sm font-bold text-gray-400 uppercase tracking-wider mb-3">Aktueller Status & Aufenthaltsort</h3>
<div class="bg-white border border-gray-200 rounded-xl shadow-sm p-4 md:p-6">
<h3 class="text-xs font-bold text-gray-400 uppercase tracking-wider mb-3">Aktueller Status & Aufenthaltsort</h3>
<% if @item.user.present? %>
<div class="flex items-center gap-4 p-4 bg-green-50/50 border border-green-200 rounded-xl">
<div class="p-3 bg-green-100 text-green-700 rounded-lg">
<div class="p-3 bg-green-100 text-green-700 rounded-lg shrink-0">
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" /></svg>
</div>
<div>
<p class="text-xs font-semibold text-green-800 uppercase tracking-wide">In Benutzung (Mitarbeiter)</p>
<h4 class="text-sm font-bold text-gray-900 mt-0.5"><%= @item.user.name %></h4>
<p class="text-xs text-gray-500"><%= @item.user.department&.name || "Keine Abteilung hinterlegt" %></p>
<div class="min-w-0">
<p class="text-xs font-bold text-green-800 uppercase tracking-wide">In Benutzung (Mitarbeiter)</p>
<h4 class="text-sm font-bold text-gray-900 mt-0.5 truncate"><%= @item.user.name %></h4>
<p class="text-xs text-gray-500 truncate"><%= @item.user.department&.name || "Keine Abteilung" %></p>
</div>
</div>
<% elsif @item.room.present? %>
<div class="flex items-center gap-4 p-4 bg-blue-50/50 border border-blue-200 rounded-xl">
<div class="p-3 bg-blue-100 text-blue-700 rounded-lg">
<div class="p-3 bg-blue-100 text-blue-700 rounded-lg shrink-0">
<svg class="h-6 w-6" 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>
<div>
<p class="text-xs font-semibold text-blue-800 uppercase tracking-wide">Fest verbaut / Zugewiesener Raum</p>
<h4 class="text-sm font-bold text-gray-900 mt-0.5"><%= @item.room.name %></h4>
<p class="text-xs text-gray-500"><%= @item.room.building %> • <%= @item.room.floor %></p>
<div class="min-w-0">
<p class="text-xs font-bold text-blue-800 uppercase tracking-wide">Zugewiesener Raum / Standort</p>
<h4 class="text-sm font-bold text-gray-900 mt-0.5 truncate"><%= @item.room.name %></h4>
<p class="text-xs text-gray-500 truncate"><%= @item.room.building %> • <%= @item.room.floor %></p>
</div>
</div>
<% else %>
<div class="flex items-center gap-4 p-4 bg-amber-50/50 border border-amber-200 rounded-xl">
<div class="p-3 bg-amber-100 text-amber-700 rounded-lg">
<div class="p-3 bg-amber-100 text-amber-700 rounded-lg shrink-0">
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M20.25 7.5l-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125z" /></svg>
</div>
<div>
<p class="text-xs font-semibold text-amber-800 uppercase tracking-wide">Verfügbar</p>
<h4 class="text-sm font-bold text-gray-900 mt-0.5">Im Hauptlager</h4>
<p class="text-xs text-gray-500">Bereit zur Zuweisung an Mitarbeiter oder Räume.</p>
<p class="text-xs font-bold text-amber-800 uppercase tracking-wide">Status</p>
<h4 class="text-sm font-bold text-gray-900 mt-0.5">Verfügbar im Hauptlager</h4>
<p class="text-xs text-gray-500">Bereit zur Ausgabe oder Zuweisung.</p>
</div>
</div>
<% end %>
@@ -122,26 +122,23 @@
</div>
<!-- RECHTE SEITE: INTERNE INVENTAR-PLAKETTE (1 Spalte breit) -->
<div class="space-y-6">
<div class="bg-white border border-gray-200 rounded-xl shadow-sm p-4 text-center space-y-4">
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Interne Kennzeichnung</p>
<!-- QR-Code Render Box -->
<div class="w-36 h-36 bg-white p-2 border border-gray-200 rounded-lg flex items-center justify-center mx-auto shadow-inner">
<div class="w-full bg-white border border-gray-200 rounded-xl shadow-sm p-6 text-center space-y-4">
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider">Interne Kennzeichnung</p>
<div class="w-36 h-36 bg-white p-2 border border-gray-200 rounded-xl flex items-center justify-center mx-auto shadow-inner overflow-hidden">
<div class="w-full h-full flex items-center justify-center flex-col shrink-0">
<%= @item.generate_qr_code %>
</div>
<div>
<p class="text-xs text-gray-400 font-medium">Inventarnummer</p>
<p class="text-base font-mono font-bold text-blue-600 mt-0.5">#<%= @item.sticker_id %></p>
</div>
<p class="text-[10px] text-gray-400 leading-normal px-2">Vorgedrucktes Etikett vom A4-Bogen. Scan im System führt direkt hierher.</p>
</div>
</div>
<div>
<p class="text-sm text-gray-400 uppercase font-bold tracking-wider">Inventarnummer</p>
<span class="inline-flex items-center font-mono font-black text-sm text-white bg-blue-600 px-3 py-1 rounded-md shadow-sm mt-1 tracking-widest">
#<%= @item.sticker_id %>
</span>
</div>
<p class="text-xs text-gray-400 leading-normal px-2">Vorgedrucktes Etikett vom A4-Bogen. Scan im System führt direkt hierher.</p>
</div>
</div>
<!-- LEISTE UNTEN: VERLAUFSHISTORIE (Perfektioniertes Icon-Timeline-Design) -->
<div class="bg-white border border-gray-200 rounded-xl shadow-sm p-6 md:p-8">
@@ -237,5 +234,3 @@
<% end %>
</div>
</div>
</div>