eduvia/lms
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: instructors in courses and batches

Browse Source
This commit is contained in:
Jannat Patel
2024-06-25 18:43:28 +05:30
parent 8625ac048a
commit 96028c9f42
12 changed files with 449 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
frontend/src/components/BatchCard.vue
View File

@@ -1,6 +1,6 @@
<template>
<div
class="flex flex-col border border-gray-200 rounded-md p-4 h-full"
class="flex flex-col shadow hover:bg-gray-100 rounded-md p-4 h-full"
style="min-height: 150px"
>
<Badge
@@ -8,7 +8,9 @@
theme="green"
class="self-start mb-2"
>
{{ batch.seats_left }} <span v-if="batch.seats_left > 1">{{ __('Seats Left') }}</span><span v-else-if="batch.seats_left == 1">{{ __('Seat Left') }}</span>
{{ batch.seats_left }}
<span v-if="batch.seats_left > 1">{{ __('Seats Left') }}</span
><span v-else-if="batch.seats_left == 1">{{ __('Seat Left') }}</span>
</Badge>
<Badge
v-else-if="batch.seat_count && batch.seats_left <= 0"
@@ -23,11 +25,11 @@
<div class="short-introduction">
{{ batch.description }}
</div>
<div class="mt-auto">
<div v-if="batch.amount" class="font-semibold text-lg mb-4">
<div class="flex flex-col space-y-2 mt-auto">
<div v-if="batch.amount" class="font-semibold text-lg">
{{ batch.price }}
</div>
<div class="flex items-center mb-3">
<div class="flex items-center">
<BookOpen class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" />
<span> {{ batch.courses.length }} {{ __('Courses') }} </span>
</div>
@@ -36,7 +38,7 @@
:endDate="batch.end_date"
class="mb-3"
/>
<div class="flex items-center mb-3">
<div class="flex items-center">
<Clock class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" />
<span>
{{ formatTime(batch.start_time) }} - {{ formatTime(batch.end_time) }}
@@ -48,6 +50,18 @@
{{ batch.timezone }}
</span>
</div>
<div v-if="batch.instructors.length" class="flex avatar-group overlap">
<div
class="mr-1"
:class="{ 'avatar-group overlap': batch.instructors.length > 1 }"
>
<UserAvatar
v-for="instructor in batch.instructors"
:user="instructor"
/>
</div>
<CourseInstructors :instructors="batch.instructors" />
</div>
</div>
</div>
</template>
@@ -56,6 +70,8 @@ import { Badge } from 'frappe-ui'
import { formatTime } from '../utils'
import { Clock, BookOpen, Globe } from 'lucide-vue-next'
import DateRange from '@/components/Common/DateRange.vue'
import CourseInstructors from '@/components/CourseInstructors.vue'
import UserAvatar from '@/components/UserAvatar.vue'
const props = defineProps({
batch: {
@@ -75,4 +91,17 @@ const props = defineProps({
margin: 0.25rem 0 1.25rem;
line-height: 1.5;
}
.avatar-group {
display: inline-flex;
align-items: center;
}
.avatar-group .avatar {
transition: margin 0.1s ease-in-out;
}
.avatar-group.overlap .avatar + .avatar {
margin-left: calc(-8px);
}
</style>