feat: добавил ограничение записи на лекции

frontend/src/components/ui/LectureCard.vue

@@ -1,7 +1,10 @@
 <script setup lang="ts">
 import type { Lecture } from '@/types'
+import { computed, ref } from 'vue'
 import { useRouter } from 'vue-router'
+import { useUserStore } from '@/stores/user'
 import AppIcon from '@/components/ui/AppIcon.vue'
+import EnrollmentLimitModal from '@/components/ui/EnrollmentLimitModal.vue'
 
 const props = defineProps<{
   lecture: Lecture
@@ -10,6 +13,11 @@ const props = defineProps<{
 }>()
 const emit = defineEmits<{ register: [id: string] }>()
 const router = useRouter()
+const userStore = useUserStore()
+const enrollmentLimitModalOpen = ref(false)
+const isRegistrationLimitReached = computed(() =>
+  !props.registered && !userStore.hasEnrollmentSlotAvailable
+)
 
 function formatDate(d: string) {
   const date = new Date(d)
@@ -24,6 +32,15 @@ function starsHtml(rating: number) {
 function goDetail() {
   router.push(`/lecture/${props.lecture.id}`)
 }
+
+function register() {
+  if (isRegistrationLimitReached.value) {
+    enrollmentLimitModalOpen.value = true
+    return
+  }
+
+  emit('register', props.lecture.id)
+}
 </script>
 
 <template>
@@ -98,7 +115,7 @@ function goDetail() {
       <button
         v-else-if="lecture.freeSeats > 0 && !lecture.registrationClosed"
         class="btn-primary btn-sm"
-        @click.stop="emit('register', lecture.id)"
+        @click.stop="register"
       >
         Записаться
       </button>
@@ -106,6 +123,7 @@ function goDetail() {
         {{ lecture.registrationClosed ? 'Запись закрыта' : 'Мест нет' }}
       </button>
     </div>
+    <EnrollmentLimitModal v-model="enrollmentLimitModalOpen" />
   </div>
 </template>