Add water usage tracking and improve daily report handling

Updated DepartmentDailyReports to add water usage fields and support notes for daily reports. Enhanced form submission logic in DepartmentDashboardDailyReportTodayForm to handle fetching or creating reports dynamically based on date. Improved error handling and integrated success messages for better user feedback.

src/components/session/token/SessionUser/Objects/DepartmentDailyReports.vue

@@ -67,30 +67,32 @@ import {ref} from "vue";
           }
         },
       },
-      add: async (department_id, category_id) => {
+      add: async (department_id, water_usage_morning = 0, water_usage = 0, notes = null) => {
         return ObjectsGlobal.add.object(
             DepartmentDailyReports.meta.endpoint,
             {
               department_id: parseInt(department_id),
-              category_id: parseInt(category_id)
+              water_usage_morning: parseInt(water_usage_morning),
+              water_usage: parseInt(water_usage),
+              notes: notes ? notes : 'Daily report'
             }
         );
       },
       set: {
-        department_id: async (id, department_id) => {
+        water_usage: async (id, water_usage) => {
           return ObjectsGlobal.set.column(
               DepartmentDailyReports.meta.endpoint,
               id,
-              "department_id",
-              parseInt(department_id)
+              "water_usage",
+              parseInt(water_usage)
           )
         },
-        category_id: async (id, category_id) => {
+        water_usage_morning: async (id, water_usage_morning) => {
           return ObjectsGlobal.set.column(
               DepartmentDailyReports.meta.endpoint,
               id,
-              "category_id",
-              parseInt(category_id)
+              "water_usage_morning",
+              parseInt(water_usage_morning)
           )
         },
       },
@@ -125,6 +127,12 @@ import {ref} from "vue";
               "GET"
           );
         },
+        getLatest: async (department_id) => {
+          return authenticatedRequest(
+              "/departments/daily-reports/latest?id=" + department_id,
+              "GET"
+          );
+        },
       },
       /**
        * Show the create object form

src/views/dashboards/departmentDashboard/modules/daily-report/displays/DepartmentDashboardDailyReportTodayForm.vue

@@ -1,20 +1,105 @@
 <script setup>
-
 import { ref, defineProps } from 'vue';
+import { SessionUser } from "@/components/session/token/SessionUser.vue";
+import { parseError, getError, clearErrors} from "@/components/request/HandleGlobalError.vue";
+import ShowErrorField from "@/components/global/ShowErrorField.vue";
 
 const props = defineProps({
     department_id: Number,
     date: String,
 });
 
+// Define the random unique id
+const uniqueId = Math.random().toString(36).substr(2, 9);
+
 // Define the form fields
 const water_usage = ref(0);
 const water_usage_morning = ref(0);
+const notes = ref(null);
+const filled_by = ref(null);
+const created_at = ref(null);
+const id = ref(null);
+const message = ref('');
 
 const onFormSubmit = async (event) => {
     event.preventDefault();
-    console.log('Form submitted');
+    console.log('Form submitted with values:', water_usage.value, water_usage_morning.value, notes.value, filled_by.value, created_at.value, id.value);
+    SessionUser.objects.department_daily_reports.set.water_usage_morning(id.value, parseInt(water_usage_morning.value))
+        .then(() => {
+            SessionUser.objects.department_daily_reports.set.water_usage(id.value, parseInt(water_usage.value))
+                .then((response) => {
+                  if (response.data.data.id === id.value) {
+                    message.value = 'Rapporten er gemt ' + new Date().toLocaleTimeString();
+                    clearErrors();
+                  } else {
+                    catchError('Der skete en fejl', uniqueId);
+                  }
+                })
+                .catch(error => {
+                    catchError(error, uniqueId);
+                });
+        }).catch(error => {
+        catchError(error, uniqueId);
+    })
 };
+
+
+const catchError = (error, uniqueId) => {
+    message.value = null;
+    parseError(error, uniqueId);
+};
+
+const createDailyReport = async () => {
+    try {
+        await SessionUser.objects.department_daily_reports.add(props.department_id)
+            .then(response => {
+                console.log(response.data.data);
+            });
+    } catch (error) {
+        parseError(error, 'department_daily_reports');
+    }
+};
+
+const getDailyReport = async () => {
+  try {
+    await SessionUser.objects.department_daily_reports.functions.getLatest(props.department_id)
+      .then(response => {
+        // Check if the date is today
+        const created_at_val = new Date(response.data.data.created_at);
+        const today = new Date();
+        if (created_at_val.toDateString() === today.toDateString()) {
+          // The daily report is today
+          // So we can set the values
+          water_usage_morning.value = parseInt(response.data.data.water_usage_morning);
+          water_usage.value = parseInt(response.data.data.water_usage);
+          notes.value = response.data.data.notes ? response.data.data.notes : '';
+          filled_by.value = response.data.data.filled_by ? response.data.data.filled_by : null;
+          created_at.value = response.data.data.created_at;
+          id.value = response.data.data.id;
+        } else {
+          // The daily report is not from today
+          // So we need to create a new daily report
+          // And then rerun the getDailyReport function
+          createDailyReport();
+          getDailyReport();
+        }
+      });
+  } catch (error) {
+    // Check if the error is a 404 (Then we need to create a new daily report)
+    if (error.response.status === 404) {
+      // Create a new daily report, and then rerun the getDailyReport function
+      // This is done to prevent an infinite loop of creating daily reports
+      await createDailyReport().then(() => {
+        // Rerun the getDailyReport function, to prevent
+        getDailyReport();
+      });
+    } else {
+      parseError(error, uniqueId);
+    }
+  }
+};
+
+getDailyReport();
 </script>
 
 <template>
@@ -22,13 +107,7 @@ const onFormSubmit = async (event) => {
     <div class="columns is-multiline">
       <div class="column is-12">
         <h1 class="title">Dagens rapport</h1>
-        <!-- Warning under development -->
-        <div class="message is-info">
-          <div class="message-body">
-            <h2>Under udvikling</h2>
-            <p>Denne funktion er under udvikling og vil snart være tilgængelig.</p>
-          </div>
-        </div>
+        <ShowErrorField :error="uniqueId" />
       </div>
       <div class="column is-6">
         <div class="field">
@@ -49,7 +128,15 @@ const onFormSubmit = async (event) => {
     </div>
     <div class="field">
       <div class="control">
-        <button class="button is-dark is-fullwidth" disabled>Gem</button>
+        <button class="button is-dark is-fullwidth" :disabled="!water_usage_morning || !created_at" type="submit">Gem</button>
+      </div>
+      <!-- Show the success message -->
+      <div class="control mt-2">
+        <div class="message is-success" v-if="message">
+          <div class="message-body">
+            {{ message }}
+          </div>
+        </div>
       </div>
     </div>
   </form>