advent22/ui/src/components/calendar/CalendarDoor.vue

52 lines
1 KiB
Vue

<template>
<SVGRect :rectangle="door.position" :focused="false" @click="on_click" />
</template>
<script lang="ts">
import { Door } from "@/lib/door";
import { AxiosError } from "axios";
import { Options, Vue } from "vue-class-component";
import SVGRect from "./SVGRect.vue";
@Options({
components: {
SVGRect,
},
props: {
door: Door,
},
emits: ["doorClick", "doorSuccess", "doorFailure"],
})
export default class extends Vue {
public door!: Door;
public on_click() {
this.$emit("doorClick");
this.$advent22.api_get_blob(
`days/image/${this.door.day}`,
(data) => this.$emit("doorSuccess", data),
(_, reason) => {
let msg = "Unbekannter Fehler, bitte wiederholen!";
if (
reason instanceof AxiosError &&
reason.response !== undefined &&
reason.response.status === 401
) {
msg = "Netter Versuch :)";
}
this.$emit("doorFailure", msg);
},
);
}
}
</script>
<style lang="scss" scoped>
rect {
cursor: pointer;
}
</style>