101 lines
2.2 KiB
Vue
101 lines
2.2 KiB
Vue
<template>
|
|
<v-app full-height>
|
|
<v-navigation-drawer v-model="drawer" :location="mdAndDown ? 'bottom' : undefined">
|
|
<v-img v-if="!mdAndDown" src="/logo.jpg" height="75" class="my-6" />
|
|
|
|
<v-list color="primary" lines="two">
|
|
<v-list-item v-for="(item, index) in menu" :key="index" :to="item.to" :title="item.title"
|
|
:prepend-icon="item.icon" />
|
|
</v-list>
|
|
|
|
<template #append>
|
|
<v-list lines="two">
|
|
<v-list-item title="Logged in" prepend-icon="mdi-account" />
|
|
<v-list-item @click="logOut" title="Log out" prepend-icon="mdi-logout" base-color="error" />
|
|
</v-list>
|
|
</template>
|
|
</v-navigation-drawer>
|
|
|
|
<v-app-bar v-if="mdAndDown" elevation="2">
|
|
<template #prepend>
|
|
<v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer" />
|
|
</template>
|
|
|
|
<v-img src="/logo.jpg" height="50" />
|
|
|
|
<template #append>
|
|
<v-btn @click="logOut" class="mr-3" variant="text" color="error" icon="mdi-logout" />
|
|
</template>
|
|
</v-app-bar>
|
|
|
|
<v-main>
|
|
<router-view />
|
|
</v-main>
|
|
</v-app>
|
|
</template>
|
|
|
|
<script setup>
|
|
definePageMeta({
|
|
layout: false,
|
|
});
|
|
|
|
const { mdAndDown } = useDisplay();
|
|
|
|
const drawer = ref(false);
|
|
|
|
const menu = ref([
|
|
{
|
|
to: "/dashboard/interest-eoi-queue",
|
|
icon: "mdi-tray-full",
|
|
title: "EOI Queue",
|
|
},
|
|
{
|
|
to: "/dashboard/interest-analytics",
|
|
icon: "mdi-view-dashboard",
|
|
title: "Analytics",
|
|
},
|
|
{
|
|
to: "/dashboard/interest-berth-list",
|
|
icon: "mdi-table",
|
|
title: "Berth List",
|
|
},
|
|
{
|
|
to: "/dashboard/interest-berth-status",
|
|
icon: "mdi-sail-boat",
|
|
title: "Berth Status",
|
|
},
|
|
{
|
|
to: "/dashboard/interest-list",
|
|
icon: "mdi-view-list",
|
|
title: "Interest List",
|
|
},
|
|
{
|
|
to: "/dashboard/interest-status",
|
|
icon: "mdi-account-check",
|
|
title: "Interest Status",
|
|
},
|
|
{
|
|
to: "/dashboard/site",
|
|
icon: "mdi-view-dashboard",
|
|
title: "Site Analytics",
|
|
},
|
|
{
|
|
to: "/dashboard/data",
|
|
icon: "mdi-finance",
|
|
title: "Data Analytics",
|
|
},
|
|
]);
|
|
|
|
const logOut = async () => {
|
|
return navigateTo("/login");
|
|
};
|
|
|
|
onMounted(() => {
|
|
if (mdAndDown.value) {
|
|
return;
|
|
}
|
|
|
|
drawer.value = true;
|
|
})
|
|
</script>
|