206 lines
13 KiB
Plaintext
206 lines
13 KiB
Plaintext
<% content_for :title, "Dashboard" %>
|
|
|
|
<div class="space-y-6">
|
|
|
|
<!-- DYNAMISCHES STATISTIK-RASTER (3 Spalten auf Desktop, 1 auf Mobile) -->
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
|
|
<!-- KACHEL 1: GESAMTZEIT INVENTAR -->
|
|
<div class="bg-white border border-gray-200 rounded-xl p-6 shadow-sm flex items-center justify-between gap-4">
|
|
<div class="flex items-center gap-4 min-w-0">
|
|
<!-- Icon jetzt links -->
|
|
<div class="p-3 bg-blue-50 text-blue-600 rounded-xl shrink-0 shadow-sm border border-blue-100">
|
|
<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="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l5.25 3.03M12 12.75v9" />
|
|
</svg>
|
|
</div>
|
|
<div class="space-y-0.5 min-w-0">
|
|
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider truncate">Gesamtbestand</p>
|
|
<p class="text-xs text-gray-500 truncate">Registrierte Unikate</p>
|
|
</div>
|
|
</div>
|
|
<!-- Große Zahl jetzt rechtsbündig -->
|
|
<h3 class="text-3xl font-black text-gray-900 text-end shrink-0"><%= Item.count %></h3>
|
|
</div>
|
|
|
|
<!-- KACHEL 2: KATEGORIEN -->
|
|
<div class="bg-white border border-gray-200 rounded-xl p-6 shadow-sm flex items-center justify-between gap-4">
|
|
<div class="flex items-center gap-4 min-w-0">
|
|
<!-- Icon jetzt links -->
|
|
<div class="p-3 bg-emerald-50 text-emerald-600 rounded-xl shrink-0 shadow-sm border border-emerald-100">
|
|
<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="M2.25 12.75V12A2.25 2.25 0 0 1 4.5 9.75h15A2.25 2.25 0 0 1 21.75 12v.75m-19.5 0A2.25 2.25 0 0 0 2.25 15v2.25m0-4.5A2.25 2.25 0 0 1 4.5 12h15a2.25 2.25 0 0 1 2.25 2.25m-19.5 0v4.5A2.25 2.25 0 0 0 4.5 21h15a2.25 2.25 0 0 0 2.25-2.25V15M2.25 12V6a2.25 2.25 0 0 1 2.25-2.25h2.25c.59 0 1.157.234 1.576.652L9.75 5.85a2.25 2.25 0 0 0 1.576.652h6.924a2.25 2.25 0 0 1 2.25 2.25v3.25" />
|
|
</svg>
|
|
</div>
|
|
<div class="space-y-0.5 min-w-0">
|
|
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider truncate">Kategorien</p>
|
|
<p class="text-xs text-gray-500 truncate">Geräte-Typen</p>
|
|
</div>
|
|
</div>
|
|
<!-- Große Zahl jetzt rechtsbündig -->
|
|
<h3 class="text-3xl font-black text-gray-900 text-end shrink-0"><%= Category.count %></h3>
|
|
</div>
|
|
|
|
<!-- KACHEL 3: RÄUME & STANDORTE -->
|
|
<div class="bg-white border border-gray-200 rounded-xl p-6 shadow-sm flex items-center justify-between gap-4 sm:col-span-2 lg:col-span-1">
|
|
<div class="flex items-center gap-4 min-w-0">
|
|
<!-- Icon jetzt links -->
|
|
<div class="p-3 bg-amber-50 text-amber-600 rounded-xl shrink-0 shadow-sm border border-amber-100">
|
|
<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 class="space-y-0.5 min-w-0">
|
|
<p class="text-xs font-bold text-gray-400 uppercase tracking-wider truncate">Räume & Büros</p>
|
|
<p class="text-xs text-gray-500 truncate">Erfasste Standorte</p>
|
|
</div>
|
|
</div>
|
|
<!-- Große Zahl jetzt rechtsbündig -->
|
|
<h3 class="text-3xl font-black text-gray-900 text-end shrink-0"><%= Room.count %></h3>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- UNTERER BEREICH: BREITEN-OPTIMIERTE LISTEN (items-start verhindert vertikale Streckung) -->
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-6 items-start">
|
|
|
|
<!-- SPALTE 1: ZULETZT HINZUGEFÜGTE ARTIKEL -->
|
|
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden flex flex-col h-fit">
|
|
<div class="px-5 py-4 border-b border-gray-200 bg-gray-50 flex items-center gap-2 shrink-0">
|
|
<svg class="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
|
|
</svg>
|
|
<h3 class="font-bold text-gray-700 text-sm">Zuletzt hinzugefügt</h3>
|
|
</div>
|
|
|
|
<div class="overflow-x-auto">
|
|
<table class="min-w-full divide-y divide-gray-200 text-xs table-fixed">
|
|
<tbody class="divide-y divide-gray-200 bg-white">
|
|
<% @recent_items.each.each do |item| %>
|
|
<tr class="hover:bg-gray-50/50 transition">
|
|
<!-- KORREKTUR: max-w begrenzt die Breite, whitespace-normal erlaubt Zeilenumbruch -->
|
|
<td class="px-5 py-3.5 text-start align-middle max-w-[200px] sm:max-w-[250px]">
|
|
<div class="flex items-start gap-2.5">
|
|
<%= link_to item_path(item), class: "shrink-0 transition hover:scale-105 active:scale-95 block" do %>
|
|
<span class="inline-flex items-center font-mono font-bold text-[10px] text-white bg-blue-600 px-1.5 py-0.5 rounded shadow-sm tracking-wider mt-0.5">
|
|
#<%= item.sticker_id %>
|
|
</span>
|
|
<% end %>
|
|
<div class="min-w-0 whitespace-normal break-words">
|
|
<%= link_to item_path(item), class: "font-bold text-gray-900 hover:text-blue-600 hover:underline inline leading-tight" do %>
|
|
<%= item.name %>
|
|
<% end %>
|
|
<span class="block text-[10px] text-gray-400 mt-0.5"><%= item.category.name %></span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="px-5 py-3.5 whitespace-nowrap align-middle shrink-0 w-32">
|
|
<% if item.user.present? %>
|
|
<span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-green-50 text-green-800 px-2 py-0.5 rounded border border-green-200 shadow-sm">
|
|
<svg class="h-3 w-3 text-green-600 shrink-0" 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 1 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" />
|
|
</svg>
|
|
<%= item.user.name %>
|
|
</span>
|
|
<% elsif item.room.present? %>
|
|
<%= link_to room_path item.room do %>
|
|
<span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-blue-50 text-blue-800 px-2 py-0.5 rounded border border-blue-200 shadow-sm">
|
|
<svg class="h-3 w-3 text-blue-600 shrink-0" 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>
|
|
<%= item.room.name %>
|
|
</span>
|
|
<% end %>
|
|
<% else %>
|
|
<span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-amber-50 text-amber-800 px-2 py-0.5 rounded border border-amber-200 shadow-sm">
|
|
<svg class="h-3 w-3 text-amber-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l5.25 3.03M12 12.75v9" />
|
|
</svg>
|
|
Hauptlager
|
|
</span>
|
|
<% end %>
|
|
</td>
|
|
<td class="px-5 py-3.5 whitespace-nowrap text-end text-gray-400 font-medium align-middle shrink-0 w-24">
|
|
<%= time_ago_in_words(item.created_at) %>
|
|
</td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SPALTE 2: LETZTE LOGBUCH-AKTIVITÄTEN (HISTORIE) -->
|
|
<div class="bg-white border border-gray-200 rounded-xl shadow-sm overflow-hidden flex flex-col h-fit">
|
|
<div class="px-5 py-4 border-b border-gray-200 bg-gray-50 flex items-center gap-2 shrink-0">
|
|
<svg class="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
|
</svg>
|
|
<h3 class="font-bold text-gray-700 text-sm">Letzte Aktivitäten</h3>
|
|
</div>
|
|
|
|
<div class="overflow-x-auto">
|
|
<table class="min-w-full divide-y divide-gray-200 text-xs table-fixed">
|
|
<tbody class="divide-y divide-gray-200 bg-white">
|
|
<% @recent_assignments.each do |log| %>
|
|
<tr class="hover:bg-gray-50/50 transition">
|
|
<!-- KORREKTUR: max-w begrenzt die Breite, whitespace-normal erlaubt Zeilenumbruch -->
|
|
<td class="px-5 py-3.5 text-start align-middle max-w-[200px] sm:max-w-[250px]">
|
|
<div class="flex items-start gap-2.5">
|
|
<%= link_to item_path(log.item), class: "shrink-0 transition hover:scale-105 active:scale-95 block" do %>
|
|
<span class="inline-flex items-center font-mono font-bold text-[10px] text-white bg-blue-600 px-1.5 py-0.5 rounded shadow-sm tracking-wider mt-0.5">
|
|
#<%= log.item.sticker_id %>
|
|
</span>
|
|
<% end %>
|
|
<div class="min-w-0 whitespace-normal break-words">
|
|
<% if log.item.present? %>
|
|
<%= link_to item_path(log.item), class: "font-bold text-gray-900 hover:text-blue-600 hover:underline inline leading-tight" do %>
|
|
<%= log.item.name %>
|
|
<% end %>
|
|
<% else %>
|
|
<span class="font-bold text-gray-400">Gelöschter Artikel</span>
|
|
<% end %>
|
|
|
|
<div class="mt-1">
|
|
<% if log.user.present? %>
|
|
<span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-green-50 text-green-800 px-2 py-0.5 rounded border border-green-200 shadow-sm">
|
|
<svg class="h-3 w-3 text-green-600 shrink-0" 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 1 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" />
|
|
</svg>
|
|
<%= log.user.name %> zugewiesen
|
|
</span>
|
|
<% elsif log.room.present? %>
|
|
<%= link_to room_path log.room do %>
|
|
<span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-blue-50 text-blue-800 px-2 py-0.5 rounded border border-blue-200 shadow-sm">
|
|
<svg class="h-3 w-3 text-blue-600 shrink-0" 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>
|
|
In <%= log.room.name %> platziert
|
|
</span>
|
|
<% end %>
|
|
<% else %>
|
|
<span class="inline-flex items-center gap-1 text-[11px] font-semibold bg-amber-50 text-amber-800 px-2 py-0.5 rounded border border-amber-200 shadow-sm">
|
|
<svg class="h-3 w-3 text-amber-600 shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l5.25 3.03M12 12.75v9" />
|
|
</svg>
|
|
Hauptlager zurückgebracht
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="px-5 py-3.5 whitespace-nowrap text-end text-gray-400 font-medium align-middle shrink-0 w-24">
|
|
<%= time_ago_in_words(log.assigned_at) %>
|
|
</td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|