Change storage display from chart to sensor list
- Display storage sensors as a list similar to temperature/voltage - Show individual disk/partition usage with current values - Link to graph view from sensor names - More consistent with other sensor displays
This commit is contained in:
parent
bf301aa5fc
commit
d5905cea73
2 changed files with 38 additions and 24 deletions
|
|
@ -57,12 +57,14 @@ defmodule ToweropsWeb.EquipmentLive.Show do
|
|||
storage_chart_data = load_sensor_chart_data(equipment_id, ["disk_usage"])
|
||||
traffic_chart_data = load_overall_traffic_chart_data(equipment_id)
|
||||
|
||||
# Filter sensors by type for temperature and voltage
|
||||
# Filter sensors by type for temperature, voltage, and storage
|
||||
temperature_sensors =
|
||||
Enum.filter(snmp_data.sensors, &(&1.sensor_type in ["temperature", "cpu_temperature", "celsius"]))
|
||||
|
||||
voltage_sensors = Enum.filter(snmp_data.sensors, &(&1.sensor_type in ["voltage", "volts"]))
|
||||
|
||||
storage_sensors = Enum.filter(snmp_data.sensors, &(&1.sensor_type in ["disk_usage"]))
|
||||
|
||||
# Calculate metrics for dashboard
|
||||
metrics = calculate_metrics(recent_checks, equipment)
|
||||
|
||||
|
|
@ -81,6 +83,7 @@ defmodule ToweropsWeb.EquipmentLive.Show do
|
|||
|> assign(:traffic_chart_data, traffic_chart_data)
|
||||
|> assign(:temperature_sensors, temperature_sensors)
|
||||
|> assign(:voltage_sensors, voltage_sensors)
|
||||
|> assign(:storage_sensors, storage_sensors)
|
||||
end
|
||||
|
||||
defp calculate_metrics(checks, _equipment) do
|
||||
|
|
|
|||
|
|
@ -268,31 +268,42 @@
|
|||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<!-- Storage Usage Chart -->
|
||||
<%= if @storage_chart_data do %>
|
||||
<!-- Storage Usage -->
|
||||
<%= if @storage_sensors && length(@storage_sensors) > 0 do %>
|
||||
<div class="bg-white dark:bg-zinc-800 rounded-lg border border-zinc-200 dark:border-zinc-700">
|
||||
<.link
|
||||
navigate={
|
||||
~p"/orgs/#{@current_organization.slug}/equipment/#{@equipment.id}/graph/storage"
|
||||
}
|
||||
class="block px-4 py-3 border-b border-zinc-200 dark:border-zinc-700 hover:bg-zinc-50 dark:hover:bg-zinc-750 transition-colors"
|
||||
>
|
||||
<div class="flex items-center justify-between">
|
||||
<h3 class="text-sm font-semibold text-zinc-900 dark:text-zinc-100">
|
||||
Storage Usage
|
||||
</h3>
|
||||
<.icon name="hero-arrow-right" class="h-4 w-4 text-zinc-400" />
|
||||
</div>
|
||||
</.link>
|
||||
<div class="px-4 py-3 border-b border-zinc-200 dark:border-zinc-700">
|
||||
<h3 class="text-sm font-semibold text-zinc-900 dark:text-zinc-100">
|
||||
Storage Usage
|
||||
</h3>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<div
|
||||
id="storage-chart"
|
||||
phx-hook="SensorChart"
|
||||
data-chart={@storage_chart_data}
|
||||
style="height: 300px;"
|
||||
>
|
||||
<canvas></canvas>
|
||||
</div>
|
||||
<dl class="space-y-3">
|
||||
<%= for sensor <- @storage_sensors do %>
|
||||
<div class="flex justify-between py-2 border-b border-zinc-100 dark:border-zinc-800">
|
||||
<dt class="text-sm text-zinc-600 dark:text-zinc-400">
|
||||
<.link
|
||||
navigate={
|
||||
~p"/orgs/#{@current_organization.slug}/equipment/#{@equipment.id}/graph/storage"
|
||||
}
|
||||
class="hover:text-blue-600 dark:hover:text-blue-400 hover:underline"
|
||||
>
|
||||
{sensor.sensor_descr}
|
||||
</.link>
|
||||
</dt>
|
||||
<dd class="text-sm font-medium text-zinc-900 dark:text-zinc-100">
|
||||
<%= if sensor.latest_reading do %>
|
||||
{format_sensor_value(
|
||||
sensor.latest_reading.value,
|
||||
sensor.sensor_divisor
|
||||
)}
|
||||
{sensor.sensor_unit}
|
||||
<% else %>
|
||||
N/A
|
||||
<% end %>
|
||||
</dd>
|
||||
</div>
|
||||
<% end %>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue