unify components and layout
This commit is contained in:
@@ -6,47 +6,50 @@ import (
|
||||
"github.com/LazyBachelor/LazyPM/internal/models"
|
||||
)
|
||||
|
||||
type IssueDetailCardProps struct {
|
||||
Issue models.Issue
|
||||
DisplayOwner string
|
||||
DisplayAssignee string
|
||||
type IssueDetailProps struct {
|
||||
Issue *models.Issue
|
||||
ShowDetailsButton bool
|
||||
}
|
||||
|
||||
templ IssueDetailCard(props IssueDetailCardProps) {
|
||||
<div class="card bg-base-100 shadow-sm">
|
||||
<div class="card-body p-4">
|
||||
<span class="badge badge-ghost badge-sm font-mono">{ props.Issue.ID }</span>
|
||||
<h2 class="text-lg font-bold mt-2">{ props.Issue.Title }</h2>
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
@StatusBadge(props.Issue.Status)
|
||||
@TypeBadge(props.Issue.IssueType)
|
||||
@PriorityBadge(props.Issue.Priority)
|
||||
</div>
|
||||
if props.Issue.Description != "" {
|
||||
<div class="mt-4">
|
||||
<h3 class="text-sm font-semibold opacity-70 mb-1">Description</h3>
|
||||
<p class="whitespace-pre-wrap text-sm">{ props.Issue.Description }</p>
|
||||
</div>
|
||||
}
|
||||
<div class="divider my-2"></div>
|
||||
<div class="grid grid-cols-2 gap-2 text-sm">
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Created</span>
|
||||
<p>{ props.Issue.CreatedAt.Format("Jan 2, 2006") }</p>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Updated</span>
|
||||
<p>{ props.Issue.UpdatedAt.Format("Jan 2, 2006") }</p>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Created by</span>
|
||||
<p>{ props.DisplayOwner }</p>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Assignee</span>
|
||||
<p>{ props.DisplayAssignee }</p>
|
||||
</div>
|
||||
</div>
|
||||
templ IssueDetail(props IssueDetailProps) {
|
||||
<h2 class="text-2xl font-bold m-2">
|
||||
<a
|
||||
class="hover active cursor-pointer"
|
||||
hx-get={ "/issues/" + props.Issue.ID }
|
||||
hx-target="main"
|
||||
hx-swap="innerHTML"
|
||||
>
|
||||
{ props.Issue.Title }
|
||||
</a>
|
||||
</h2>
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
@StatusBadge(props.Issue.Status)
|
||||
@TypeBadge(props.Issue.IssueType)
|
||||
@PriorityBadge(props.Issue.Priority)
|
||||
</div>
|
||||
if props.Issue.Description != "" {
|
||||
<div class="mt-4">
|
||||
<h3 class="text-sm font-semibold opacity-70 mb-1">Description</h3>
|
||||
<p class="whitespace-pre-wrap text-sm">{ props.Issue.Description }</p>
|
||||
</div>
|
||||
}
|
||||
<div class="divider my-2"></div>
|
||||
<div class="grid grid-cols-2 gap-2 text-sm">
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Created</span>
|
||||
<p>{ props.Issue.CreatedAt.Format("Jan 2, 2006") }</p>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Updated</span>
|
||||
<p>{ props.Issue.UpdatedAt.Format("Jan 2, 2006") }</p>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Created by</span>
|
||||
<p>{ props.Issue.Actor }</p>
|
||||
</div>
|
||||
<div class="bg-base-200 rounded-lg p-2">
|
||||
<span class="text-xs opacity-70 block">Assignee</span>
|
||||
<p>{ props.Issue.Assignee }</p>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user