main/view/vue/header.vue

<template>

	<div id='HEADER'>

		<!-- Header Icon+Title -->
		<div id='header-icon'>
			<div class='header-title'>{{ gstore.header_title }}</div>
		</div>

		<!-- Header Info -->
		<div id='header-info' v-show='gstore.notif.active' :class='gstore.notif.type'>{{ gstore.notif.message }}</div>

		<!-- Header Notif -->
		<div id='header-notif'>
			<div class='hnotif bell' data-count='4'></div>
			<div class='hnotif message'data-count='23'></div>
			<div class='hnotif search'></div>
			<div class='hnotif menu'></div>
		</div>

	</div>

</template>


<script>
export default {
	name: 'HEADER',
	data(){ return { gstore: window.gstore.data }; }
}
</script>