skillbox/client/src/components/LogoutWidget.vue

38 lines
767 B
Vue

<template>
<div class="logout-widget">
<a class="logout-widget__logout" data-cy="logout" @click="logout()">Logout</a>
</div>
</template>
<script>
import LOGOUT_MUTATION from '@/graphql/gql/mutations/logoutUser.gql';
export default {
methods: {
logout() {
this.$apollo.mutate({
mutation: LOGOUT_MUTATION,
}).then(({data}) => {
if (data.logout.success) { location.replace('/logout') }
});
}
}
}
</script>
<style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_mixins.scss";
.logout-widget {
color: $color-silver-dark;
display: flex;
align-items: center;
&__logout {
@include regular-text;
cursor: pointer;
}
}
</style>