<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 {timeBookingsNewProcess} from "@/views/dashboards/departmentDashboard/modules/time-bookings/book/TimeBookingsNewProcess.vue";
import TimeBookingsNewControls
  from "@/views/dashboards/departmentDashboard/modules/time-bookings/book/displays/TimeBookingsNewControls.vue";
import ShowErrorField from "@/components/global/ShowErrorField.vue";
import TimeBookingsNewStepDivider
  from "@/views/dashboards/departmentDashboard/modules/time-bookings/book/displays/TimeBookingsNewStepDivider.vue";
import TimeBookingsNewSummaryView
  from "@/views/dashboards/departmentDashboard/modules/time-bookings/book/displays/TimeBookingsNewSummaryView.vue";
import {useRoute} from "vue-router";

// Check if the step is provided in the URL
const route = useRoute();
if (route.query.step) {
  // If a step is provided, set it in the process
  timeBookingsNewProcess.step.value = parseInt(route.query.step);
} else {
  // If no step is provided, default to step 1
  timeBookingsNewProcess.step.value = 1;
}
</script>

<template>
  <RestrictedPageWrapper :hasPermission="SessionUser.canAccessAdmin()">
    <DepartmentDashboardPageWrapper
        title="Opret ny tidsbooking"
        subtitle="Opret en ny tidsbooking i din afdeling"
    >
      <TimeBookingsNewStepDivider>
      <!-- If no component is available, show a fallback -->
      <NotFoundFallBackPageWrapper :exists="timeBookingsNewProcess.getCurrentComponentView() !== null" error="Der er ingen trin tilgængelige for denne tidsbooking.">
        <TimeBookingsNewSummaryView>
          <template #content-left>
            <!-- Steps for creating a new time booking -->
            <component :is="timeBookingsNewProcess.getCurrentComponentView()" v-bind="timeBookingsNewProcess" v-if="timeBookingsNewProcess.getCurrentComponentView()" v-bind:timeBookingsNewProcess="timeBookingsNewProcess"/>
          </template>
          <template #content-bottom>
          </template>
        </TimeBookingsNewSummaryView>
        <!-- If the step is not found, show an error message -->
        <template #error>
          <ShowErrorField :message="`Trin ${timeBookingsNewProcess.step.value}'s komponent blev ikke fundet. Dette er en fejl i systemet, og formodentligvis en fejl i udviklingen. Kontakt venligst support, hvis du ser denne fejl.`"/>
        </template>
      </NotFoundFallBackPageWrapper>
      </TimeBookingsNewStepDivider>
      <!-- Controls -->
      <TimeBookingsNewControls/>
    </DepartmentDashboardPageWrapper>
  </RestrictedPageWrapper>
</template>

<style scoped>

</style>