96 lines
2.1 KiB
Vue
96 lines
2.1 KiB
Vue
<template>
|
|
<main>
|
|
<h1>Edit</h1>
|
|
<h2>Locations</h2>
|
|
<LocationsTable :edit="isAdmin" />
|
|
<h2>Schedule</h2>
|
|
<label>
|
|
Location Filter:
|
|
<select
|
|
v-model="locationFilter"
|
|
>
|
|
<option
|
|
:value="undefined"
|
|
:selected="locationFilter === undefined"
|
|
><All locations></option>
|
|
<option
|
|
v-for="location in schedule.locations"
|
|
:key="location.id"
|
|
:value="location.id"
|
|
:selected="locationFilter === location.id"
|
|
>{{ location.name }}</option>
|
|
</select>
|
|
</label>
|
|
<ScheduleTable :edit="true" :location="locationFilter" />
|
|
<h2>Events</h2>
|
|
<EventsTable :edit="true" />
|
|
<h2>Roles</h2>
|
|
<RolesTable :edit="true" />
|
|
<h2>Shift Schedule</h2>
|
|
<label>
|
|
Role Filter:
|
|
<select
|
|
v-model="roleFilter"
|
|
>
|
|
<option
|
|
:value="undefined"
|
|
:selected="roleFilter === undefined"
|
|
><All roles></option>
|
|
<option
|
|
v-for="role in schedule.roles"
|
|
:key="role.id"
|
|
:value="role.id"
|
|
:selected="roleFilter === role.id"
|
|
>{{ role.name }}</option>
|
|
</select>
|
|
</label>
|
|
<ShiftScheduleTable :edit="true" :role="roleFilter" />
|
|
<h2>Shifts</h2>
|
|
<ShiftsTable :edit="true" :role="roleFilter" />
|
|
</main>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import type { LocationQueryValue } from 'vue-router';
|
|
|
|
definePageMeta({
|
|
middleware: ["authenticated"],
|
|
allowedAccountTypes: ["crew", "admin"],
|
|
});
|
|
|
|
const schedule = await useSchedule();
|
|
|
|
function queryToString(item?: null | LocationQueryValue | LocationQueryValue[]) {
|
|
if (item === null)
|
|
return "";
|
|
if (item instanceof Array)
|
|
return queryToString(item[0])
|
|
return item;
|
|
}
|
|
|
|
const route = useRoute();
|
|
const locationFilter = computed({
|
|
get: () => queryToString(route.query.location),
|
|
set: (value: string | undefined) => navigateTo({
|
|
path: route.path,
|
|
query: {
|
|
...route.query,
|
|
location: value,
|
|
},
|
|
}),
|
|
});
|
|
|
|
const roleFilter = computed({
|
|
get: () => queryToString(route.query.role),
|
|
set: (value: string | undefined) => navigateTo({
|
|
path: route.path,
|
|
query: {
|
|
...route.query,
|
|
role: value,
|
|
},
|
|
}),
|
|
});
|
|
|
|
const { data: session } = await useAccountSession();
|
|
const isAdmin = computed(() => session.value?.account.type === "admin")
|
|
</script>
|