52 lines
1.6 KiB
Vue
52 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { Link } from '@inertiajs/vue3';
|
|
import { Badge } from '@/components/ui/badge';
|
|
import { show as showTicket } from '@/routes/projects/tickets';
|
|
import type { TicketTreeNodeModel } from '@/types/models/ticket-tree-node-model';
|
|
|
|
defineProps<{
|
|
nodes: TicketTreeNodeModel[];
|
|
projectId: number;
|
|
}>();
|
|
</script>
|
|
|
|
<template>
|
|
<ul class="space-y-3">
|
|
<li v-for="node in nodes" :key="node.id">
|
|
<div class="border-border rounded-xl border px-4 py-4">
|
|
<div class="flex flex-wrap items-center gap-2">
|
|
<Link
|
|
:href="
|
|
showTicket({
|
|
project: projectId,
|
|
ticket: node.id,
|
|
})
|
|
"
|
|
class="text-foreground hover:text-primary font-medium transition"
|
|
>
|
|
{{ node.ticket_key }}
|
|
</Link>
|
|
|
|
<Badge v-if="node.ticket_type_name" variant="secondary">
|
|
{{ node.ticket_type_name }}
|
|
</Badge>
|
|
</div>
|
|
|
|
<div class="text-foreground mt-2 text-sm">
|
|
{{ node.title }}
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
v-if="node.children.length > 0"
|
|
class="border-border mt-3 border-l pl-4"
|
|
>
|
|
<TicketTreeList
|
|
:nodes="node.children"
|
|
:project-id="projectId"
|
|
/>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</template>
|