Training-Report #27
@@ -118,92 +118,93 @@ onMounted(async () => {
|
|||||||
<X></X>
|
<X></X>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col mb-5 border rounded-lg bg-muted/70 p-2 my-5 py-3 px-4">
|
<div class="max-h-[70vh] overflow-auto scrollbar-themed my-5">
|
||||||
<p class="scroll-m-20 text-xl font-semibold tracking-tight">{{ focusedTrainingReport.course_name }}</p>
|
<div class="flex flex-col mb-5 border rounded-lg bg-muted/70 p-2 py-3 px-4">
|
||||||
<div class="flex gap-10">
|
<p class="scroll-m-20 text-xl font-semibold tracking-tight">{{ focusedTrainingReport.course_name }}</p>
|
||||||
<p class="text-muted-foreground">{{ focusedTrainingReport.event_date }}</p>
|
<div class="flex gap-10">
|
||||||
<p class="">Created by {{ focusedTrainingReport.created_by_name === null ? "Unknown User" :
|
<p class="text-muted-foreground">{{ focusedTrainingReport.event_date }}</p>
|
||||||
focusedTrainingReport.created_by_name
|
<p class="">Created by {{ focusedTrainingReport.created_by_name === null ? "Unknown User" :
|
||||||
}}
|
focusedTrainingReport.created_by_name
|
||||||
</p>
|
}}
|
||||||
</div>
|
</p>
|
||||||
</div>
|
|
||||||
<div class="flex flex-col gap-8">
|
|
||||||
<!-- Trainers -->
|
|
||||||
<div>
|
|
||||||
<label class="scroll-m-20 text-xl font-semibold tracking-tight">Trainers</label>
|
|
||||||
<div class="grid grid-cols-4 py-2 text-sm font-medium text-muted-foreground border-b">
|
|
||||||
<span>Name</span>
|
|
||||||
<span class="">Role</span>
|
|
||||||
<span class="text-right col-span-2">Remarks</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-for="person in focusedTrainingTrainers"
|
|
||||||
class="grid grid-cols-4 py-2 items-center border-b last:border-none">
|
|
||||||
<p>{{ person.attendee_name }}</p>
|
|
||||||
<p class="">{{ person.role.name }}</p>
|
|
||||||
<p class="col-span-2 text-right px-2"
|
|
||||||
:class="person.remarks == '' ? 'text-muted-foreground' : ''">{{ person.remarks == "" ? '--'
|
|
||||||
: person.remarks }}</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- trainees -->
|
<div class="flex flex-col gap-8 ">
|
||||||
<div>
|
<!-- Trainers -->
|
||||||
<div class="flex flex-col">
|
<div>
|
||||||
<label class="scroll-m-20 text-xl font-semibold tracking-tight">Trainees</label>
|
<label class="scroll-m-20 text-xl font-semibold tracking-tight">Trainers</label>
|
||||||
<div class="grid grid-cols-5 py-2 text-sm font-medium text-muted-foreground border-b">
|
<div class="grid grid-cols-4 py-2 text-sm font-medium text-muted-foreground border-b">
|
||||||
<span>Name</span>
|
<span>Name</span>
|
||||||
<span class="">Bookwork</span>
|
<span class="">Role</span>
|
||||||
<span class="">Qual</span>
|
|
||||||
<span class="text-right col-span-2">Remarks</span>
|
<span class="text-right col-span-2">Remarks</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div v-for="person in focusedTrainingTrainers"
|
||||||
<div v-for="person in focusedTrainingTrainees"
|
class="grid grid-cols-4 py-2 items-center border-b last:border-none">
|
||||||
class="grid grid-cols-5 py-2 items-center border-b last:border-none">
|
<p>{{ person.attendee_name }}</p>
|
||||||
<p>{{ person.attendee_name }}</p>
|
<p class="">{{ person.role.name }}</p>
|
||||||
<Checkbox :disabled="!focusedTrainingReport.course.hasQual"
|
<p class="col-span-2 text-right px-2"
|
||||||
:model-value="person.passed_bookwork" class="pointer-events-none ml-5">
|
:class="person.remarks == '' ? 'text-muted-foreground' : ''">{{ person.remarks == "" ? '--'
|
||||||
</Checkbox>
|
: person.remarks }}</p>
|
||||||
<Checkbox :disabled="!focusedTrainingReport.course.hasQual"
|
|
||||||
:model-value="person.passed_qual" class="pointer-events-none ml-1">
|
|
||||||
</Checkbox>
|
|
||||||
<p class="col-span-2 text-right px-2"
|
|
||||||
:class="person.remarks == '' ? 'text-muted-foreground' : ''">{{ person.remarks == "" ? '--'
|
|
||||||
: person.remarks }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- No Shows -->
|
|
||||||
<div v-if="focusedNoShows.length != 0">
|
|
||||||
<div class="flex flex-col">
|
|
||||||
<label class="scroll-m-20 text-xl font-semibold tracking-tight">No Shows</label>
|
|
||||||
<div class="grid grid-cols-5 py-2 text-sm font-medium text-muted-foreground border-b">
|
|
||||||
<span>Name</span>
|
|
||||||
<!-- <span class="">Role</span>
|
|
||||||
<span class="">Role</span> -->
|
|
||||||
<div></div>
|
|
||||||
<div></div>
|
|
||||||
<span class="text-right col-span-2">Remarks</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-for="person in focusedNoShows"
|
<!-- trainees -->
|
||||||
class="grid grid-cols-5 py-2 items-center border-b last:border-none">
|
<div>
|
||||||
<p>{{ person.attendee_name }}</p>
|
<div class="flex flex-col">
|
||||||
<!-- <Checkbox :default-value="person.passed_bookwork ? true : false" class="pointer-events-none">
|
<label class="scroll-m-20 text-xl font-semibold tracking-tight">Trainees</label>
|
||||||
</Checkbox>
|
<div class="grid grid-cols-5 py-2 text-sm font-medium text-muted-foreground border-b">
|
||||||
<Checkbox :default-value="person.passed_qual ? true : false" class="pointer-events-none">
|
<span>Name</span>
|
||||||
</Checkbox> -->
|
<span class="">Bookwork</span>
|
||||||
<div></div>
|
<span class="">Qual</span>
|
||||||
<div></div>
|
<span class="text-right col-span-2">Remarks</span>
|
||||||
<p class="col-span-2 text-right px-2"
|
</div>
|
||||||
:class="person.remarks == '' ? 'text-muted-foreground' : ''">{{ person.remarks == "" ? '--'
|
</div>
|
||||||
: person.remarks }}</p>
|
<div v-for="person in focusedTrainingTrainees"
|
||||||
|
class="grid grid-cols-5 py-2 items-center border-b last:border-none">
|
||||||
|
<p>{{ person.attendee_name }}</p>
|
||||||
|
<Checkbox :disabled="!focusedTrainingReport.course.hasQual"
|
||||||
|
:model-value="person.passed_bookwork" class="pointer-events-none ml-5">
|
||||||
|
</Checkbox>
|
||||||
|
<Checkbox :disabled="!focusedTrainingReport.course.hasQual"
|
||||||
|
:model-value="person.passed_qual" class="pointer-events-none ml-1">
|
||||||
|
</Checkbox>
|
||||||
|
<p class="col-span-2 text-right px-2"
|
||||||
|
:class="person.remarks == '' ? 'text-muted-foreground' : ''">{{ person.remarks == "" ? '--'
|
||||||
|
: person.remarks }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- No Shows -->
|
||||||
|
<div v-if="focusedNoShows.length != 0">
|
||||||
|
<div class="flex flex-col">
|
||||||
|
<label class="scroll-m-20 text-xl font-semibold tracking-tight">No Shows</label>
|
||||||
|
<div class="grid grid-cols-5 py-2 text-sm font-medium text-muted-foreground border-b">
|
||||||
|
<span>Name</span>
|
||||||
|
<!-- <span class="">Role</span>
|
||||||
|
<span class="">Role</span> -->
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<span class="text-right col-span-2">Remarks</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-for="person in focusedNoShows"
|
||||||
|
class="grid grid-cols-5 py-2 items-center border-b last:border-none">
|
||||||
|
<p>{{ person.attendee_name }}</p>
|
||||||
|
<!-- <Checkbox :default-value="person.passed_bookwork ? true : false" class="pointer-events-none">
|
||||||
|
</Checkbox>
|
||||||
|
<Checkbox :default-value="person.passed_qual ? true : false" class="pointer-events-none">
|
||||||
|
</Checkbox> -->
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<p class="col-span-2 text-right px-2"
|
||||||
|
:class="person.remarks == '' ? 'text-muted-foreground' : ''">{{ person.remarks == "" ? '--'
|
||||||
|
: person.remarks }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label class="scroll-m-20 text-xl font-semibold tracking-tight">Remarks</label>
|
||||||
|
<p class="border bg-muted/50 px-3 py-2 rounded-lg min-h-24 my-2"
|
||||||
|
:class="focusedTrainingReport.remarks == '' ? 'text-muted-foreground' : ''"> {{
|
||||||
|
focusedTrainingReport.remarks == "" ? 'None' : focusedTrainingReport.remarks }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label class="scroll-m-20 text-xl font-semibold tracking-tight">Remarks</label>
|
|
||||||
<p class="border bg-muted/50 px-3 py-2 rounded-lg min-h-24 my-2"
|
|
||||||
:class="focusedTrainingReport.remarks == '' ? 'text-muted-foreground' : ''"> {{
|
|
||||||
focusedTrainingReport.remarks == "" ? 'None' : focusedTrainingReport.remarks }}</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user