<script setup>
import RestrictedPageWrapper from "@/components/page/wrappers/RestrictedPageWrapper.vue";
import { SessionUser } from "@/components/session/token/SessionUser.vue";
import DepartmentDashboardPageWrapper from "@/views/dashboards/departmentDashboard/DepartmentDashboardPageWrapper.vue";
import NotFoundFallBackPageWrapper from "@/components/page/wrappers/NotFoundFallBackPageWrapper.vue";
import Calendar from "@/components/timebookings/TimeBookingsCalendar.vue";
import {IS_DEV} from "@/main.js";
</script>

<template>
  <RestrictedPageWrapper :hasPermission="SessionUser.canAccessAdmin()">
    <DepartmentDashboardPageWrapper
        title="Tidsbookinger"
        subtitle="Oversigt over tidsbookinger"
    >
      <NotFoundFallBackPageWrapper :exists="SessionUser.functions.getDepartmentIdFromUrl() && SessionUser.canAccessDepartment(SessionUser.functions.getDepartmentIdFromUrl())" error="Please select a department, that you have access to. If you believe this is an error, please contact support.">
        <div class="message is-warning">
          <div class="message-body">
            <strong>Udvikles</strong> Dette modul er under udvikling og vil snart være tilgængeligt.
          </div>
        </div>
        <!-- Calendar -->
        <Calendar
          :departmentId="SessionUser.functions.getDepartmentIdFromUrl()"
          />
      </NotFoundFallBackPageWrapper>
    </DepartmentDashboardPageWrapper>
  </RestrictedPageWrapper>
</template>

<style scoped>

</style>