80 lines
3.3 KiB
Plaintext
80 lines
3.3 KiB
Plaintext
<div class="bg-white shadow-sm rounded-lg mb-6">
|
|
<div class="px-6 py-4">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<h2 class="text-lg font-medium text-gray-900">Import Progress</h2>
|
|
<%# Reuse the status_badge helper - need to define it here since it's a partial %>
|
|
<% def status_badge(status) %>
|
|
<% case status %>
|
|
<% when 'pending' %>
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
|
|
<%= status.capitalize %>
|
|
</span>
|
|
<% when 'processing' %>
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
|
<%= status.capitalize %>
|
|
</span>
|
|
<% when 'completed' %>
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">
|
|
<%= status.capitalize %>
|
|
</span>
|
|
<% when 'failed' %>
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800">
|
|
<%= status.capitalize %>
|
|
</span>
|
|
<% else %>
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
|
|
<%= status.capitalize %>
|
|
</span>
|
|
<% end %>
|
|
<% end %>
|
|
<%= status_badge(@data_import.status) %>
|
|
</div>
|
|
|
|
<!-- Progress Bar -->
|
|
<div class="mb-4">
|
|
<div class="flex items-center justify-between text-sm text-gray-600 mb-1">
|
|
<span><%= number_with_delimiter(@data_import.processed_records) %> of <%= number_with_delimiter(@data_import.total_records) %> records</span>
|
|
<span><%= @data_import.progress_percentage %>%</span>
|
|
</div>
|
|
<div class="w-full bg-gray-200 rounded-full h-2">
|
|
<div class="bg-blue-600 h-2 rounded-full transition-all duration-300"
|
|
style="width: <%= @data_import.progress_percentage %>%"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Stats Grid -->
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
|
|
<div class="bg-gray-50 rounded-lg p-4">
|
|
<div class="text-2xl font-semibold text-gray-900">
|
|
<%= number_with_delimiter(@data_import.total_records) %>
|
|
</div>
|
|
<div class="text-sm text-gray-600">Total Records</div>
|
|
</div>
|
|
<div class="bg-green-50 rounded-lg p-4">
|
|
<div class="text-2xl font-semibold text-green-900">
|
|
<%= number_with_delimiter(@data_import.processed_records) %>
|
|
</div>
|
|
<div class="text-sm text-green-600">Processed</div>
|
|
</div>
|
|
<div class="bg-red-50 rounded-lg p-4">
|
|
<div class="text-2xl font-semibold text-red-900">
|
|
<%= number_with_delimiter(@data_import.failed_records) %>
|
|
</div>
|
|
<div class="text-sm text-red-600">Failed</div>
|
|
</div>
|
|
<div class="bg-blue-50 rounded-lg p-4">
|
|
<div class="text-2xl font-semibold text-blue-900">
|
|
<%= number_with_delimiter(@data_import.records_per_second) %>
|
|
</div>
|
|
<div class="text-sm text-blue-600">Records/Sec</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<%# Auto-refresh logic for completed/failed imports %>
|
|
<% if @data_import.completed? || @data_import.failed? %>
|
|
<script>
|
|
setTimeout(() => window.location.reload(), 2000);
|
|
</script>
|
|
<% end %> |