feat: add task liveview
This commit is contained in:
parent
efa5489225
commit
26b33060ee
4 changed files with 271 additions and 25 deletions
78
lib/putzplan_web/live/task_live/form_component.ex
Normal file
78
lib/putzplan_web/live/task_live/form_component.ex
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
defmodule PutzplanWeb.TaskLive.FormComponent do
|
||||
use PutzplanWeb, :live_component
|
||||
|
||||
@impl true
|
||||
def render(assigns) do
|
||||
~H"""
|
||||
<div>
|
||||
<.header>
|
||||
<%= @title %>
|
||||
<:subtitle>Use this form to manage task records in your database.</:subtitle>
|
||||
</.header>
|
||||
|
||||
<.simple_form
|
||||
for={@form}
|
||||
id="task-form"
|
||||
phx-target={@myself}
|
||||
phx-change="validate"
|
||||
phx-submit="save"
|
||||
>
|
||||
|
||||
|
||||
<.input field={@form[:description]} type="text" label="Description" /><.input field={@form[:repetition_days]} type="number" label="Repetition days" />
|
||||
|
||||
|
||||
<:actions>
|
||||
<.button phx-disable-with="Saving...">Save Task</.button>
|
||||
</:actions>
|
||||
</.simple_form>
|
||||
</div>
|
||||
"""
|
||||
end
|
||||
|
||||
@impl true
|
||||
def update(assigns, socket) do
|
||||
{:ok,
|
||||
socket
|
||||
|> assign(assigns)
|
||||
|> assign_form()}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_event("validate", %{"task" => task_params}, socket) do
|
||||
{:noreply, assign(socket, form: AshPhoenix.Form.validate(socket.assigns.form, task_params))}
|
||||
end
|
||||
|
||||
def handle_event("save", %{"task" => task_params}, socket) do
|
||||
case AshPhoenix.Form.submit(socket.assigns.form, params: task_params) do
|
||||
{:ok, task} ->
|
||||
notify_parent({:saved, task})
|
||||
|
||||
socket =
|
||||
socket
|
||||
|> put_flash(:info, "Task #{socket.assigns.form.source.type}d successfully")
|
||||
|> push_patch(to: socket.assigns.patch)
|
||||
|
||||
{:noreply, socket}
|
||||
|
||||
{:error, form} ->
|
||||
{:noreply, assign(socket, form: form)}
|
||||
end
|
||||
end
|
||||
|
||||
defp notify_parent(msg), do: send(self(), {__MODULE__, msg})
|
||||
|
||||
defp assign_form(%{assigns: %{task: task}} = socket) do
|
||||
form =
|
||||
if task do
|
||||
AshPhoenix.Form.for_update(task, :update, as: "task", actor: socket.assigns.current_user)
|
||||
else
|
||||
AshPhoenix.Form.for_create(Putzplan.Tasks.Task, :create,
|
||||
as: "task",
|
||||
actor: socket.assigns.current_user
|
||||
)
|
||||
end
|
||||
|
||||
assign(socket, form: to_form(form))
|
||||
end
|
||||
end
|
||||
109
lib/putzplan_web/live/task_live/index.ex
Normal file
109
lib/putzplan_web/live/task_live/index.ex
Normal file
|
|
@ -0,0 +1,109 @@
|
|||
defmodule PutzplanWeb.TaskLive.Index do
|
||||
use PutzplanWeb, :live_view
|
||||
|
||||
@impl true
|
||||
def render(assigns) do
|
||||
~H"""
|
||||
<.header>
|
||||
Listing Tasks
|
||||
<:actions>
|
||||
<.link patch={~p"/tasks/new"}>
|
||||
<.button>New Task</.button>
|
||||
</.link>
|
||||
</:actions>
|
||||
</.header>
|
||||
|
||||
<.table
|
||||
id="tasks"
|
||||
rows={@streams.tasks}
|
||||
row_click={fn {_id, task} -> JS.navigate(~p"/tasks/#{task}") end}
|
||||
>
|
||||
|
||||
<:col :let={{_id, task}} label="Id"><%= task.id %></:col>
|
||||
|
||||
<:col :let={{_id, task}} label="Description"><%= task.description %></:col>
|
||||
|
||||
<:col :let={{_id, task}} label="Repetition days"><%= task.repetition_days %></:col>
|
||||
|
||||
<:action :let={{_id, task}}>
|
||||
<div class="sr-only">
|
||||
<.link navigate={~p"/tasks/#{task}"}>Show</.link>
|
||||
</div>
|
||||
|
||||
<.link patch={~p"/tasks/#{task}/edit"}>Edit</.link>
|
||||
|
||||
</:action>
|
||||
|
||||
<:action :let={{id, task}}>
|
||||
<.link
|
||||
phx-click={JS.push("delete", value: %{id: task.id}) |> hide("##{id}")}
|
||||
data-confirm="Are you sure?"
|
||||
>
|
||||
Delete
|
||||
</.link>
|
||||
</:action>
|
||||
|
||||
</.table>
|
||||
|
||||
|
||||
<.modal :if={@live_action in [:new, :edit]} id="task-modal" show on_cancel={JS.patch(~p"/tasks")}>
|
||||
<.live_component
|
||||
module={PutzplanWeb.TaskLive.FormComponent}
|
||||
id={(@task && @task.id) || :new}
|
||||
title={@page_title}
|
||||
|
||||
current_user={@current_user}
|
||||
|
||||
action={@live_action}
|
||||
task={@task}
|
||||
patch={~p"/tasks"}
|
||||
/>
|
||||
</.modal>
|
||||
|
||||
"""
|
||||
end
|
||||
|
||||
@impl true
|
||||
def mount(_params, _session, socket) do
|
||||
{:ok,
|
||||
socket
|
||||
|> stream(:tasks, Ash.read!(Putzplan.Tasks.Task, actor: socket.assigns[:current_user]))
|
||||
|> assign_new(:current_user, fn -> nil end)}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_params(params, _url, socket) do
|
||||
{:noreply, apply_action(socket, socket.assigns.live_action, params)}
|
||||
end
|
||||
|
||||
defp apply_action(socket, :edit, %{"id" => id}) do
|
||||
socket
|
||||
|> assign(:page_title, "Edit Task")
|
||||
|> assign(:task, Ash.get!(Putzplan.Tasks.Task, id, actor: socket.assigns.current_user))
|
||||
end
|
||||
|
||||
defp apply_action(socket, :new, _params) do
|
||||
socket
|
||||
|> assign(:page_title, "New Task")
|
||||
|> assign(:task, nil)
|
||||
end
|
||||
|
||||
defp apply_action(socket, :index, _params) do
|
||||
socket
|
||||
|> assign(:page_title, "Listing Tasks")
|
||||
|> assign(:task, nil)
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_info({PutzplanWeb.TaskLive.FormComponent, {:saved, task}}, socket) do
|
||||
{:noreply, stream_insert(socket, :tasks, task)}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_event("delete", %{"id" => id}, socket) do
|
||||
task = Ash.get!(Putzplan.Tasks.Task, id, actor: socket.assigns.current_user)
|
||||
Ash.destroy!(task, actor: socket.assigns.current_user)
|
||||
|
||||
{:noreply, stream_delete(socket, :tasks, task)}
|
||||
end
|
||||
end
|
||||
65
lib/putzplan_web/live/task_live/show.ex
Normal file
65
lib/putzplan_web/live/task_live/show.ex
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
defmodule PutzplanWeb.TaskLive.Show do
|
||||
use PutzplanWeb, :live_view
|
||||
on_mount {PutzplanWeb.LiveUserAuth, :live_user_required}
|
||||
|
||||
@impl true
|
||||
def render(assigns) do
|
||||
~H"""
|
||||
<.header>
|
||||
Task <%= @task.id %>
|
||||
<:subtitle>This is a task record from your database.</:subtitle>
|
||||
|
||||
<:actions>
|
||||
<.link patch={~p"/tasks/#{@task}/show/edit"} phx-click={JS.push_focus()}>
|
||||
<.button>Edit task</.button>
|
||||
</.link>
|
||||
</:actions>
|
||||
|
||||
</.header>
|
||||
|
||||
<.list>
|
||||
|
||||
<:item title="Id"><%= @task.id %></:item>
|
||||
|
||||
<:item title="Description"><%= @task.description %></:item>
|
||||
|
||||
<:item title="Repetition days"><%= @task.repetition_days %></:item>
|
||||
|
||||
</.list>
|
||||
|
||||
<.back navigate={~p"/tasks"}>Back to tasks</.back>
|
||||
|
||||
|
||||
<.modal :if={@live_action == :edit} id="task-modal" show on_cancel={JS.patch(~p"/tasks/#{@task}")}>
|
||||
<.live_component
|
||||
module={PutzplanWeb.TaskLive.FormComponent}
|
||||
id={@task.id}
|
||||
title={@page_title}
|
||||
action={@live_action}
|
||||
|
||||
current_user={@current_user}
|
||||
|
||||
task={@task}
|
||||
patch={~p"/tasks/#{@task}"}
|
||||
/>
|
||||
</.modal>
|
||||
|
||||
"""
|
||||
end
|
||||
|
||||
@impl true
|
||||
def mount(_params, _session, socket) do
|
||||
{:ok, socket}
|
||||
end
|
||||
|
||||
@impl true
|
||||
def handle_params(%{"id" => id}, _, socket) do
|
||||
{:noreply,
|
||||
socket
|
||||
|> assign(:page_title, page_title(socket.assigns.live_action))
|
||||
|> assign(:task, Ash.get!(Putzplan.Tasks.Task, id, actor: socket.assigns.current_user))}
|
||||
end
|
||||
|
||||
defp page_title(:show), do: "Show Task"
|
||||
defp page_title(:edit), do: "Edit Task"
|
||||
end
|
||||
Loading…
Add table
Add a link
Reference in a new issue