Refactor API types and sync logic
Rename and refactor the types passed over the API to be based on an entity that's either living or a tombstone. A living entity has a deleted property that's either undefined or false, while a tombstone has a deleted property set to true. All entities have a numeric id and an updatedAt timestamp. To sync entities, an array of replacements are passed around. Living entities are replaced with tombstones when they're deleted. And tombstones are replaced with living entities when restored.
This commit is contained in:
parent
251e83f640
commit
fe06d0d6bd
36 changed files with 1242 additions and 834 deletions
|
@ -1,5 +1,11 @@
|
|||
<template>
|
||||
<main>
|
||||
<main v-if="schedule.deleted">
|
||||
<h1>Error</h1>
|
||||
<p>
|
||||
Schedule has been deleted.
|
||||
</p>
|
||||
</main>
|
||||
<main v-else>
|
||||
<h1>Edit</h1>
|
||||
<label>
|
||||
Crew Filter:
|
||||
|
@ -31,7 +37,7 @@
|
|||
:selected="locationFilter === undefined"
|
||||
><All locations></option>
|
||||
<option
|
||||
v-for="location in schedule.locations"
|
||||
v-for="location in schedule.locations?.filter(l => !l.deleted)"
|
||||
:key="location.id"
|
||||
:value="location.id"
|
||||
:selected="locationFilter === location.id"
|
||||
|
@ -54,21 +60,21 @@
|
|||
:selected="roleFilter === undefined"
|
||||
><All roles></option>
|
||||
<option
|
||||
v-for="role in schedule.roles"
|
||||
v-for="role in schedule.roles?.filter(r => !r.deleted)"
|
||||
:key="role.id"
|
||||
:value="role.id"
|
||||
:selected="roleFilter === role.id"
|
||||
>{{ role.name }}</option>
|
||||
</select>
|
||||
</label>
|
||||
<ShiftScheduleTable :edit="true" :role="roleFilter" :eventSlotFilter :shiftSlotFilter />
|
||||
<ShiftScheduleTable :edit="true" :roleId="roleFilter" :eventSlotFilter :shiftSlotFilter />
|
||||
<h2>Shifts</h2>
|
||||
<ShiftsTable :edit="true" :role="roleFilter" />
|
||||
<ShiftsTable :edit="true" :roleId="roleFilter" />
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import type { ShiftSlot, TimeSlot } from '~/shared/types/schedule';
|
||||
import type { ApiScheduleEventSlot, ApiScheduleShiftSlot } from '~/shared/types/api';
|
||||
|
||||
definePageMeta({
|
||||
middleware: ["authenticated"],
|
||||
|
@ -95,29 +101,29 @@ const eventSlotFilter = computed(() => {
|
|||
return () => true;
|
||||
}
|
||||
const cid = parseInt(crewFilter.value);
|
||||
return (slot: TimeSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
return (slot: ApiScheduleEventSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
});
|
||||
const shiftSlotFilter = computed(() => {
|
||||
if (crewFilter.value === undefined || !accountStore.valid) {
|
||||
return () => true;
|
||||
}
|
||||
const cid = parseInt(crewFilter.value);
|
||||
return (slot: ShiftSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
return (slot: ApiScheduleShiftSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
});
|
||||
|
||||
const locationFilter = computed({
|
||||
get: () => queryToString(route.query.location),
|
||||
set: (value: string | undefined) => navigateTo({
|
||||
get: () => queryToNumber(route.query.location),
|
||||
set: (value: number | undefined) => navigateTo({
|
||||
path: route.path,
|
||||
query: {
|
||||
...route.query,
|
||||
location: value,
|
||||
location: value !== undefined ? String(value) : undefined,
|
||||
},
|
||||
}),
|
||||
});
|
||||
|
||||
const roleFilter = computed({
|
||||
get: () => queryToString(route.query.role),
|
||||
get: () => queryToNumber(route.query.role),
|
||||
set: (value: string | undefined) => navigateTo({
|
||||
path: route.path,
|
||||
query: {
|
||||
|
|
|
@ -1,5 +1,11 @@
|
|||
<template>
|
||||
<main>
|
||||
<main v-if="schedule.deleted">
|
||||
<h1>Error</h1>
|
||||
<p>
|
||||
Schedule has been deleted.
|
||||
</p>
|
||||
</main>
|
||||
<main v-else>
|
||||
<h1>Schedule & Events</h1>
|
||||
<p>
|
||||
Study carefully, we only hold these events once a year.
|
||||
|
@ -42,10 +48,10 @@
|
|||
</label>
|
||||
<Timetable :schedule :eventSlotFilter :shiftSlotFilter />
|
||||
<h2>Events</h2>
|
||||
<EventCard v-for="event in schedule.events.filter(e => e.slots.some(eventSlotFilter))" :event/>
|
||||
<EventCard v-for="event in schedule.events?.filter(e => !e.deleted && e.slots.some(eventSlotFilter))" :event/>
|
||||
<h2>Locations</h2>
|
||||
<ul>
|
||||
<li v-for="location in schedule.locations" :key="location.id">
|
||||
<li v-for="location in schedule.locations?.filter(l => !l.deleted)" :key="location.id">
|
||||
<h3>{{ location.name }}</h3>
|
||||
{{ location.description ?? "No description provided" }}
|
||||
</li>
|
||||
|
@ -54,7 +60,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { ShiftSlot, TimeSlot } from '~/shared/types/schedule';
|
||||
import type { ApiScheduleShiftSlot, ApiScheduleEventSlot } from '~/shared/types/api';
|
||||
|
||||
const accountStore = useAccountStore();
|
||||
const { data: accounts } = await useAccounts();
|
||||
|
@ -73,27 +79,27 @@ const filter = computed({
|
|||
});
|
||||
|
||||
const eventSlotFilter = computed(() => {
|
||||
if (filter.value === undefined || !accountStore.valid) {
|
||||
if (filter.value === undefined || !accountStore.valid || schedule.value.deleted) {
|
||||
return () => true;
|
||||
}
|
||||
const aid = accountStore.id;
|
||||
if (filter.value === "my-schedule") {
|
||||
const ids = new Set(accountStore.interestedIds);
|
||||
for (const event of schedule.value.events) {
|
||||
if (ids.has(event.id)) {
|
||||
const slotIds = new Set(accountStore.interestedEventSlotIds);
|
||||
for (const event of schedule.value.events ?? []) {
|
||||
if (!event.deleted && accountStore.interestedEventIds.has(event.id)) {
|
||||
for (const slot of event.slots) {
|
||||
ids.add(slot.id);
|
||||
slotIds.add(slot.id);
|
||||
}
|
||||
}
|
||||
}
|
||||
return (slot: TimeSlot) => ids.has(slot.id) || slot.assigned?.some(id => id === aid) || false;
|
||||
return (slot: ApiScheduleEventSlot) => slotIds.has(slot.id) || slot.assigned?.some(id => id === aid) || false;
|
||||
}
|
||||
if (filter.value === "assigned") {
|
||||
return (slot: TimeSlot) => slot.assigned?.some(id => id === aid) || false;
|
||||
return (slot: ApiScheduleEventSlot) => slot.assigned?.some(id => id === aid) || false;
|
||||
}
|
||||
if (filter.value.startsWith("crew-")) {
|
||||
const cid = parseInt(filter.value.slice(5));
|
||||
return (slot: TimeSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
return (slot: ApiScheduleEventSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
}
|
||||
return () => false;
|
||||
});
|
||||
|
@ -103,11 +109,11 @@ const shiftSlotFilter = computed(() => {
|
|||
}
|
||||
if (filter.value === "my-schedule" || filter.value === "assigned") {
|
||||
const aid = accountStore.id;
|
||||
return (slot: ShiftSlot) => slot.assigned?.some(id => id === aid) || false;
|
||||
return (slot: ApiScheduleShiftSlot) => slot.assigned?.some(id => id === aid) || false;
|
||||
}
|
||||
if (filter.value.startsWith("crew-")) {
|
||||
const cid = parseInt(filter.value.slice(5));
|
||||
return (slot: ShiftSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
return (slot: ApiScheduleShiftSlot) => slot.assigned?.some(id => id === cid) || false;
|
||||
}
|
||||
return () => false;
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue