From af61ead3b128b09e1515a702ff49f095f7d95b0e Mon Sep 17 00:00:00 2001
From: Jepp9350 <2jepp9350@gmail.com>
Date: Tue, 4 Mar 2025 11:52:54 +0100
Subject: [PATCH] Wrap components with NotFoundFallBackPageWrapper for
 validation.

Added NotFoundFallBackPageWrapper across various department-related components to handle scenarios where the department ID is missing or inaccessible. Also updated getDepartmentIdFromUrl to ensure valid department IDs are returned.
---
 src/components/session/token/SessionUser.vue  |  2 +-
 .../modules/Pos/DepartmentPos.vue             |  9 +-
 .../modules/Pos/DepartmentPosOrder.vue        |  2 +-
 .../modules/Pos/DepartmentPosOrders.vue       | 11 ++-
 .../modules/bookings/DepartmentBookings.vue   |  5 +-
 .../daily-report/DepartmentDailyReport.vue    | 83 ++++++++++---------
 6 files changed, 64 insertions(+), 48 deletions(-)

diff --git a/src/components/session/token/SessionUser.vue b/src/components/session/token/SessionUser.vue
index 01b2feb7..7ffe9a14 100644
--- a/src/components/session/token/SessionUser.vue
+++ b/src/components/session/token/SessionUser.vue
@@ -271,7 +271,7 @@ export const SessionUser = {
     getDepartmentIdFromUrl: () => {
       // Check if the department id is in the route
       const router = useRouter();
-      return parseInt(router.currentRoute.value.params.departmentId);
+      return parseInt(router.currentRoute.value.params.departmentId) > 0 ? parseInt(router.currentRoute.value.params.departmentId) : undefined;
     },
     /** Redirect to */
     redirectTo: {
diff --git a/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPos.vue b/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPos.vue
index f0ec0d86..26f6a980 100644
--- a/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPos.vue
+++ b/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPos.vue
@@ -8,6 +8,7 @@ import RestrictedPageWrapper from "@/components/page/wrappers/RestrictedPageWrap
 import { SessionUser } from "@/components/session/token/SessionUser.vue";
 import DepartmentDashboardPageWrapper from "@/views/dashboards/departmentDashboard/DepartmentDashboardPageWrapper.vue";
 import PageTitle from "@/components/global/PageTitle.vue";
+import NotFoundFallBackPageWrapper from "@/components/page/wrappers/NotFoundFallBackPageWrapper.vue";
 </script>
 
 <template>
@@ -17,9 +18,11 @@ import PageTitle from "@/components/global/PageTitle.vue";
   >
     <template #default>
       <RestrictedPageWrapper :hasPermission="SessionUser.canAccessAdmin()">
-        <!-- <DepartmentDashboardHero /> -->
-        <!-- <DepartmentPosNavigation /> -->
-        <PosDepartmentMVP />
+        <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.">
+          <!-- <DepartmentDashboardHero /> -->
+          <!-- <DepartmentPosNavigation /> -->
+          <PosDepartmentMVP />
+        </NotFoundFallBackPageWrapper>
       </RestrictedPageWrapper>
     </template>
   </DepartmentDashboardPageWrapper>
diff --git a/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrder.vue b/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrder.vue
index 1b101016..d33e9bc6 100644
--- a/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrder.vue
+++ b/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrder.vue
@@ -148,7 +148,7 @@ const isBookedWithEconomic = () => {
       title="Kassesystem"
       subtitle="Transaktion"
       >
-    <notFoundFallBackPageWrapper :exists="(customer_name || isLoading)" error="Denne handel findes ikke, eller du har ikke adgang til at se den.">
+    <notFoundFallBackPageWrapper :exists="(customer_name || isLoading) && (SessionUser.functions.getDepartmentIdFromUrl() > 1 && SessionUser.canAccessDepartment(SessionUser.functions.getDepartmentIdFromUrl()))" error="Denne handel findes ikke, eller du har ikke adgang til at se den.">
     <div class="columns">
       <div class="column is-8-desktop" v-if="AddOrderItemsVisible">
         <SelectProductsFormPOS class="mt-3" category="products" />
diff --git a/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrders.vue b/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrders.vue
index cfa070ba..b34ca5cd 100644
--- a/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrders.vue
+++ b/src/views/dashboards/departmentDashboard/modules/Pos/DepartmentPosOrders.vue
@@ -6,16 +6,19 @@ import OrdersPagination from "@/components/displays/pagination/models/Department
 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";
 
 </script>
 
 <template>
   <RestrictedPageWrapper :hasPermission="SessionUser.canAccessAdmin()">
     <DepartmentDashboardPageWrapper title="Kassesystem" subtitle="Point of Sale">
-      <template #default>
-        <DepartmentDashboardHero />
-        <OrdersPagination />
-      </template>
+      <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.">
+        <template #default>
+          <DepartmentDashboardHero />
+          <OrdersPagination />
+        </template>
+      </NotFoundFallBackPageWrapper>
     </DepartmentDashboardPageWrapper>
   </RestrictedPageWrapper>
 </template>
diff --git a/src/views/dashboards/departmentDashboard/modules/bookings/DepartmentBookings.vue b/src/views/dashboards/departmentDashboard/modules/bookings/DepartmentBookings.vue
index dcd7eeb3..cb8b2d3a 100644
--- a/src/views/dashboards/departmentDashboard/modules/bookings/DepartmentBookings.vue
+++ b/src/views/dashboards/departmentDashboard/modules/bookings/DepartmentBookings.vue
@@ -7,6 +7,7 @@ import RestrictedPageWrapper from "@/components/page/wrappers/RestrictedPageWrap
 import { SessionUser } from "@/components/session/token/SessionUser.vue";
 import BookingsPagination from "@/components/displays/pagination/models/UserDashboard/BookingsPagination.vue";
 import DepartmentDashboardPageWrapper from "@/views/dashboards/departmentDashboard/DepartmentDashboardPageWrapper.vue";
+import NotFoundFallBackPageWrapper from "@/components/page/wrappers/NotFoundFallBackPageWrapper.vue";
 </script>
 
 <template>
@@ -15,7 +16,9 @@ import DepartmentDashboardPageWrapper from "@/views/dashboards/departmentDashboa
         title="Bookinger"
         subtitle="Oversigt over bookinger"
     >
-      <BookingsPagination />
+      <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.">
+        <BookingsPagination />
+      </NotFoundFallBackPageWrapper>
     </DepartmentDashboardPageWrapper>
   </RestrictedPageWrapper>
 </template>
diff --git a/src/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReport.vue b/src/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReport.vue
index 3a8ffa9e..950377a3 100644
--- a/src/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReport.vue
+++ b/src/views/dashboards/departmentDashboard/modules/daily-report/DepartmentDailyReport.vue
@@ -15,6 +15,7 @@ import DepartmentDashboardDailyReportProductSales
 import DepartmentDashboardDailyReportTodayForm
   from "@/views/dashboards/departmentDashboard/modules/daily-report/displays/DepartmentDashboardDailyReportTodayForm.vue";
 import { Colors } from "@/ThemeConfig.vue";
+import NotFoundFallBackPageWrapper from "@/components/page/wrappers/NotFoundFallBackPageWrapper.vue";
 
 /**
  * Get the current date
@@ -39,6 +40,10 @@ const products_sold = ref(null);
 
 // Get the transactions for the current day
 const getTransactions = async () => {
+  // If the department ID is not set, return
+  if (!department_id.value) {
+    return;
+  }
   await SessionUser.objects.department_daily_reports.functions.getTransactionCount(department_id.value, getDate())
     .then(response => {
       transactions.value = response.data.data.quantity;
@@ -100,46 +105,48 @@ const product_ids = ref([
         title="Dagsopgørelse"
         subtitle="Få et overblik over dagens omsætning, forbrug og bookinger"
     >
-      <!-- Create daily report button -->
-      <div class="columns is-flex-wrap-wrap">
-        <div class="column is-12 has-text-right">
-          <button class="button is-primary"
-                  @click="SessionUser.objects.department_daily_reports.functions.showCreateObjectFormDepartment(department_id)">
-            <span class="icon">
-              <i class="fas fa-plus"></i>
-            </span>
-            <span>Opret ny dagsopgørelse</span>
-          </button>
+      <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.">
+        <!-- Create daily report button -->
+        <div class="columns is-flex-wrap-wrap">
+          <div class="column is-12 has-text-right">
+            <button class="button is-primary"
+                    @click="SessionUser.objects.department_daily_reports.functions.showCreateObjectFormDepartment(department_id)">
+              <span class="icon">
+                <i class="fas fa-plus"></i>
+              </span>
+              <span>Opret ny dagsopgørelse</span>
+            </button>
+          </div>
         </div>
-      </div>
-      <!-- At the top of the page, we want to have a button that allows the user to create a new daily report -->
-      <div class="columns is-multiline">
-        <!-- Display the daily report product sales -->
-        <div class="column is-4" v-for="product in product_ids" :key="product.id">
-          <DepartmentDashboardDailyReportProductSales
-              :product_id="product.id"
-              :date="getDate()"
-              :department_id="department_id"
-              :color="Colors.global.primaryColor"
-          />
+        <!-- At the top of the page, we want to have a button that allows the user to create a new daily report -->
+        <div class="columns is-multiline">
+          <!-- Display the daily report product sales -->
+          <div class="column is-4" v-for="product in product_ids" :key="product.id">
+            <DepartmentDashboardDailyReportProductSales
+                :product_id="product.id"
+                :date="getDate()"
+                :department_id="department_id"
+                :color="Colors.global.primaryColor"
+            />
+          </div>
+          <!-- Display the daily report counts -->
+          <div class="column is-4" v-for="report in reports" :key="report.title">
+            <DepartmentDashboardDailyReportCount
+                :title="report.title"
+                :subtitle="report.subtitle"
+                :count="report.count"
+                :icon="report.icon"
+                :color="report.color"
+                :buttons="report.buttons"
+            />
+          </div>
         </div>
-        <!-- Display the daily report counts -->
-        <div class="column is-4" v-for="report in reports" :key="report.title">
-          <DepartmentDashboardDailyReportCount
-              :title="report.title"
-              :subtitle="report.subtitle"
-              :count="report.count"
-              :icon="report.icon"
-              :color="report.color"
-              :buttons="report.buttons"
-          />
-        </div>
-      </div>
-      <!-- Form to create a new daily report -->
-      <DepartmentDashboardDailyReportTodayForm
-          :department_id="department_id"
-          :date="getDate()"
-      />
+        <!-- Form to create a new daily report -->
+        <DepartmentDashboardDailyReportTodayForm
+            :department_id="department_id"
+            :date="getDate()"
+        />
+      </NotFoundFallBackPageWrapper>
     </DepartmentDashboardPageWrapper>
   </RestrictedPageWrapper>
 </template>