Files
archived-teslamate/lib/teslamate_web/live/geofence_live/index.html.heex
2021-09-22 17:10:48 +02:00

64 lines
2.4 KiB
Plaintext

<nav class="breadcrumb" aria-label="breadcrumbs">
<ul>
<li><%= live_redirect gettext("Home"), to: "/" %></li>
<li class="is-active"><%= live_redirect gettext("Geo-Fences"), to: "/geo-fences" %></li>
</ul>
</nav>
<%= live_redirect raw("""
<span>#{gettext("Create")}</span>
<span class="icon">
<span class="mdi mdi-plus"></span>
</span>
""") ,
to: Routes.live_path(@socket, TeslaMateWeb.GeoFenceLive.Form),
class: "button is-info is-small is-rounded is-pulled-right mb-4"
%>
<table class="table is-fullwidth">
<thead class="is-hidden-mobile">
<tr>
<th><%= gettext("Name") %></th>
<th><%= gettext("Position") %></th>
<th><%= gettext("Radius") %></th>
<th></th>
</tr>
</thead>
<tbody style="font-variant-numeric: tabular-nums;">
<%= for geofence <- @geofences do %>
<tr>
<td class="has-text-weight-medium is-truncated" style="min-width: 0; max-width: 180px"><%= geofence.name %></td>
<td class="is-hidden-mobile has-text-weight-light" style="width: 30%"><%= geofence.latitude %>, <%= geofence.longitude %></td>
<td class="is-hidden-mobile has-text-weight-light" style="width: 10%"><%=
case @unit_of_length do
:ft -> geofence.radius |> Convert.m_to_ft() |> round()
:m -> geofence.radius |> round()
end
%> <%= @unit_of_length %></td>
<td>
<div class="field is-grouped is-pulled-right">
<p class="control">
<%= live_redirect raw("<span class='icon'><span class='mdi mdi-square-edit-outline'></span></span>"),
to: Routes.live_path(@socket, TeslaMateWeb.GeoFenceLive.Form, geofence, []),
class: "button is-info is-small is-inverted is-light"
%>
</p>
<p class="control">
<%= link raw("<span class='icon'><span class='mdi mdi-trash-can'></span></span>"),
to: "#", phx_hook: "ConfirmGeoFenceDeletion",
data: [
id: geofence.id,
msg: gettext("Delete '%{geo_fence}'?", geo_fence: geofence.name)
],
type: "button",
id: "delete_#{geofence.id}",
class: "button is-danger is-small is-inverted is-light"
%>
</p>
</div>
</td>
</tr>
<% end %>
</tbody>
</table>