<template>
	<q-layout view="hHh lpR fff">

		<q-header elevated class="bg-primary text-white">
			<q-toolbar>
				<q-btn dense flat round icon="menu" @click="toggleLeftDrawer" />

				<q-toolbar-title>
					SCA S.A.S.
				</q-toolbar-title>
			</q-toolbar>
		</q-header>

		<q-drawer show-if-above v-model="leftDrawerOpen" side="left" bordered>
			<!-- drawer content -->
		</q-drawer>

		<q-page-container>
			<router-view />
		</q-page-container>

		<q-footer elevated class="bg-grey-8 text-white">
			<!-- Crea tu propio footer. -->
		</q-footer>

	</q-layout>
</template>

<script setup>
	import { ref } from 'vue'

	const leftDrawerOpen = ref(false)

	const toggleLeftDrawer = () => {
		leftDrawerOpen.value = !leftDrawerOpen.value
	}
</script>