Files
milsim-site-v4/ui/src/App.vue
2025-11-30 18:55:41 -05:00

43 lines
1.5 KiB
Vue

<script setup>
import { RouterView } from 'vue-router';
import Button from './components/ui/button/Button.vue';
import { useUserStore } from './stores/user';
import Alert from './components/ui/alert/Alert.vue';
import AlertDescription from './components/ui/alert/AlertDescription.vue';
import Navbar from './components/Navigation/Navbar.vue';
const userStore = useUserStore();
function formatDate(dateStr) {
if (!dateStr) return "";
return new Date(dateStr).toLocaleDateString("en-US", {
year: "numeric",
month: "short",
day: "numeric",
});
}
const environment = import.meta.env.VITE_ENVIRONMENT;
</script>
<template>
<div class="flex flex-col min-h-screen">
<Navbar class="flex"></Navbar>
<Alert v-if="environment == 'dev'" class="m-2 mx-auto w-5xl" variant="info">
<AlertDescription class="flex flex-row items-center text-nowrap gap-5 mx-auto">
<p>This is a development build of the application. Some features will be unavailable or unstable.</p>
</AlertDescription>
</Alert>
<Alert v-if="userStore.user?.loa?.[0]" class="m-2 mx-auto w-5xl" variant="info">
<AlertDescription class="flex flex-row items-center text-nowrap gap-5 mx-auto">
<p>You are on LOA until <strong>{{ formatDate(userStore.user?.loa?.[0].end_date) }}</strong></p>
<Button variant="secondary">End LOA</Button>
</AlertDescription>
</Alert>
<RouterView class="flex-1 min-h-0"></RouterView>
</div>
</template>
<style scoped></style>