40 lines
1.1 KiB
Vue
40 lines
1.1 KiB
Vue
<script setup>
|
|
import AvatarsGroup from "components/avatars/AvatarsGroup.vue";
|
|
|
|
const props = defineProps({
|
|
items: {
|
|
type: Array,
|
|
required: true
|
|
},
|
|
routeDetail: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const getCoverPhotos = (item) => item.flights.filter(f => !!f.titlePhoto).map(f => f.titlePhoto.thumbnailUrl);
|
|
</script>
|
|
|
|
<template>
|
|
<q-list bordered separator>
|
|
<q-item
|
|
v-for="eventDetail of items" :key="eventDetail"
|
|
clickable
|
|
:to="{name: props.routeDetail.name, params: {...props.routeDetail.params, eventSlug: eventDetail.urlSlug, id: eventDetail.id}}"
|
|
v-ripple
|
|
>
|
|
<q-item-section>
|
|
<q-item-label>
|
|
<q-avatar icon="event" color="primary" text-color="white" v-if="!eventDetail.flights || eventDetail.flights.length === 0"/>
|
|
<AvatarsGroup :avatars="getCoverPhotos(eventDetail)" v-else/>
|
|
|
|
{{ eventDetail.name }}
|
|
</q-item-label>
|
|
<q-item-label lines="4" caption>
|
|
<article v-html="eventDetail.description"/>
|
|
</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</template>
|