<template>
  <section>
    <div class="container is-flex is-justify-content-flex-end">
    <div
      class="
        container
        is-flex is-justify-content-space-between is-align-items-center
      "
    >
      <h2 class="m-2 has-text-white">{{ numeroTrabajador }}</h2>
    </div>
      <b-button
        type="is-danger"
        size="is-small"
        class="m-2 rojo"
        @click="cerrarSesion()"
      >
        Cerrar Sesión
      </b-button>
    </div>
  </section>
</template>

<script>
export default {
  data() {
    return { numeroTrabajador: localStorage.getItem('numeroTrabajador') }
  },
  methods: {
    cerrarSesion() {
      localStorage.clear()
      this.$router.push('/')
    },
  },
  created() {
    if (!localStorage.getItem('numeroTrabajador') || !localStorage.getItem('token') || !localStorage.getItem('idProfesor'))
      this.cerrarSesion()
  },
}
</script>

<style scoped>
section {
  background-color: #bb8704;
}

.rojo {
  background-color: #dc3545;
}
</style>
