bionickatana/car-tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Made UI pretty!
CI / scan_ruby (push) Failing after 9s
Details
CI / scan_js (push) Failing after 7s
Details
CI / lint (push) Failing after 8s
Details

Browse Source
This commit is contained in:
bionickatana
2026-09-17 20:59:56 -06:00
parent 7c71f4a0ad
commit 87894ad620
6 changed files with 938 additions and 287 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/views/vehicles/index.html.erb
+63 -30
View File
@@ -1,38 +1,71 @@
<main>
<p><%= notice %></p>
<main class="page-shell">
<% if notice.present? %>
<p class="flash flash--notice"><%= notice %></p>
<% end %>
<h1>Vehicles</h1>
<header class="page-header">
<div>
<p class="eyebrow">Fleet dashboard</p>
<h1>Vehicles</h1>
</div>
<%= link_to "New vehicle", new_vehicle_path, class: "button button--primary" %>
</header>
<nav aria-label="Vehicle filters">
<%= link_to "Active", vehicles_path %> |
<%= link_to "Inactive", vehicles_path(status: "inactive") %> |
<%= link_to "All", vehicles_path(status: "all") %>
<nav class="filter-nav" aria-label="Vehicle filters">
<%= link_to "Active", vehicles_path, class: ["filter-pill", ("filter-pill--active" if @status.blank?)] %>
<%= link_to "Inactive", vehicles_path(status: "inactive"), class: ["filter-pill", ("filter-pill--active" if @status == "inactive")] %>
<%= link_to "All", vehicles_path(status: "all"), class: ["filter-pill", ("filter-pill--active" if @status == "all")] %>
</nav>
<p><%= link_to "New vehicle", new_vehicle_path %></p>
<% if @vehicles.any? %>
<table>
<thead>
<tr>
<th>Vehicle</th>
<th>Licence plate</th>
<th>Odometer</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<% @vehicles.each do |vehicle| %>
<tr>
<td><%= link_to "#{vehicle.year} #{vehicle.make} #{vehicle.model}", vehicle %></td>
<td><%= vehicle.licence_plate %></td>
<td><%= number_with_delimiter(vehicle.current_odometer) %></td>
<td><%= vehicle.active? ? "Active" : "Inactive" %></td>
</tr>
<% end %>
</tbody>
</table>
<section class="vehicle-grid" aria-label="Vehicles">
<% @vehicles.each do |vehicle| %>
<% statuses = @vehicle_maintenance_statuses.fetch(vehicle, []) %>
<% overdue_statuses = statuses.select(&:overdue?) %>
<% upcoming_statuses = statuses.select(&:upcoming?) %>
<% card_classes = ["vehicle-card"] %>
<% card_classes << "vehicle-card--overdue" if overdue_statuses.any? %>
<% card_classes << "vehicle-card--upcoming" if overdue_statuses.empty? && upcoming_statuses.any? %>
<% card_classes << "vehicle-card--inactive" unless vehicle.active? %>
<article class="<%= card_classes.compact.join(" ") %>">
<%= link_to vehicle, class: "vehicle-card__link" do %>
<div class="vehicle-card__header">
<h2><%= vehicle.year %> <%= vehicle.make %> <%= vehicle.model %></h2>
<span class="status-badge <%= vehicle.active? ? "status-badge--active" : "status-badge--inactive" %>">
<%= vehicle.active? ? "Active" : "Inactive" %>
</span>
</div>
<dl class="vehicle-card__facts">
<div>
<dt>Plate</dt>
<dd><%= vehicle.licence_plate %></dd>
</div>
<div>
<dt>Odometer</dt>
<dd><%= number_with_delimiter(vehicle.current_odometer) %></dd>
</div>
</dl>
<% if overdue_statuses.any? %>
<div class="maintenance-summary maintenance-summary--overdue">
<strong>Overdue maintenance</strong>
<p><%= overdue_statuses.map { |status| status.schedule.maintenance_type }.to_sentence %></p>
</div>
<% elsif upcoming_statuses.any? %>
<div class="maintenance-summary maintenance-summary--upcoming">
<strong>Upcoming maintenance</strong>
<p><%= upcoming_statuses.map { |status| status.schedule.maintenance_type }.to_sentence %></p>
</div>
<% else %>
<p class="maintenance-current">No upcoming maintenance</p>
<% end %>
<% end %>
</article>
<% end %>
</section>
<% else %>
<p>No vehicles found.</p>
<p class="empty-state">No vehicles found.</p>
<% end %>
</main>