|
|
|
|
@ -7,7 +7,7 @@
|
|
|
|
|
isTomorrow,
|
|
|
|
|
} from "$lib/utils/date";
|
|
|
|
|
import { success, error as toastError } from "$lib/stores/toasts";
|
|
|
|
|
import { tick } from "svelte";
|
|
|
|
|
import { tick, onDestroy } from "svelte";
|
|
|
|
|
import Popover from "$lib/ui/feedback/Popover.svelte";
|
|
|
|
|
import { normalizeDigits, buildWaMeUrl } from "$lib/utils/phone";
|
|
|
|
|
|
|
|
|
|
@ -43,6 +43,11 @@
|
|
|
|
|
? "Sin responsable"
|
|
|
|
|
: `Responsables: ${assigneesCount}${isAssigned ? " (tú)" : ""}`;
|
|
|
|
|
|
|
|
|
|
onDestroy(() => {
|
|
|
|
|
// Cerrar popover si se desmonta el item (por navegación o filtrado)
|
|
|
|
|
showAssignees = false;
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// Edición de texto (inline)
|
|
|
|
|
let editingText = false;
|
|
|
|
|
let descEl: HTMLElement | null = null;
|
|
|
|
|
@ -282,18 +287,33 @@
|
|
|
|
|
{/if}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="assignees">
|
|
|
|
|
<button
|
|
|
|
|
class="assignees-badge"
|
|
|
|
|
type="button"
|
|
|
|
|
aria-haspopup="dialog"
|
|
|
|
|
aria-expanded={showAssignees}
|
|
|
|
|
aria-controls={"assignees-popover-" + id}
|
|
|
|
|
title={assigneesCount === 0 ? "Sin responsable" : "Ver responsables"}
|
|
|
|
|
on:click|preventDefault={() => (showAssignees = true)}
|
|
|
|
|
bind:this={assigneesButtonEl}
|
|
|
|
|
>
|
|
|
|
|
👥 {assigneesLabel}
|
|
|
|
|
</button>
|
|
|
|
|
{#if assigneesCount === 0}
|
|
|
|
|
<button
|
|
|
|
|
class="assignees-badge empty"
|
|
|
|
|
type="button"
|
|
|
|
|
aria-haspopup="dialog"
|
|
|
|
|
aria-expanded="false"
|
|
|
|
|
aria-controls={"assignees-popover-" + id}
|
|
|
|
|
title="Sin responsable"
|
|
|
|
|
disabled
|
|
|
|
|
bind:this={assigneesButtonEl}
|
|
|
|
|
>
|
|
|
|
|
🙅
|
|
|
|
|
</button>
|
|
|
|
|
{:else}
|
|
|
|
|
<button
|
|
|
|
|
class="assignees-badge"
|
|
|
|
|
type="button"
|
|
|
|
|
aria-haspopup="dialog"
|
|
|
|
|
aria-expanded={showAssignees}
|
|
|
|
|
aria-controls={"assignees-popover-" + id}
|
|
|
|
|
title="Ver responsables"
|
|
|
|
|
on:click|preventDefault={() => (showAssignees = true)}
|
|
|
|
|
bind:this={assigneesButtonEl}
|
|
|
|
|
>
|
|
|
|
|
👥 {assigneesLabel}
|
|
|
|
|
</button>
|
|
|
|
|
{/if}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="actions">
|
|
|
|
|
{#if !completed}
|
|
|
|
|
@ -374,7 +394,7 @@
|
|
|
|
|
{/if}
|
|
|
|
|
{/if}
|
|
|
|
|
</div>
|
|
|
|
|
<Popover bind:open={showAssignees} ariaLabel="Responsables" id={"assignees-popover-" + id} on:closed={() => { tick().then(() => assigneesButtonEl?.focus()); }}>
|
|
|
|
|
<Popover bind:open={showAssignees} ariaLabel="Responsables" id={"assignees-popover-" + id}>
|
|
|
|
|
<h3 class="popover-title">Responsables</h3>
|
|
|
|
|
{#if assigneesCount === 0}
|
|
|
|
|
<p class="muted">No hay responsables asignados.</p>
|
|
|
|
|
@ -589,6 +609,14 @@
|
|
|
|
|
.assignees-badge[aria-expanded="true"] {
|
|
|
|
|
border-color: var(--color-primary);
|
|
|
|
|
}
|
|
|
|
|
.assignees-badge:disabled {
|
|
|
|
|
cursor: not-allowed;
|
|
|
|
|
opacity: 0.6;
|
|
|
|
|
}
|
|
|
|
|
.assignees-badge.empty {
|
|
|
|
|
padding: 2px 6px;
|
|
|
|
|
gap: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.assignees-list {
|
|
|
|
|
list-style: none;
|
|
|
|
|
|