125 lines
4.1 KiB
Elixir
125 lines
4.1 KiB
Elixir
defmodule PutzplanWeb.TaskLive.Show do
|
|
require Ash.Query
|
|
use PutzplanWeb, :live_view
|
|
|
|
@impl true
|
|
def render(assigns) do
|
|
~H"""
|
|
<.header>
|
|
Task {@task.description}
|
|
<:actions>
|
|
<.link patch={~p"/tasks/#{@task}/show/edit"} phx-click={JS.push_focus()}>
|
|
<.button>Edit task</.button>
|
|
</.link>
|
|
</:actions>
|
|
</.header>
|
|
|
|
<div class="mt-8">
|
|
<ul id="completed_tasks" class="flex flex-col" phx-update="stream">
|
|
<li
|
|
:for={{id, completed_task} <- @streams.completed_tasks}
|
|
id={"completed-task-#{id}"}
|
|
class="flex flex-col p-4 bg-gray-50 border border-gray-100 rounded-lg"
|
|
>
|
|
<div class="flex justify-between items-center mb-2">
|
|
<div class="text-sm text-gray-500">Completed by</div>
|
|
<div class="flex items-center">
|
|
<span class="inline-flex items-center justify-center h-8 w-8 rounded-full bg-green-100 text-green-800 mr-2">
|
|
{String.first(completed_task.users.name)}
|
|
</span>
|
|
<span class="text-gray-700 font-medium">{completed_task.users.name}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<div class="text-sm text-gray-500">Date</div>
|
|
<div class="text-gray-700">{completed_task.completion}</div>
|
|
</div>
|
|
|
|
<div class="mt-auto pt-2 flex justify-end">
|
|
<.link
|
|
phx-click={
|
|
JS.push("delete", value: %{id: completed_task.id}) |> hide("#completed-task-#{id}")
|
|
}
|
|
class="text-sm text-red-600 hover:text-red-800 flex items-center"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
class="w-4 h-4 mr-1"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0"
|
|
/>
|
|
</svg>
|
|
Delete
|
|
</.link>
|
|
</div>
|
|
</li>
|
|
|
|
<li class="col-span-full text-center p-4 bg-gray-50 rounded-lg border border-dashed border-gray-200 hidden only:flex">
|
|
<p class="text-gray-500">No completed tasks yet</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<.modal
|
|
:if={@live_action in [:new, :edit]}
|
|
id="task-modal"
|
|
show
|
|
on_cancel={JS.patch(~p"/tasks/#{@task}")}
|
|
>
|
|
<.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"/"}
|
|
/>
|
|
</.modal>
|
|
|
|
<.back navigate={~p"/"}>Back to tasks</.back>
|
|
"""
|
|
end
|
|
|
|
@impl true
|
|
def mount(_params, _session, socket) do
|
|
{:ok, socket}
|
|
end
|
|
|
|
@impl true
|
|
def handle_params(%{"id" => id}, _, socket) do
|
|
task = Ash.get!(Putzplan.Tasks.Task, id, actor: socket.assigns.current_user)
|
|
|
|
{:noreply,
|
|
socket
|
|
|> assign(:page_title, page_title(socket.assigns.live_action))
|
|
|> assign(:task, task)
|
|
|> stream(
|
|
:completed_tasks,
|
|
Putzplan.Tasks.CompletedTask
|
|
|> Ash.Query.filter(task_id == ^task.id)
|
|
|> Ash.read!(actor: socket.assigns[:current_user])
|
|
)}
|
|
end
|
|
|
|
defp page_title(:show), do: "Show Task"
|
|
defp page_title(:edit), do: "Edit Task"
|
|
|
|
@impl true
|
|
def handle_event("delete", %{"id" => id}, socket) do
|
|
completed_task =
|
|
Ash.get!(Putzplan.Tasks.CompletedTask, id, actor: socket.assigns.current_user)
|
|
|
|
Ash.destroy!(completed_task, actor: socket.assigns.current_user)
|
|
|
|
{:noreply, stream_delete(socket, :completed_tasks, completed_task)}
|
|
end
|
|
end
|