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

173
app/views/items/_form.html.erb
View File

@@ -1,22 +1,3 @@
<!--<%= form_with(model: item, class: "contents") do |form| %>
<% if item.errors.any? %>
<div id="error_explanation" class="bg-red-50 text-red-500 px-3 py-2 font-medium rounded-md mt-3">
<h2><%= pluralize(item.errors.count, "error") %> prohibited this item from being saved:</h2>
<ul class="list-disc ml-6">
<% item.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="inline">
<%= form.submit class: "w-full sm:w-auto rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white inline-block font-medium cursor-pointer" %>
</div>
<% end %>
-->
<%= form_with(model: item, class: "space-y-6 max-w-2xl mx-auto bg-white border border-gray-200 rounded-xl shadow-sm p-6 md:p-8") do |form| %>
<% if item.errors.any? %>
@@ -30,16 +11,14 @@
</div>
<% end %>
<div>
<!-- Ändert die Überschrift dynamisch je nach Zustand des Artikels -->
<h2 class="text-xl font-bold text-gray-800">
<%= item.new_record? ? "Artikel registrieren" : "Artikel bearbeiten" %>
</h2>
<p class="text-sm text-gray-500 mt-1">
<%= item.new_record? ? "Trage hier die Unikat-Daten wie Seriennummer und Sticker-ID ein." : "Aktualisiere die Daten oder verändere den aktuellen Standort des Geräts." %>
</p>
</div>
<div>
<h2 class="text-xl font-bold text-gray-800">
<%= item.new_record? ? "Artikel registrieren" : "Artikel bearbeiten" %>
</h2>
<p class="text-sm text-gray-500 mt-1">
<%= item.new_record? ? "Trage hier die Unikat-Daten wie Seriennummer und Sticker-ID ein." : "Aktualisiere die Daten oder verändere den aktuellen Standort des Geräts." %>
</p>
</div>
<hr class="border-gray-200">
@@ -47,37 +26,37 @@
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div>
<%= form.label :name, "Artikelname / Modell", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :name, class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50" %>
<%= form.text_field :name, 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 :sku, "SKU (Artikelnummer)", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :sku, class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50" %>
<%= form.text_field :sku, 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>
<!-- Herstelldaten & Preise (Bereinigt um min_stock) -->
<!-- Herstelldaten & Preise -->
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4">
<div class="sm:col-span-2">
<%= form.label :serial_number, "Seriennummer (Hersteller)", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :serial_number, class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50" %>
<%= form.text_field :serial_number, 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 :price, "Einkaufspreis (€)", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_field :price, placeholder: "0.00", class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50" %>
<%= form.text_field :price, placeholder: "0.00", 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>
<!-- Kategorie-Auswahl -->
<div>
<%= form.label :category_id, "Kategorie", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.collection_select :category_id, Category.all, :id, :name, { prompt: "Bitte wählen..." }, { class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-white" } %>
<%= form.collection_select :category_id, Category.all, :id, :name, { prompt: "Bitte wählen..." }, { class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-white focus:border-blue-500 focus:ring-blue-500" } %>
</div>
<!-- QR STICKER-ID -->
<!-- QR STICKER-ID (Mit deinem funktionierenden Scanner) -->
<div data-controller="scanner">
<%= form.label :sticker_id, "Vorgedruckte Sticker-ID / QR-Nummer", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<div class="relative flex rounded-lg shadow-sm">
<%= form.text_field :sticker_id, data: { scanner_target: "input" }, class: "py-2 px-3 block w-full border border-gray-300 rounded-l-lg text-sm bg-gray-50/50" %>
<%= form.text_field :sticker_id, data: { scanner_target: "input" }, class: "py-2 px-3 block w-full border border-gray-300 rounded-l-lg text-sm bg-gray-50/50 focus:border-blue-500 focus:ring-blue-500" %>
<button type="button" data-action="click->scanner#startCamera" class="py-2 px-4 border border-l-0 border-gray-300 bg-gray-50 text-gray-700 rounded-r-lg text-sm flex items-center gap-1.5 hover:bg-gray-100 transition">
Scannen
</button>
@@ -86,44 +65,108 @@
<hr class="border-gray-200">
<!-- INTERAKTIVE ZUWEISUNGS-WEICHE (Variante 2) -->
<div data-controller="assignment" class="space-y-4">
<!-- ========================================================================= -->
<!-- REPARIERTER TURBO FRAME ZUWEISUNGSBEREICH (100% STABIL OHNE JS) -->
<!-- ========================================================================= -->
<div class="space-y-4">
<label class="block text-sm font-semibold text-gray-800">Standort / Zuweisung festlegen</label>
<div class="flex flex-wrap gap-4 p-3 bg-gray-50 rounded-lg border border-gray-200">
<label class="flex items-center gap-2 text-sm text-gray-700 font-medium cursor-pointer">
<input type="radio" name="assignment_type" value="storage" data-action="change->assignment#toggle" checked class="text-blue-600 focus:ring-blue-500 h-4 w-4 border-gray-300">
📦 Im Hauptlager belassen
</label>
<label class="flex items-center gap-2 text-sm text-gray-700 font-medium cursor-pointer">
<input type="radio" name="assignment_type" value="user" data-action="change->assignment#toggle" class="text-blue-600 focus:ring-blue-500 h-4 w-4 border-gray-300">
👤 Mitarbeiter zuweisen
</label>
<label class="flex items-center gap-2 text-sm text-gray-700 font-medium cursor-pointer">
<input type="radio" name="assignment_type" value="room" data-action="change->assignment#toggle" class="text-blue-600 focus:ring-blue-500 h-4 w-4 border-gray-300">
📍 Raum zuweisen
</label>
</div>
<%= turbo_frame_tag "item_assignment_frame" do %>
<%
current_type = if item.user_id.present?
"user"
elsif item.room_id.present?
"room"
else
"storage"
end
type = params[:assignment_type] || current_type
%>
<!-- Dropdown: Mitarbeiter -->
<div data-assignment-target="userSection" class="hidden">
<%= form.label :user_id, "Mitarbeiter auswählen", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.collection_select :user_id, User.all, :id, :name_with_department, { prompt: "Mitarbeiter wählen..." }, { class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-white" } %>
</div>
<!-- Button-Gruppe zur Typwahl -->
<div class="grid grid-cols-3 gap-2 p-1.5 bg-gray-100 rounded-lg border border-gray-200">
<%= link_to item.new_record? ? new_item_path(assignment_type: "storage") : edit_item_path(item, assignment_type: "storage"),
class: "py-2 px-3 text-xs font-medium rounded-md text-center transition flex items-center justify-center gap-1 #{type == 'storage' ? 'bg-white text-blue-600 shadow-sm font-semibold' : 'text-gray-600 hover:text-gray-900'}" do %>
📦 Lager
<% end %>
<%= link_to item.new_record? ? new_item_path(assignment_type: "user") : edit_item_path(item, assignment_type: "user"),
class: "py-2 px-3 text-xs font-medium rounded-md text-center transition flex items-center justify-center gap-1 #{type == 'user' ? 'bg-white text-blue-600 shadow-sm font-semibold' : 'text-gray-600 hover:text-gray-900'}" do %>
👤 Mitarbeiter
<% end %>
<%= link_to item.new_record? ? new_item_path(assignment_type: "room") : edit_item_path(item, assignment_type: "room"),
class: "py-2 px-3 text-xs font-medium rounded-md text-center transition flex items-center justify-center gap-1 #{type == 'room' ? 'bg-white text-blue-600 shadow-sm font-semibold' : 'text-gray-600 hover:text-gray-900'}" do %>
📍 Raum
<% end %>
</div>
<!-- Dropdown: Räume -->
<div data-assignment-target="roomSection" class="hidden">
<%= form.label :room_id, "Raum / Standort auswählen", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.collection_select :room_id, Room.all, :id, :name_with_building, { prompt: "Raum wählen..." }, { class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-white" } %>
</div>
<!-- Live-Suche (Reiner Text, keine versteckten IDs) -->
<div class="mt-4">
<% if type == "user" %>
<!-- Signalisiert Rails, dass die room_id gelöscht werden soll -->
<input type="hidden" name="item[room_id]" value="">
<label for="item_user_name" class="block text-sm font-medium mb-1.5 text-gray-700">Mitarbeiter suchen (Vorname, Nachname oder E-Mail)...</label>
<div class="relative">
<!-- Wir senden den Klartext-Namen an ein virtuelles Feld 'user_name' -->
<input type="text"
id="item_user_name"
name="item[user_name]"
list="users_datalist"
value="<%= item.user&.name %>"
class="py-2.5 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-white focus:border-blue-500 focus:ring-blue-500"
placeholder="Tippe den Namen ein...">
<datalist id="users_datalist">
<% User.all.each do |user| %>
<!-- Hier nutzen wir den reinen Vor- und Nachnamen als Value -->
<option value="<%= user.name %>"></option>
<% end %>
</datalist>
</div>
<% elsif type == "room" %>
<!-- Signalisiert Rails, dass die user_id gelöscht werden soll -->
<input type="hidden" name="item[user_id]" value="">
<label for="item_room_name" class="block text-sm font-medium mb-1.5 text-gray-700">Raum suchen (Raumnummer)...</label>
<div class="relative">
<!-- Wir senden den Klartext-Namen an ein virtuelles Feld 'room_name' -->
<input type="text"
id="item_room_name"
name="item[room_name]"
list="rooms_datalist"
value="<%= item.room&.name %>"
class="py-2.5 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-white focus:border-blue-500 focus:ring-blue-500"
placeholder="Tippe die Raumnummer ein...">
<datalist id="rooms_datalist">
<% Room.all.each do |room| %>
<option value="<%= room.name %>"></option>
<% end %>
</datalist>
</div>
<% else %>
<!-- Hauptlager gewählt -> Beide IDs nullen -->
<input type="hidden" name="item[user_id]" value="">
<input type="hidden" name="item[room_id]" value="">
<div class="p-4 rounded-lg border border-dashed border-gray-200 bg-gray-50/50 text-center text-xs text-gray-500">
Das Gerät wird nach dem Speichern als „Verfügbar im Hauptlager“ eingebucht.
</div>
<% end %>
</div>
<% end %>
</div>
<hr class="border-gray-200">
<!-- Notizen -->
<div>
<%= form.label :notes, "Zusätzliche Notizen / Details", class: "block text-sm font-medium mb-1.5 text-gray-700" %>
<%= form.text_area :notes, rows: 3, class: "py-2 px-3 block w-full border border-gray-300 rounded-lg text-sm bg-gray-50/50" %>
<%= form.text_area :notes, rows: 3, 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>
<hr class="border-gray-200">
@@ -131,7 +174,7 @@
<!-- Buttons -->
<div class="flex justify-end gap-x-3">
<%= link_to "Abbrechen", items_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 "Artikel 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" %>
<%= form.submit item.new_record? ? "Artikel registrieren" : "Ä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 %>

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>