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

40 lines
815 B
Vue

<template>
<SVGRect :rectangle="door.position" :focused="false" @click.left="on_click" />
</template>
<script lang="ts">
import { Door } from "@/lib/door";
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(`user/image_${this.door.day}`)
.then((data) => this.$emit("doorSuccess", this.door.day, data))
.catch((error) => {
this.$emit("doorFailure", this.$advent22.format_user_error(error));
});
}
}
</script>
<style scoped>
rect {
cursor: pointer;
}
</style>