59 lines
1.4 KiB
Vue
59 lines
1.4 KiB
Vue
<template>
|
|
<ul class="nav nav-pills flex-column">
|
|
<TabNavigationItem
|
|
icon="fas fa-eye"
|
|
label="Aperçu"
|
|
:is-active="activeTab === 'overview'"
|
|
spacing=""
|
|
@click="$emit('change-tab', 'overview')"
|
|
/>
|
|
<TabNavigationItem
|
|
icon="fas fa-info-circle"
|
|
label="Informations"
|
|
:is-active="activeTab === 'info'"
|
|
@click="$emit('change-tab', 'info')"
|
|
/>
|
|
<TabNavigationItem
|
|
icon="fas fa-info-circle"
|
|
label="Activités recentes"
|
|
:is-active="activeTab === 'activity'"
|
|
@click="$emit('change-tab', 'activity')"
|
|
/>
|
|
<TabNavigationItem
|
|
icon="fas fa-users"
|
|
label="Contacts"
|
|
:is-active="activeTab === 'contacts'"
|
|
:badge="contactsCount > 0 ? contactsCount : null"
|
|
@click="$emit('change-tab', 'contacts')"
|
|
/>
|
|
<TabNavigationItem
|
|
icon="fas fa-sticky-note"
|
|
label="Notes"
|
|
:is-active="activeTab === 'notes'"
|
|
@click="$emit('change-tab', 'notes')"
|
|
/>
|
|
</ul>
|
|
</template>
|
|
|
|
<script setup>
|
|
import TabNavigationItem from "@/components/atoms/client/TabNavigationItem.vue";
|
|
|
|
import { defineProps, defineEmits } from "vue";
|
|
defineProps({
|
|
activeTab: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
contactsCount: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
locationsCount: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
});
|
|
|
|
defineEmits(["change-tab"]);
|
|
</script>
|