generated from Flycro/laravel-nuxt
32 lines
1.0 KiB
Vue
32 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
import BookInfoCard from '~/components/dashboard/BookInfoCard.vue'
|
|
|
|
definePageMeta({ middleware: ['auth'] })
|
|
|
|
const bookRecommendationStore = useBookRecommendationStore()
|
|
const authStore = useAuthStore()
|
|
const { $echo } = useNuxtApp()
|
|
|
|
bookRecommendationStore.fetchActiveRecommendations()
|
|
|
|
onMounted(() => {
|
|
$echo.private(`BookRecommendation`)
|
|
.listen('.BookRecommendationUpdated', (e) => {
|
|
bookRecommendationStore.updateRecommendationWS(e.bookRecommendation)
|
|
})
|
|
.listen('.BookRecommendationDeleted', (e) => {
|
|
bookRecommendationStore.deleteRecommendationWS(e.bookRecommendation)
|
|
})
|
|
.listen('.BookRecommendationCreated', (e) => {
|
|
bookRecommendationStore.createRecommendationWS(e.bookRecommendation)
|
|
})
|
|
authStore.socketId = $echo.socketId()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="bookRecommendationStore.fetchActiveRecommendationsStatus !== 'pending'">
|
|
<BookInfoCard v-for="book in bookRecommendationStore.recommendations" :key="book.id" :book="book" />
|
|
</div>
|
|
</template>
|