workign comments strucuture
This commit is contained in:
@@ -98,10 +98,16 @@
|
|||||||
<div class="grid gap-3 md:grid-cols-[1fr_auto]">
|
<div class="grid gap-3 md:grid-cols-[1fr_auto]">
|
||||||
<label class="sr-only" for="helpdesk-comment-search">Search comments</label>
|
<label class="sr-only" for="helpdesk-comment-search">Search comments</label>
|
||||||
<input id="helpdesk-comment-search" type="search" placeholder="Search comments, GUID, UNID, author or text..." class="block w-full rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 shadow-sm focus:border-red-500 focus:ring-red-500 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-100" data-helpdesk-comment-search>
|
<input id="helpdesk-comment-search" type="search" placeholder="Search comments, GUID, UNID, author or text..." class="block w-full rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 shadow-sm focus:border-red-500 focus:ring-red-500 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-100" data-helpdesk-comment-search>
|
||||||
<button type="button" class="inline-flex items-center justify-center rounded-xl bg-red-600 px-4 py-2 text-sm font-bold text-white shadow-sm hover:bg-red-700" data-helpdesk-expand-comments>
|
<div class="flex flex-wrap items-center gap-2">
|
||||||
<i class="fa-solid fa-up-right-and-down-left-from-center mr-2" aria-hidden="true"></i>
|
<button type="button" class="inline-flex items-center justify-center rounded-xl bg-red-600 px-4 py-2 text-sm font-bold text-white shadow-sm hover:bg-red-700" data-helpdesk-expand-comments>
|
||||||
Expand all
|
<i class="fa-solid fa-up-right-and-down-left-from-center mr-2" aria-hidden="true"></i>
|
||||||
</button>
|
Expand all
|
||||||
|
</button>
|
||||||
|
<button type="button" class="inline-flex items-center justify-center rounded-xl bg-slate-700 px-4 py-2 text-sm font-bold text-white shadow-sm hover:bg-slate-800 dark:bg-slate-600 dark:hover:bg-slate-500" data-helpdesk-collapse-comments>
|
||||||
|
<i class="fa-solid fa-down-left-and-up-right-to-center mr-2" aria-hidden="true"></i>
|
||||||
|
Collapse all
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@if ($ticket->comments->isNotEmpty())
|
@if ($ticket->comments->isNotEmpty())
|
||||||
@@ -228,7 +234,18 @@
|
|||||||
const expandButton = event.target.closest('[data-helpdesk-expand-comments]');
|
const expandButton = event.target.closest('[data-helpdesk-expand-comments]');
|
||||||
|
|
||||||
if (expandButton) {
|
if (expandButton) {
|
||||||
document.querySelectorAll('[data-helpdesk-comment-card]').forEach((card) => card.open = true);
|
document.querySelectorAll('[data-helpdesk-comments-shell], [data-helpdesk-comment-card]').forEach((card) => {
|
||||||
|
card.open = true;
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const collapseButton = event.target.closest('[data-helpdesk-collapse-comments]');
|
||||||
|
|
||||||
|
if (collapseButton) {
|
||||||
|
document.querySelectorAll('[data-helpdesk-comment-card]').forEach((card) => {
|
||||||
|
card.open = false;
|
||||||
|
});
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -15,7 +15,7 @@
|
|||||||
@endphp
|
@endphp
|
||||||
|
|
||||||
@if (! $isInternal || $canSeeInternalNotes)
|
@if (! $isInternal || $canSeeInternalNotes)
|
||||||
<details open class="group rounded-2xl border {{ $borderClass }} bg-white shadow-sm transition dark:bg-zinc-900" data-helpdesk-comment-card data-helpdesk-comment-text="{{ e(Str::lower(strip_tags((string) $comment->body).' '.($comment->body_text ?? '').' '.($commentUser?->name ?? '').' '.($comment->unid ?? '').' '.($comment->guid ?? ''))) }}" style="margin-left: {{ min((int) $level, 4) * 1.25 }}rem">
|
<details class="group rounded-2xl border {{ $borderClass }} bg-white shadow-sm transition dark:bg-zinc-900" data-helpdesk-comment-card data-helpdesk-comment-text="{{ e(Str::lower(strip_tags((string) $comment->body).' '.($comment->body_text ?? '').' '.($commentUser?->name ?? '').' '.($comment->unid ?? '').' '.($comment->guid ?? ''))) }}" style="margin-left: {{ min((int) $level, 4) * 1.25 }}rem">
|
||||||
<summary class="flex cursor-pointer list-none items-start gap-3 rounded-2xl p-4 marker:hidden">
|
<summary class="flex cursor-pointer list-none items-start gap-3 rounded-2xl p-4 marker:hidden">
|
||||||
<span class="mt-1 inline-flex h-12 w-2 shrink-0 rounded-full {{ $railClass }}" aria-hidden="true"></span>
|
<span class="mt-1 inline-flex h-12 w-2 shrink-0 rounded-full {{ $railClass }}" aria-hidden="true"></span>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user