Merge branch 'develop' into feature/remove-svg-rect

This commit is contained in:
Jörn-Michael Miehe 2023-11-04 16:13:15 +00:00
commit 0eeaaef4bf
7 changed files with 47 additions and 29 deletions

View file

@ -9,7 +9,7 @@
</head> </head>
<body> <body>
<noscript> <noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> <strong>Es tut uns leid, aber <%= htmlWebpackPlugin.options.title %> funktioniert nicht richtig ohne JavaScript. Bitte aktivieren Sie es, um fortzufahren.</strong>
</noscript> </noscript>
<div id="app"></div> <div id="app"></div>
<!-- built files will be auto injected --> <!-- built files will be auto injected -->

View file

@ -51,10 +51,6 @@ import UserView from "./components/UserView.vue";
}) })
export default class extends Vue { export default class extends Vue {
public readonly store = advent22Store(); public readonly store = advent22Store();
public mounted(): void {
this.store.init();
}
} }
</script> </script>

View file

@ -1,11 +1,19 @@
<template> <template>
<Calendar :doors="doors" /> <template v-if="store.user_doors.length > 0">
<hr /> <Calendar :doors="doors" />
<div class="content" v-html="store.site_config.content" /> <hr />
<div class="content has-text-primary" v-if="store.next_door_target !== null"> <div class="content" v-html="store.site_config.content" />
Zeit bis zum nächsten Türchen: <div class="content has-text-primary">
<CountDown :until="store.next_door_target" /> <template v-if="store.next_door_target === null">
</div> Alle {{ store.user_doors.length }} Türchen offen!
</template>
<template v-else>
{{ store.user_doors.length }} Türchen offen. Zeit bis zum nächsten
Türchen:
<CountDown :until="store.next_door_target" />
</template>
</div>
</template>
</template> </template>
<script lang="ts"> <script lang="ts">

View file

@ -1,5 +1,6 @@
import { Advent22Plugin } from "@/plugins/advent22"; import { Advent22Plugin } from "@/plugins/advent22";
import { FontAwesomePlugin } from "@/plugins/fontawesome"; import { FontAwesomePlugin } from "@/plugins/fontawesome";
import { advent22Store } from "@/plugins/store";
import { createPinia } from "pinia"; import { createPinia } from "pinia";
import { createApp } from "vue"; import { createApp } from "vue";
import App from "./App.vue"; import App from "./App.vue";
@ -11,4 +12,7 @@ app.use(Advent22Plugin);
app.use(FontAwesomePlugin); app.use(FontAwesomePlugin);
app.use(createPinia()); app.use(createPinia());
const store = advent22Store();
store.init(app.config.globalProperties.$advent22);
app.mount("#app"); app.mount("#app");

View file

@ -156,10 +156,8 @@ export class Advent22 {
} }
} }
export const ADVENT22 = new Advent22();
export const Advent22Plugin: Plugin = { export const Advent22Plugin: Plugin = {
install(app: App) { install(app: App) {
app.config.globalProperties.$advent22 = ADVENT22; app.config.globalProperties.$advent22 = new Advent22();
}, },
}; };

View file

@ -1,5 +1,5 @@
import { Credentials, DoorsSaved, SiteConfigModel } from "@/lib/api"; import { Credentials, DoorsSaved, SiteConfigModel } from "@/lib/api";
import { ADVENT22 } from "@/plugins/advent22"; import { Advent22 } from "@/plugins/advent22";
import { AxiosBasicCredentials } from "axios"; import { AxiosBasicCredentials } from "axios";
import { acceptHMRUpdate, defineStore } from "pinia"; import { acceptHMRUpdate, defineStore } from "pinia";
@ -10,12 +10,13 @@ export const advent22Store = defineStore({
id: "advent22", id: "advent22",
state: () => ({ state: () => ({
advent22: {} as Advent22,
api_creds: empty_creds(), api_creds: empty_creds(),
is_touch_device: check_touch_device(), is_touch_device: check_touch_device(),
is_admin: false, is_admin: false,
site_config: { site_config: {
title: "Adventskalender", title: document.title,
subtitle: "Lorem Ipsum", subtitle: "",
content: "", content: "",
footer: "", footer: "",
} as SiteConfigModel, } as SiteConfigModel,
@ -31,8 +32,11 @@ export const advent22Store = defineStore({
}, },
actions: { actions: {
init(): void { init(advent22: Advent22): void {
ADVENT22.api_get_blob("user/favicon") this.advent22 = advent22;
advent22
.api_get_blob("user/favicon")
.then((favicon_src) => { .then((favicon_src) => {
const link: HTMLLinkElement = const link: HTMLLinkElement =
document.querySelector("link[rel*='icon']") || document.querySelector("link[rel*='icon']") ||
@ -47,9 +51,9 @@ export const advent22Store = defineStore({
.catch(() => {}); .catch(() => {});
Promise.all([ Promise.all([
ADVENT22.api_get<SiteConfigModel>("user/site_config"), advent22.api_get<SiteConfigModel>("user/site_config"),
ADVENT22.api_get<DoorsSaved>("user/doors"), advent22.api_get<DoorsSaved>("user/doors"),
ADVENT22.api_get<number | null>("user/next_door"), advent22.api_get<number | null>("user/next_door"),
]) ])
.then(([site_config, user_doors, next_door]) => { .then(([site_config, user_doors, next_door]) => {
document.title = site_config.title; document.title = site_config.title;
@ -63,14 +67,15 @@ export const advent22Store = defineStore({
if (next_door !== null) if (next_door !== null)
this.next_door_target = Date.now() + next_door; this.next_door_target = Date.now() + next_door;
}) })
.catch(ADVENT22.alert_user_error); .catch(advent22.alert_user_error);
}, },
login(creds: Credentials = empty_creds()): Promise<boolean> { login(creds: Credentials = empty_creds()): Promise<boolean> {
this.api_creds = creds; this.api_creds = creds;
return new Promise<boolean>((resolve, reject) => { return new Promise<boolean>((resolve, reject) => {
ADVENT22.api_get<boolean>("admin/is_admin") this.advent22
.api_get<boolean>("admin/is_admin")
.then((is_admin) => { .then((is_admin) => {
this.is_admin = is_admin; this.is_admin = is_admin;
resolve(is_admin); resolve(is_admin);

View file

@ -1,7 +1,14 @@
const { defineConfig } = require('@vue/cli-service') const { defineConfig } = require("@vue/cli-service");
module.exports = defineConfig({ module.exports = defineConfig({
transpileDependencies: true, transpileDependencies: true,
devServer: { devServer: {
host: 'localhost', host: "localhost",
} },
}) pages: {
index: {
entry: "src/main.ts",
title: "Kalender-Gewinnspiel",
},
},
});