Hornwitser
0083696343
The missing scoped attribute cause h2 headers to no longer have the expected top margin. Fix by adding the intended scope attribute.
68 lines
1.4 KiB
Vue
68 lines
1.4 KiB
Vue
<!--
|
|
SPDX-FileCopyrightText: © 2025 Hornwitser <code@hornwitser.no>
|
|
SPDX-License-Identifier: AGPL-3.0-or-later
|
|
-->
|
|
<template>
|
|
<div>
|
|
<h2>Changes</h2>
|
|
<section v-if="locations.length">
|
|
<h3>Locations</h3>
|
|
<DiffScheduleLocation
|
|
v-for="location in locations"
|
|
:key="location.id"
|
|
:location
|
|
/>
|
|
</section>
|
|
<section v-if="events.length">
|
|
<h3>Events</h3>
|
|
<DiffScheduleEvent
|
|
v-for="event in events"
|
|
:key="event.id"
|
|
:event
|
|
:schedule
|
|
/>
|
|
</section>
|
|
<section v-if="roles.length">
|
|
<h3>Roles</h3>
|
|
<DiffScheduleRole
|
|
v-for="role in roles"
|
|
:key="role.id"
|
|
:role
|
|
/>
|
|
</section>
|
|
<section v-if="shifts.length">
|
|
<h3>Shifts</h3>
|
|
<DiffScheduleShift
|
|
v-for="shift in shifts"
|
|
:key="shift.id"
|
|
:shift
|
|
:schedule
|
|
/>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
const props = defineProps<{
|
|
schedule: ClientSchedule
|
|
}>();
|
|
|
|
const locations = computed(() => {
|
|
return [...props.schedule.locations.values()].filter(location => location.isModified());
|
|
});
|
|
const events = computed(() => {
|
|
return [...props.schedule.events.values()].filter(event => event.isModified());
|
|
});
|
|
const roles = computed(() => {
|
|
return [...props.schedule.roles.values()].filter(role => role.isModified());
|
|
});
|
|
const shifts = computed(() => {
|
|
return [...props.schedule.shifts.values()].filter(shift => shift.isModified());
|
|
});
|
|
</script>
|
|
|
|
<style scoped>
|
|
h2 {
|
|
margin-block-start: 0.2rem;
|
|
}
|
|
</style>
|