fix:#3 linted formatted

This commit is contained in:
Elmar Kresse
2024-07-24 10:54:20 +02:00
parent 60f8b06f84
commit c15dbfeebb
21 changed files with 4190 additions and 1123 deletions

View File

@ -478,7 +478,8 @@ $highlightFocusBg: rgba($primaryColor, 0.24) !default;
}
}
.fc-event-selected::after, .fc-event:focus::after {
.fc-event-selected::after,
.fc-event:focus::after {
background: var(--fc-event-selected-overlay-color);
inset: -1px;
content: "";

View File

@ -488,7 +488,8 @@ $highlightFocusBg: rgba($primaryColor, 0.24) !default;
}
}
.fc-event-selected::after, .fc-event:focus::after {
.fc-event-selected::after,
.fc-event:focus::after {
background: var(--fc-event-selected-overlay-color);
inset: -1px;
content: "";

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -37,7 +37,7 @@ const disabledPages = [
"edit-calendar",
"rooms",
"free-rooms",
"room-schedule"
"room-schedule",
];
const store = moduleStore();
@ -59,13 +59,18 @@ const settings = settingsStore;
const emit = defineEmits(["dark-mode-toggled"]);
onMounted(() => {
// set theme matching browser preference
settings().setDarkMode(window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches)
// set theme matching browser preference
settings().setDarkMode(
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches,
);
setTheme(settings, primeVue, emit);
window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (e) => {
settings().setDarkMode(e.matches)
setTheme(settings, primeVue, emit);
});
window
.matchMedia("(prefers-color-scheme: dark)")
.addEventListener("change", (e) => {
settings().setDarkMode(e.matches);
setTheme(settings, primeVue, emit);
});
});
</script>

View File

@ -16,7 +16,26 @@
import { BSON } from "bson";
import { RoomOccupancyList } from "@/model/roomOccupancyList.ts";
import { Duration, NormalizedInterval, add, addDays, addMinutes, addMonths, clamp, differenceInMinutes, eachDayOfInterval, endOfDay, interval, isAfter, isBefore, isEqual, max, min, startOfDay, subDays } from "date-fns";
import {
Duration,
NormalizedInterval,
add,
addDays,
addMinutes,
addMonths,
clamp,
differenceInMinutes,
eachDayOfInterval,
endOfDay,
interval,
isAfter,
isBefore,
isEqual,
max,
min,
startOfDay,
subDays,
} from "date-fns";
import { formatYearMonthDay } from "@/helpers/dates";
const END_OF_SUMMER_SEMESTER = "0930";
@ -49,7 +68,7 @@ export function isAfterSummer(date: Date): boolean {
*/
export function getSemesterStart(date: Date): Date {
if (isBeforeSummer(date)) {
return new Date(date.getFullYear()-1, 9, 1);
return new Date(date.getFullYear() - 1, 9, 1);
} else if (isAfterSummer(date)) {
return new Date(date.getFullYear(), 9, 1);
} else {
@ -66,7 +85,7 @@ export function getSemesterStart(date: Date): Date {
export async function fetchRoomOccupancy(
from_date?: string,
to_date?: string
to_date?: string,
): Promise<RoomOccupancyList> {
if (from_date == undefined) {
let new_from_date = getSemesterStart(new Date());

View File

@ -71,7 +71,6 @@ const toggle = (info: EventClickArg) => {
}
};
const selectedToken = computed(() => {
return props.token;
});
@ -79,7 +78,7 @@ const selectedToken = computed(() => {
const mobilePage = inject("mobilePage") as Ref<boolean>;
const date: Ref<Date> = ref(new Date());
const { data: calendar} = useQuery({
const { data: calendar } = useQuery({
queryKey: ["userCalendar", selectedToken],
queryFn: () => fetchICalendarEvents(selectedToken.value),
select: (data) => {
@ -89,7 +88,7 @@ const { data: calendar} = useQuery({
refetchOnWindowFocus: "always",
refetchOnReconnect: "always",
networkMode: "offlineFirst",
enabled: () => tokenStore().token !== ""
enabled: () => tokenStore().token !== "",
});
const queryClient = useQueryClient();
@ -97,13 +96,13 @@ const queryClient = useQueryClient();
const invalidateAndRefetchCalendar = () => {
console.debug("invalidateAndRefetchCalendar", selectedToken);
const queryKey = ["userCalendar", selectedToken];
queryClient.invalidateQueries({queryKey: queryKey}).then(() => {
queryClient.refetchQueries({queryKey: queryKey});
queryClient.invalidateQueries({ queryKey: queryKey }).then(() => {
queryClient.refetchQueries({ queryKey: queryKey });
});
};
defineExpose({
invalidateAndRefetchCalendar
invalidateAndRefetchCalendar,
});
const events = computed(() => {

View File

@ -29,7 +29,6 @@ const emit = defineEmits(["dark-mode-toggled"]);
const store = settingsStore;
const isDark = computed(() => store().isDark);
</script>
<template>

View File

@ -20,10 +20,15 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
import { computed, ComputedRef, ref } from "vue";
import settingsStore from "../store/settingsStore.ts";
const pageOptions: ComputedRef<(string | {
label: string;
value: string;
})[]> = computed(() => [...settingsStore().getDefaultPageOptions()]);
const pageOptions: ComputedRef<
(
| string
| {
label: string;
value: string;
}
)[]
> = computed(() => [...settingsStore().getDefaultPageOptions()]);
const selectedPage = ref(settingsStore().defaultPage);

View File

@ -21,8 +21,6 @@ import { computed } from "vue";
import { useI18n } from "vue-i18n";
const { t } = useI18n({ useScope: "global" });
const items = computed(() => [
{
label: t("calendar"),
@ -133,7 +131,15 @@ const items = computed(() => [
<div class="flex align-items-stretch justify-content-center">
<!-- Settings Button with Gear Icon -->
<router-link v-slot="{ navigate }" :to="`/settings`" custom>
<Button icon="pi pi-cog" severity="secondary" rounded text size="large" aria-label="Settings" @click="navigate" />
<Button
icon="pi pi-cog"
severity="secondary"
rounded
text
size="large"
aria-label="Settings"
@click="navigate"
/>
</router-link>
</div>
</template>

View File

@ -92,9 +92,8 @@ function transformData(data: RoomOccupancyList) {
}
const { data: occupancy } = useQuery({
queryKey: ["roomOccupancy"],//, selectedRoom, currentDateFrom, currentDateTo],
queryFn: () =>
fetchRoomOccupancy(),
queryKey: ["roomOccupancy"], //, selectedRoom, currentDateFrom, currentDateTo],
queryFn: () => fetchRoomOccupancy(),
staleTime: 12 * 3600000, // 12 hours
});
@ -192,9 +191,7 @@ const calendarOptions: ComputedRef<CalendarOptions> = computed(() => ({
color: event.event.free
? "var(--htwk-gruen-500)"
: "var(--htwk-grau-60-500)",
textColor: event.event.free
? "var(--green-50)"
: "white",
textColor: event.event.free ? "var(--green-50)" : "white",
title: event.event.stub
? t("roomFinderPage.stub")
: event.event.free

View File

@ -41,10 +41,13 @@ export function parseICalData(
const jCalData = ICAL.parse(icalData);
const comp = new ICAL.Component(jCalData);
const vEvents = comp.getAllSubcomponents("vevent");
const events: CalendarComponent[] = vEvents.map((vevent: CalendarComponent) => {
return new ICAL.Event(vevent);
});
const colorDistinctionEvents: ColorDistinctionEvent[] = extractedColorizedEvents(events);
const events: CalendarComponent[] = vEvents.map(
(vevent: CalendarComponent) => {
return new ICAL.Event(vevent);
},
);
const colorDistinctionEvents: ColorDistinctionEvent[] =
extractedColorizedEvents(events);
return vEvents.map((vevent: CalendarComponent) => {
const event = new ICAL.Event(vevent);

View File

@ -20,27 +20,27 @@ import { EmitFn } from "primevue/ts-helpers";
import settingsStore from "@/store/settingsStore.ts";
const darkTheme = ref("lara-dark-blue"),
lightTheme = ref("lara-light-blue");
lightTheme = ref("lara-light-blue");
export type SettingsStore = typeof settingsStore;
export function toggleTheme(
store: SettingsStore,
primeVue: { changeTheme: PrimeVueChangeTheme },
emit: EmitFn<"dark-mode-toggled"[]>,
store: SettingsStore,
primeVue: { changeTheme: PrimeVueChangeTheme },
emit: EmitFn<"dark-mode-toggled"[]>,
): void {
store().setDarkMode(!store().isDark);
setTheme(store, primeVue, emit);
store().setDarkMode(!store().isDark);
setTheme(store, primeVue, emit);
}
export function setTheme(
store: SettingsStore,
{ changeTheme }: { changeTheme: PrimeVueChangeTheme },
emit: EmitFn<"dark-mode-toggled"[]>
store: SettingsStore,
{ changeTheme }: { changeTheme: PrimeVueChangeTheme },
emit: EmitFn<"dark-mode-toggled"[]>,
) {
const isDark = ref(store().isDark);
const newTheme = isDark.value ? darkTheme.value : lightTheme.value,
oldTheme = isDark.value ? lightTheme.value : darkTheme.value;
changeTheme(oldTheme, newTheme, "theme-link", () => { });
emit("dark-mode-toggled", isDark.value);
const isDark = ref(store().isDark);
const newTheme = isDark.value ? darkTheme.value : lightTheme.value,
oldTheme = isDark.value ? lightTheme.value : darkTheme.value;
changeTheme(oldTheme, newTheme, "theme-link", () => {});
emit("dark-mode-toggled", isDark.value);
}

View File

@ -70,10 +70,10 @@ app.use(VueQueryPlugin, {
queryClientConfig: {
defaultOptions: {
queries: {
refetchOnWindowFocus: false
}
}
}
refetchOnWindowFocus: false,
},
},
},
});
app.use(PrimeVue);

View File

@ -93,16 +93,22 @@ export class RoomOccupancyList {
const roomOccupancy = this.rooms.find((r) => r.name === room);
// Get start and end of decoded time range (within encoded list and requested range)
let decodeInterval = interval(clamp(from, this.getOccupancyInterval()), clamp(to, this.getOccupancyInterval()));
let decodeInterval = interval(
clamp(from, this.getOccupancyInterval()),
clamp(to, this.getOccupancyInterval()),
);
// if the room is not in the list or the time range is empty, return stub events
if (roomOccupancy === undefined || isEqual(decodeInterval.start, decodeInterval.end)) {
if (
roomOccupancy === undefined ||
isEqual(decodeInterval.start, decodeInterval.end)
) {
return RoomOccupancyList.generateStubEvents(room, from, to);
}
const occupancyList = [];
let {decodeSliceStart, decodeSlice} = this.sliceOccupancy(
let { decodeSliceStart, decodeSlice } = this.sliceOccupancy(
decodeInterval,
roomOccupancy.occupancy.buffer,
);

View File

@ -35,7 +35,6 @@ const NotFound = () => import("../view/NotFound.vue");
import i18n from "../i18n";
import settingsStore from "@/store/settingsStore.ts";
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
routes: [

View File

@ -23,7 +23,10 @@ const settingsStore = defineStore("settingsStore", {
return {
locale: useLocalStorage("locale", "en"), //useLocalStorage takes in a key of 'count' and default value of 0
isDark: true,
defaultPage: useLocalStorage("defaultPage", {label: "Home", value: "/home"}),
defaultPage: useLocalStorage("defaultPage", {
label: "Home",
value: "/home",
}),
};
},
actions: {
@ -36,10 +39,7 @@ const settingsStore = defineStore("settingsStore", {
getDarkMode(): boolean {
return this.isDark;
},
setDefaultPage(page: {
label: string;
value: string;
}) {
setDefaultPage(page: { label: string; value: string }) {
this.defaultPage = page;
},
getDefaultPageOptions(): {
@ -58,10 +58,10 @@ const settingsStore = defineStore("settingsStore", {
label: route.name,
value: route.path,
});
}
}
});
return options;
}
});
return options;
},
},
});

View File

@ -11,6 +11,4 @@ import DynamicPage from "@/view/DynamicPage.vue";
</DynamicPage>
</template>
<style scoped>
</style>
<style scoped></style>

View File

@ -1,5 +1,4 @@
<script lang="ts" setup>
import LocaleSwitcher from "@/components/LocaleSwitcher.vue";
import { ref } from "vue";
import DarkModeSwitcher from "@/components/DarkModeSwitcher.vue";
@ -14,7 +13,6 @@ function handleDarkModeToggled(isDarkVar: boolean) {
// Assuming the root component has an isDark ref
isDark.value = isDarkVar;
}
</script>
<template>
@ -34,7 +32,7 @@ function handleDarkModeToggled(isDarkVar: boolean) {
<slot flex-specs="flex-1 m-0" name="selection"></slot>
</div>
<div
class="opacity-100 transition-all transition-duration-500 transition-ease-in-out w-full lg:w-8"
class="opacity-100 transition-all transition-duration-500 transition-ease-in-out w-full lg:w-8"
>
<div class="flex flex-column justify-content-center">
<div class="grid my-2">
@ -68,11 +66,9 @@ class="opacity-100 transition-all transition-duration-500 transition-ease-in-out
</div>
</template>
<style scoped>
.col {
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@ -42,12 +42,12 @@ function loadCalendar() {
calendarViewerRef.value?.invalidateAndRefetchCalendar();
toast.add({
severity: "success",
summary: t("editCalendarView.toast.success"),
detail: t("editCalendarView.toast.successDetailLoad"),
life: 3000,
});
toast.add({
severity: "success",
summary: t("editCalendarView.toast.success"),
detail: t("editCalendarView.toast.successDetailLoad"),
life: 3000,
});
}
onMounted(() => {
@ -77,7 +77,7 @@ onMounted(() => {
></Button>
</template>
<template #content>
<CalendarViewer :token="tokenStore().token" ref="calendarViewerRef" />
<CalendarViewer ref="calendarViewerRef" :token="tokenStore().token" />
</template>
</DynamicPage>
</template>

View File

@ -40,18 +40,18 @@ export default defineConfig({
start_url: "/",
id: "de.htwk-leipzig.htwkalender",
screenshots: [
{
src: "/1280x720.png",
sizes: "1280x720",
form_factor: "wide",
type: "image/png",
},
{
src: "/390x844.png",
sizes: "1170x2532",
form_factor: "narrow",
type: "image/png",
},
{
src: "/1280x720.png",
sizes: "1280x720",
form_factor: "wide",
type: "image/png",
},
{
src: "/390x844.png",
sizes: "1170x2532",
form_factor: "narrow",
type: "image/png",
},
],
icons: [
{
@ -86,11 +86,11 @@ export default defineConfig({
cleanupOutdatedCaches: true,
runtimeCaching: [
{
urlPattern: ({ url }) => url.pathname.startsWith('/api/feed'),
method: 'GET',
handler: 'NetworkFirst',
urlPattern: ({ url }) => url.pathname.startsWith("/api/feed"),
method: "GET",
handler: "NetworkFirst",
options: {
cacheName: 'calendar-feed-cache',
cacheName: "calendar-feed-cache",
expiration: {
maxAgeSeconds: 12 * 60 * 60, // 12 hours
},