68 lines
1.6 KiB
Vue
68 lines
1.6 KiB
Vue
<template>
|
|
<LoginModal v-if="modal_visible" @submit="on_submit" @cancel="on_cancel" />
|
|
|
|
<BulmaButton
|
|
class="button is-primary is-outlined is-inverted"
|
|
@click.left="on_click"
|
|
:icon="'fa-solid fa-toggle-' + (modelValue ? 'on' : 'off')"
|
|
:busy="is_busy"
|
|
:text="modelValue ? 'Logout' : 'Login'"
|
|
/>
|
|
</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;
|
|
public modal_visible = false;
|
|
public is_busy = false;
|
|
|
|
public on_click() {
|
|
if (this.modelValue) {
|
|
// logout
|
|
this.$advent22.clear_api_auth();
|
|
this.$emit("update:modelValue", false);
|
|
} else {
|
|
// show login modal
|
|
this.is_busy = true;
|
|
this.modal_visible = true;
|
|
}
|
|
}
|
|
|
|
public on_submit(username: string, password: string) {
|
|
this.modal_visible = false;
|
|
this.$advent22.set_api_auth(username, password);
|
|
|
|
this.$advent22
|
|
.api_get<boolean>("admin/is_admin")
|
|
.then((is_admin) => {
|
|
this.$emit("update:modelValue", is_admin);
|
|
this.is_busy = false;
|
|
})
|
|
.catch((error) => {
|
|
alert(this.$advent22.format_user_error(error));
|
|
this.is_busy = false;
|
|
});
|
|
}
|
|
|
|
public on_cancel() {
|
|
this.modal_visible = false;
|
|
this.is_busy = false;
|
|
}
|
|
}
|
|
</script>
|