Aggiunge navigazione mobile dedicata e trasforma le principali liste operative in layout più leggibili e facili da toccare. Co-authored-by: Cursor <cursoragent@cursor.com>
133 lines
5.5 KiB
ERB
133 lines
5.5 KiB
ERB
<div class="space-y-6">
|
|
<h1 class="text-xl font-semibold tracking-tight md:text-2xl">Report</h1>
|
|
|
|
<section class="rounded-xl border border-zinc-200 bg-white p-5 text-zinc-900 dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<h2 class="text-lg font-semibold">Funnel</h2>
|
|
<div class="mt-4 overflow-x-auto">
|
|
<table class="min-w-full text-sm text-zinc-900 dark:text-zinc-100">
|
|
<thead>
|
|
<tr class="text-left text-xs uppercase tracking-wide text-zinc-500">
|
|
<th class="py-2">Stage</th>
|
|
<th>Count</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-zinc-100 dark:divide-zinc-800">
|
|
<% @funnel[:stages].each do |s| %>
|
|
<tr>
|
|
<td class="py-2"><%= s[:label] %></td>
|
|
<td class="font-semibold"><%= s[:count] %></td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="mt-4 space-y-1 text-sm text-zinc-600 dark:text-zinc-300">
|
|
<% @funnel[:funnel].each do |step| %>
|
|
<div><%= step[:label] %>: <strong class="text-zinc-900 dark:text-zinc-50"><%= step[:count] %></strong><% if step[:rate] %> (<%= step[:rate] %>% dal passo precedente)<% end %></div>
|
|
<% end %>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="rounded-xl border border-zinc-200 bg-white p-5 text-zinc-900 dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<h2 class="text-lg font-semibold">Lead source</h2>
|
|
<div class="mt-3 <%= table_wrap_class %>">
|
|
<table class="min-w-full text-sm text-zinc-900 dark:text-zinc-100">
|
|
<thead>
|
|
<tr class="text-left text-xs uppercase tracking-wide text-zinc-500">
|
|
<th class="py-2">Fonte</th>
|
|
<th>Lead</th>
|
|
<th>Opp.</th>
|
|
<th>Clienti</th>
|
|
<th>Conv.</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-zinc-100 dark:divide-zinc-800">
|
|
<% @lead_sources.each do |row| %>
|
|
<tr>
|
|
<td class="py-2"><%= row[:label] %></td>
|
|
<td><%= row[:leads] %></td>
|
|
<td><%= row[:opportunities] %></td>
|
|
<td><%= row[:customers] %></td>
|
|
<td><%= row[:conversion_rate] %>%</td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="grid gap-6 lg:grid-cols-2">
|
|
<section class="rounded-xl border border-zinc-200 bg-white p-5 text-zinc-900 dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<h2 class="text-lg font-semibold">Won / Lost per mese</h2>
|
|
<div class="mt-3 <%= table_wrap_class %>">
|
|
<table class="min-w-full text-sm text-zinc-900 dark:text-zinc-100">
|
|
<thead>
|
|
<tr class="text-left text-xs uppercase tracking-wide text-zinc-500">
|
|
<th class="py-2">Mese</th>
|
|
<th>Won</th>
|
|
<th>Lost</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-zinc-100 dark:divide-zinc-800">
|
|
<% @won_lost.each do |row| %>
|
|
<tr>
|
|
<td class="py-2"><%= l(row[:month], format: "%B %Y") %></td>
|
|
<td><%= row[:won] %></td>
|
|
<td><%= row[:lost] %></td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="rounded-xl border border-zinc-200 bg-white p-5 text-zinc-900 dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<h2 class="text-lg font-semibold">Lost reasons</h2>
|
|
<ul class="mt-3 space-y-2 text-sm text-zinc-900 dark:text-zinc-100">
|
|
<% @lost_reasons.each do |row| %>
|
|
<li class="flex justify-between gap-3"><span><%= row[:label] %></span><strong><%= row[:count] %></strong></li>
|
|
<% end %>
|
|
<% if @lost_reasons.blank? %><li class="text-zinc-500">Nessun dato</li><% end %>
|
|
</ul>
|
|
</section>
|
|
</div>
|
|
|
|
<section class="rounded-xl border border-zinc-200 bg-white p-5 text-zinc-900 dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<h2 class="text-lg font-semibold">Sales owner</h2>
|
|
<div class="mt-3 <%= table_wrap_class %>">
|
|
<table class="min-w-full text-sm text-zinc-900 dark:text-zinc-100">
|
|
<thead>
|
|
<tr class="text-left text-xs uppercase tracking-wide text-zinc-500">
|
|
<th class="py-2">Utente</th>
|
|
<th>Aperte</th>
|
|
<th>Valore aperte</th>
|
|
<th>Vinte</th>
|
|
<th>Valore vinte</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-zinc-100 dark:divide-zinc-800">
|
|
<% @sales_owners.each do |row| %>
|
|
<tr>
|
|
<td class="py-2"><%= row[:user].full_name %></td>
|
|
<td><%= row[:open_count] %></td>
|
|
<td><%= format_money(row[:open_value]) %></td>
|
|
<td><%= row[:won_count] %></td>
|
|
<td><%= format_money(row[:won_value]) %></td>
|
|
</tr>
|
|
<% end %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="rounded-xl border border-zinc-200 bg-white p-5 text-zinc-900 dark:border-zinc-800 dark:bg-zinc-900 dark:text-zinc-100">
|
|
<h2 class="text-lg font-semibold">Revenue (WON per mese)</h2>
|
|
<ul class="mt-3 space-y-2 text-sm text-zinc-900 dark:text-zinc-100">
|
|
<% @revenue.each do |row| %>
|
|
<li class="flex justify-between gap-3"><span><%= l(row[:month], format: "%B %Y") %></span><strong><%= format_money(row[:value]) %></strong></li>
|
|
<% end %>
|
|
<% if @revenue.blank? %><li class="text-zinc-500">Nessun dato</li><% end %>
|
|
</ul>
|
|
</section>
|
|
</div>
|