105 lines
2.6 KiB
Vue
105 lines
2.6 KiB
Vue
<!--
|
|
SPDX-FileCopyrightText: © 2025 Hornwitser <code@hornwitser.no>
|
|
SPDX-License-Identifier: AGPL-3.0-or-later
|
|
-->
|
|
<template>
|
|
<div>
|
|
<h4>{{ state }} {{ event.name }}</h4>
|
|
<DiffFieldString
|
|
title="Name"
|
|
:before="event.serverName"
|
|
:after="event.name"
|
|
:state
|
|
/>
|
|
<DiffFieldString
|
|
title="Host"
|
|
:before="event.serverHost"
|
|
:after="event.host"
|
|
:state
|
|
/>
|
|
<DiffFieldString
|
|
title="Public"
|
|
:before='event.serverCrew ? "No" : "Yes"'
|
|
:after='event.crew ? "No" : "Yes"'
|
|
:state
|
|
/>
|
|
<DiffFieldString
|
|
title="Description"
|
|
:before="event.serverDescription"
|
|
:after="event.description"
|
|
:state
|
|
/>
|
|
<DiffScheduleEventSlot
|
|
v-for="[state, slot] in slots"
|
|
:key="slot.id"
|
|
:slot
|
|
:schedule
|
|
:state
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
const props = defineProps<{
|
|
event: ClientScheduleEvent,
|
|
schedule: ClientSchedule,
|
|
}>();
|
|
const state = computed(() => {
|
|
if (props.event.deleted) return "deleted";
|
|
if (props.event.isNew()) return "created";
|
|
return "modified";
|
|
});
|
|
const slots = computed((): [
|
|
"deleted" | "created" | "modified", ClientScheduleEventSlot
|
|
][] => {
|
|
const afterIds = props.event.slotIds;
|
|
const beforeIds = props.event.serverSlotIds;
|
|
if (state.value === "deleted") {
|
|
return (
|
|
[...beforeIds]
|
|
.map(id => props.schedule.eventSlots.get(id))
|
|
.filter(slot => slot !== undefined)
|
|
.map(slot => ["deleted", slot] as ["deleted", ClientScheduleEventSlot])
|
|
);
|
|
}
|
|
if (state.value === "created") {
|
|
return (
|
|
[...afterIds]
|
|
.map(id => props.schedule.eventSlots.get(id))
|
|
.filter(slot => slot !== undefined)
|
|
.map(slot => ["created", slot] as ["created", ClientScheduleEventSlot])
|
|
);
|
|
}
|
|
const added = [...toRaw(afterIds).difference(beforeIds)]
|
|
.map(id => props.schedule.eventSlots.get(id))
|
|
.filter(slot => slot !== undefined)
|
|
.filter(slot => !slot.deleted)
|
|
.map(slot => ["created", slot] as ["created", ClientScheduleEventSlot])
|
|
;
|
|
const removed = [...new Set(
|
|
[...toRaw(beforeIds).difference(afterIds)]
|
|
.map(id => props.schedule.eventSlots.get(id))
|
|
.filter(slot => slot !== undefined)
|
|
).union(
|
|
new Set(
|
|
[...afterIds]
|
|
.map(id => props.schedule.eventSlots.get(id))
|
|
.filter(slot => slot !== undefined)
|
|
.filter(slot => slot.deleted)
|
|
)
|
|
)]
|
|
.map(slot => ["deleted", slot] as ["deleted", ClientScheduleEventSlot])
|
|
;
|
|
const modified = [...toRaw(afterIds).intersection(beforeIds)]
|
|
.map(id => props.schedule.eventSlots.get(id))
|
|
.filter(slot => slot !== undefined)
|
|
.filter(slot => slot.isModified() && !slot.deleted)
|
|
.map(slot => ["modified", slot] as ["modified", ClientScheduleEventSlot])
|
|
;
|
|
return [
|
|
...added,
|
|
...removed,
|
|
...modified,
|
|
];
|
|
});
|
|
</script>
|