refactor: align codebase with EventCrew domain and trim legacy band stack
- Update API: events, users, policies, routes, resources, migrations - Remove deprecated models/resources (customers, setlists, invitations, etc.) - Refresh admin app and docs; remove apps/band Made-with: Cursor
This commit is contained in:
158
apps/app/src/pages/events/index.vue
Normal file
158
apps/app/src/pages/events/index.vue
Normal file
@@ -0,0 +1,158 @@
|
||||
<script setup lang="ts">
|
||||
import { useEvents } from '@/composables/useEvents'
|
||||
|
||||
const { events, pagination, organisationId, isLoading, error, fetchEvents } = useEvents()
|
||||
|
||||
const page = ref(1)
|
||||
const itemsPerPage = ref(10)
|
||||
|
||||
watch([page, itemsPerPage, organisationId], () => {
|
||||
if (!organisationId.value) {
|
||||
return
|
||||
}
|
||||
fetchEvents({
|
||||
page: page.value,
|
||||
per_page: itemsPerPage.value,
|
||||
})
|
||||
}, { immediate: true })
|
||||
|
||||
function getStatusColor(status: string): string {
|
||||
const colors: Record<string, string> = {
|
||||
draft: 'secondary',
|
||||
published: 'info',
|
||||
registration_open: 'success',
|
||||
buildup: 'warning',
|
||||
showday: 'primary',
|
||||
teardown: 'warning',
|
||||
closed: 'secondary',
|
||||
}
|
||||
return colors[status] || 'secondary'
|
||||
}
|
||||
|
||||
function formatStatusLabel(status: string): string {
|
||||
return status.replaceAll('_', ' ')
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<VAlert
|
||||
v-if="!organisationId"
|
||||
type="warning"
|
||||
class="mb-4"
|
||||
>
|
||||
You need to belong to an organisation to see events. Ask an administrator to invite you.
|
||||
</VAlert>
|
||||
|
||||
<VCard>
|
||||
<VCardTitle>
|
||||
<h4 class="text-h4 mb-1">
|
||||
Events
|
||||
</h4>
|
||||
<p class="text-body-2 text-medium-emphasis">
|
||||
Events for your organisation
|
||||
</p>
|
||||
</VCardTitle>
|
||||
|
||||
<VDivider />
|
||||
|
||||
<div
|
||||
v-if="isLoading"
|
||||
class="d-flex justify-center align-center py-12"
|
||||
>
|
||||
<VProgressCircular
|
||||
indeterminate
|
||||
color="primary"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<VAlert
|
||||
v-else-if="error"
|
||||
type="error"
|
||||
class="ma-4"
|
||||
>
|
||||
{{ error.message }}
|
||||
</VAlert>
|
||||
|
||||
<div
|
||||
v-else-if="events.length > 0"
|
||||
class="pa-4"
|
||||
>
|
||||
<VRow>
|
||||
<VCol
|
||||
v-for="event in events"
|
||||
:key="event.id"
|
||||
cols="12"
|
||||
md="6"
|
||||
lg="4"
|
||||
>
|
||||
<VCard>
|
||||
<VCardTitle>
|
||||
<RouterLink
|
||||
:to="{ name: 'events-view-id', params: { id: event.id } }"
|
||||
class="text-decoration-none text-high-emphasis"
|
||||
>
|
||||
{{ event.name }}
|
||||
</RouterLink>
|
||||
</VCardTitle>
|
||||
|
||||
<VCardText>
|
||||
<div class="mb-2">
|
||||
<VChip
|
||||
:color="getStatusColor(event.status)"
|
||||
size="small"
|
||||
class="mr-2"
|
||||
>
|
||||
{{ formatStatusLabel(event.status) }}
|
||||
</VChip>
|
||||
</div>
|
||||
<div class="text-body-2">
|
||||
{{ new Date(event.start_date).toLocaleDateString() }}
|
||||
–
|
||||
{{ new Date(event.end_date).toLocaleDateString() }}
|
||||
</div>
|
||||
<div class="text-body-2 text-medium-emphasis">
|
||||
{{ event.timezone }}
|
||||
</div>
|
||||
</VCardText>
|
||||
|
||||
<VCardActions>
|
||||
<VBtn
|
||||
:to="{ name: 'events-view-id', params: { id: event.id } }"
|
||||
variant="text"
|
||||
>
|
||||
View details
|
||||
</VBtn>
|
||||
</VCardActions>
|
||||
</VCard>
|
||||
</VCol>
|
||||
</VRow>
|
||||
|
||||
<div
|
||||
v-if="pagination && pagination.last_page > 1"
|
||||
class="d-flex justify-center mt-4"
|
||||
>
|
||||
<VPagination
|
||||
v-model="page"
|
||||
:length="pagination.last_page"
|
||||
:total-visible="7"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<VCardText
|
||||
v-else
|
||||
class="text-center py-12"
|
||||
>
|
||||
<VIcon
|
||||
icon="tabler-calendar-off"
|
||||
size="64"
|
||||
class="text-medium-emphasis mb-4"
|
||||
/>
|
||||
<p class="text-h6 text-medium-emphasis">
|
||||
No events yet
|
||||
</p>
|
||||
</VCardText>
|
||||
</VCard>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user