@burh/nuxt-core 1.0.21 → 1.0.23

package/components/burh-ds/Tabs/TesteTab.vue

@@ -0,0 +1,100 @@
+<template>
+    <li class="tab tab-primary" :class="active && 'tab--active'"
+        @click="$emit('tab-click')">
+        <span class="tab__title" :class="tabTitleClass">{{title}}</span>
+        <span v-if="icon > 0" class="tab__icon" :class="tabIconClass">{{icon}}</span>
+    </li>
+</template>
+<script>
+export default {
+  name: "teste-tab",
+  props: {
+    title: {
+      type: String,
+      default: 'Testes',
+      description: 'Title for tab',
+      },
+    icon: {
+      type: Number,
+      default: 0,
+      description: 'Number for tab icon',
+      },
+    active: {
+      type: Boolean,
+      default: false,
+      description: 'Define if tab is active',
+    },
+    tabIconClass: {
+      type: String,
+      default: '',
+      description: 'Define css class for tab\'s icon',
+    },
+    tabTitleClass: {
+      type: String,
+      default: '',
+      description: 'Define css class for tab\'s title',
+    },
+    link: {
+      type: String,
+      default: '/',
+      description: 'Define nuxt-link link',
+    }
+  },
+  methods: {
+	redirect(link){
+		this.$router.push(link)
+	}
+  }
+};
+</script>
+<style lang="scss">
+@import "@burh/nuxt-core/assets/sass/burh-ds/variables/_colors.scss";
+
+.tab {
+    position: relative;
+    padding: .75rem 3rem;
+    margin: 0 1rem;
+
+  &:hover {
+	cursor: pointer;
+    .tab__title,  .tab__icon {
+      color: $primary;
+    }
+  }
+
+  &__title {
+    color: #3C4858;
+	font-weight: 600;
+  }
+
+  &__icon {
+    color: #ffffff;
+    border-radius: 50% !important;
+    background-color: #3C4858;;
+    padding: 0 .4rem;
+    font-weight: bold;
+  }
+}
+
+.tab--active {
+  .tab__title {
+	color:$primary;
+  }
+
+  .tab__icon {
+	background-color: $primary;
+  	color: #FFF
+  }
+}
+
+.tab--active::after {
+    content:'';
+    position:absolute;
+    bottom:0;
+    left:0;
+    right:0;
+    background: $primary;
+    height: 5px;
+    border-radius:5px 5px 0px 0px;
+}
+</style>

package/components/layouts/burh-ds/navbar/AppNavbar.vue

@@ -1,25 +1,46 @@
 <template>
-  <base-nav
-    container-classes="container-class-layout"
-    class="border-bottom navbar-animated navbar-horizontal"
-    expand="lg"
-    type="white"
-  >
-    <avatar-link
-      slot="brand"
-      :logo="brand"
-      :name="brandName"
-      class="row pl-4 nav-link"
-    />
-    <app-link-area class="hover" />
-    <user-menu-dropdown
-      :text="userMenuText"
-      :userAvatar="currentUser.avatar"
-      :userName="currentUser.name"
-      :companyLogo="currentCompany.logo"
-      :companyName="currentCompany.name"
-    />
-  </base-nav>
+	<base-nav
+		container-classes="container-fluid container-fluid--bu"
+		class="border-bottom navbar-animated navbar-horizontal"
+		expand="lg"
+		type="white"
+	>
+		<div style="display: flex; " slot="brand">
+			<avatar-link
+				:logo="brand"
+				:name="brandName"
+				class="row pl-4 nav-link cursor-pointer"
+				@avatar-click="redirectIndex"
+			/>
+			<slot name="brand-center" />
+		</div>
+
+		<app-link-area
+			v-if="currentUser != null"
+			:showableProducts="showableProducts"
+			:activeProducts="activeProducts"
+			:apps="gridApps"
+		/>
+		<user-menu-dropdown
+			:text="userMenuText"
+			:userAvatar="currentUser.avatar"
+			:userName="currentUser.name"
+			:companies="currentUser.companies"
+			:companyLogo="currentCompany.logo"
+			:companyName="currentCompany.name"
+		>
+			<avatar-link
+				slot="companies"
+				v-for="company in currentUser.companies"
+				:key="company.name"
+				:logo="company.logo"
+				:name="company.name"
+				class="dropdown-item"
+				:data="company"
+				@avatar-click="handleAvatarClick(company)"
+			/>
+		</user-menu-dropdown>
+	</base-nav>
 </template>
 <script>
 import BaseNav from '@burh/nuxt-core/components/burh-ds/Navbar/BaseNav.vue';
@@ -28,20 +49,37 @@ import AppLinkArea from '@burh/nuxt-core/components/burh-ds/Dropdown/AppLinkArea
 import AvatarLink from '@burh/nuxt-core/components/burh-ds/Avatar/AvatarLink.vue';
 
 export default {
-  components: {
-    BaseNav,
-    UserMenuDropdown,
-    AppLinkArea,
-    AvatarLink
-  },
-  props: {
-    currentUser: Object,
-    currentCompany: Object,
-    userMenuText: Object,
-    brand: String,
-    brandName: String
-  }
-}
+	components: {
+		BaseNav,
+		UserMenuDropdown,
+		AppLinkArea,
+		AvatarLink
+	},
+	props: {
+		currentUser: Object,
+		currentCompany: Object,
+		userMenuText: Object,
+		brand: String,
+		brandName: String,
+		showableProducts: Object,
+		activeProducts: Array,
+		gridApps: Array,
+		indexRoute: String,
+	},
+	data() {
+		return {
+			console: console
+		};
+	},
+	methods: {
+		handleAvatarClick(company) {
+			this.$emit('company-click', company);
+		},
+		redirectIndex() {
+			this.$router.push(this.indexRoute);
+		}
+	}
+};
 </script>
 <style lang="scss">
 .container-class-layout {