mirror of
https://github.com/ckaczor/HomeMonitor.git
synced 2026-01-14 01:25:38 -05:00
62 lines
1.8 KiB
Vue
62 lines
1.8 KiB
Vue
<template>
|
|
<v-app>
|
|
<v-app-bar
|
|
title="Home Monitor"
|
|
color="primary">
|
|
<template v-slot:prepend>
|
|
<v-app-bar-nav-icon
|
|
v-show="!mdAndUp"
|
|
@click="drawer = !drawer"></v-app-bar-nav-icon>
|
|
</template>
|
|
</v-app-bar>
|
|
|
|
<v-navigation-drawer
|
|
mobile-breakpoint="md"
|
|
:expand-on-hover="mdAndUp"
|
|
:rail="mdAndUp"
|
|
:model-value="mdAndUp ? true : drawer">
|
|
<v-list
|
|
density="compact"
|
|
nav>
|
|
<v-list-item
|
|
prepend-icon="mdi-view-dashboard"
|
|
title="Dashboard"
|
|
to="/"
|
|
@click="drawer = false">
|
|
</v-list-item>
|
|
<v-list-item
|
|
prepend-icon="mdi-sun-thermometer"
|
|
title="Outdoor"
|
|
to="outdoor"
|
|
@click="drawer = false">
|
|
</v-list-item>
|
|
<v-list-item
|
|
prepend-icon="mdi-home-analytics"
|
|
title="Indoor"
|
|
to="indoor"
|
|
@click="drawer = false">
|
|
</v-list-item>
|
|
<v-list-item
|
|
prepend-icon="mdi-home-lightning-bolt-outline"
|
|
title="Power"
|
|
to="power"
|
|
@click="drawer = false">
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
|
|
<v-main>
|
|
<router-view />
|
|
</v-main>
|
|
</v-app>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue';
|
|
import { useDisplay } from 'vuetify';
|
|
|
|
const drawer = ref(false);
|
|
|
|
const { mdAndUp } = useDisplay();
|
|
</script>
|