advent22/ui/src/components/AdminButton.vue

<template>
  <LoginModal ref="login_modal" @submit="on_login" />

  <BulmaButton
    class="button is-light"
    @click.left="$refs.login_modal.set_active(true)"
    icon="fa-solid fa-toggle-off"
    text="Admin"
  />
</template>

<script lang="ts">
import { Options, Vue } from "vue-class-component";

import BulmaButton from "./bulma/Button.vue";
import LoginModal from "./LoginModal.vue";

@Options({
  components: {
    BulmaButton,
    LoginModal,
  },
  props: {
    modelValue: Boolean,
  },
  emits: ["update:modelValue"],
})
export default class extends Vue {
  // true, iff Benutzer Admin ist
  public modelValue!: boolean;

  declare $refs: {
    login_modal: LoginModal;
  };

  public on_login() {
    this.$advent22
      .api_get<boolean>("admin/is_admin")
      .then((is_admin) => this.$emit("update:modelValue", is_admin));
  }
}
</script>