Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory :  /home/corals/ts.corals.io/frontend/components/layout/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

<template>
  <div>
    <b-navbar toggleable="md" type="dark" variant="danger">
      <b-container fluid>
        <b-navbar-brand to="/">
          <b-img src="~/assets/images/calendar.svg" fluid class="filter-white"/>
        </b-navbar-brand>
        <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
        <b-collapse id="nav-collapse" is-nav>
          <b-navbar-nav v-if="$auth.loggedIn">
            <div v-for="(menu,index) in $getMenus()">
              <div v-if="menu.children && menu.children.length" :key="'menu_'+index">
                <b-nav-item-dropdown :text="menu.label">
                  <b-dropdown-item v-for="(child,childIndex) in menu.children"
                                   :to="child.link"
                                   :key="'menu_'+index+'_child_'+childIndex">
                    {{ child.label }}
                  </b-dropdown-item>
                </b-nav-item-dropdown>
              </div>
              <b-nav-item v-else-if="menu.link" :to="menu.link" :key="'menu_'+index">{{
                  menu.label
                }}
              </b-nav-item>
            </div>
          </b-navbar-nav>
          <b-navbar-nav class="ml-auto" v-if="$auth.loggedIn">
            <alerts/>
            <b-nav-item to="/profile">
              <fa icon="user"/>
              {{ $auth.user.full_name }}
            </b-nav-item>
            <b-nav-item href="#" :disabled="loggingOut" @click.prevent="logout()">
              Logout
              <b-spinner small v-if="loggingOut"></b-spinner>
              <fa icon="sign-out-alt" v-else/>
            </b-nav-item>
          </b-navbar-nav>
          <b-navbar-nav class="ml-auto" v-else>
            <b-nav-item to="/login">
              Login
              <fa icon="sign-in-alt"/>
            </b-nav-item>
          </b-navbar-nav>
        </b-collapse>
      </b-container>
    </b-navbar>
  </div>
</template>

<script>
import Alerts from "@/components/Alerts/Alerts"

export default {
  name: "TopNavbar",
  components: {Alerts},
  data() {
    return {
      loggingOut: false,
    }
  },
  methods: {
    logout() {
      this.loggingOut = true;
      this.$auth.logout().then(() => {
        this.loggingOut = false;
        this.$store.dispatch('CLEAR_ALERTS');
        this.$router.push('login');
      });
    }
  }
}
</script>

<style scoped>
.new-entry-btn {
  background-color: white;
  opacity: .7;
  border-radius: 0.2rem;
  font-weight: 500;
  transition: opacity 300ms;
}

.new-entry-btn:hover {
  opacity: 1;
}

.navbar-dark .navbar-nav .new-entry-btn .nav-link {
  color: initial;
}
</style>