From 67bcbf45f531e2bbad2e90a2727ed84b10162cbf Mon Sep 17 00:00:00 2001
From: Jeppe Bundgaard <jb@truckwash.dk>
Date: Thu, 8 Jan 2026 12:00:47 +0100
Subject: [PATCH] Refactor button slots and layouts across Self-Serve and Wash
 Lanes modules

- Standardized `buttons` slot structure in pagination templates.
- Removed redundant button definitions in `DepartmentWashLane.vue`.
- Updated button styles and layouts for consistency across components.
---
 .../PaginationDisplayGeneralSearchReload.vue   |  3 +++
 .../pagination/TableLabeledPagination.vue      |  6 +++++-
 .../SelfServeQuestionsPagination.vue           |  7 +++++--
 .../DepartmentSelfServeQuestions.vue           |  4 ++--
 .../modules/wash-lanes/DepartmentWashLane.vue  | 18 ++----------------
 5 files changed, 17 insertions(+), 21 deletions(-)

diff --git a/src/components/displays/pagination/PaginationDisplayGeneralSearchReload.vue b/src/components/displays/pagination/PaginationDisplayGeneralSearchReload.vue
index e577e928..aa5823cd 100644
--- a/src/components/displays/pagination/PaginationDisplayGeneralSearchReload.vue
+++ b/src/components/displays/pagination/PaginationDisplayGeneralSearchReload.vue
@@ -20,6 +20,9 @@ import SessionUser from "@/components/session/token/SessionUser.vue";
           @input="search($event.target.value)"
       />
     </div>
+    <div class="column is-narrow" v-if="$slots.buttons">
+      <slot name="buttons"></slot>
+    </div>
     <div class="column is-narrow">
       <LoadButtonWhileAwait class="is-dark" :isLoading="isLoading" :loadFunction="loadList" icon="fas fa-sync-alt">{{SessionUser.objects.global.language.reload}}</LoadButtonWhileAwait>
     </div>
diff --git a/src/components/displays/pagination/TableLabeledPagination.vue b/src/components/displays/pagination/TableLabeledPagination.vue
index 1c9ec371..229182f3 100644
--- a/src/components/displays/pagination/TableLabeledPagination.vue
+++ b/src/components/displays/pagination/TableLabeledPagination.vue
@@ -32,7 +32,11 @@ const isSmall = ref(window.innerWidth < 1024);
     <!-- Label -->
     <h2 class="title is-4 mb-4">{{ label }}</h2>
     <!-- Search & reload -->
-    <PaginationDisplayGeneralSearchReload/>
+    <PaginationDisplayGeneralSearchReload>
+      <template #buttons v-if="$slots.buttons">
+        <slot name="buttons"></slot>
+      </template>
+    </PaginationDisplayGeneralSearchReload>
     <!-- Filters -->
     <PaginationDisplay :metaItemsPerPage="metaItemsPerPage" :loadFunction="loadList" :isLoading="isLoading" :setMetaItemsPerPage="setMetaItemsPerPage">
       <template #paginationColumns>
diff --git a/src/components/displays/pagination/models/DepartmentDashboard/SelfServeQuestionsPagination.vue b/src/components/displays/pagination/models/DepartmentDashboard/SelfServeQuestionsPagination.vue
index b36ea970..6cc2bc46 100644
--- a/src/components/displays/pagination/models/DepartmentDashboard/SelfServeQuestionsPagination.vue
+++ b/src/components/displays/pagination/models/DepartmentDashboard/SelfServeQuestionsPagination.vue
@@ -98,9 +98,12 @@ defineExpose({
 
 <template>
   <TableLabeledPagination :label="SessionUser.objects.self_serve_questions.meta.title">
-    <template #buttons>
+    <template #buttons="{ loadList }">
       <slot name="buttons" :loadList="loadList">
-        <button class="button is-primary is-small" @click="SessionUser.objects.self_serve_questions.showCreateObjectForm({}, loadList)">
+        <button
+            class="button is-primary is-small"
+            @click="SessionUser.objects.self_serve_questions.showCreateObjectForm({}, loadList)"
+        >
           <span class="icon is-small">
             <i class="fas fa-plus"></i>
           </span>
diff --git a/src/views/dashboards/departmentDashboard/modules/self-serve/DepartmentSelfServeQuestions.vue b/src/views/dashboards/departmentDashboard/modules/self-serve/DepartmentSelfServeQuestions.vue
index c27cc739..0b4cdf38 100644
--- a/src/views/dashboards/departmentDashboard/modules/self-serve/DepartmentSelfServeQuestions.vue
+++ b/src/views/dashboards/departmentDashboard/modules/self-serve/DepartmentSelfServeQuestions.vue
@@ -34,7 +34,7 @@ const selectVehicleType = (vehicleType) => {
         >
           <template #buttons="{ loadList }">
             <button
-                class="button is-primary is-small"
+                class="button is-primary"
                 @click="SessionUser.objects.self_serve_questions.showCreateObjectForm({
                   department: departmentId,
                   vehicle_type: selectedVehicleType?.id
@@ -42,7 +42,7 @@ const selectVehicleType = (vehicleType) => {
                 :disabled="!selectedVehicleType"
                 :title="!selectedVehicleType ? 'Vælg venligst en køretøjstype først' : ''"
             >
-              <span class="icon is-small">
+              <span class="icon">
                 <i class="fas fa-plus"></i>
               </span>
               <span>Tilføj spørgsmål</span>
diff --git a/src/views/dashboards/departmentDashboard/modules/wash-lanes/DepartmentWashLane.vue b/src/views/dashboards/departmentDashboard/modules/wash-lanes/DepartmentWashLane.vue
index 86b5b775..f189d43d 100644
--- a/src/views/dashboards/departmentDashboard/modules/wash-lanes/DepartmentWashLane.vue
+++ b/src/views/dashboards/departmentDashboard/modules/wash-lanes/DepartmentWashLane.vue
@@ -44,20 +44,6 @@ onMounted(() => {
         <div v-if="lane">
           <PageTitle :title="'Vaskebane: ' + lane.name" :subtitle="'ID: ' + lane.id">
             <template #buttons>
-              <button
-                  v-if="selectedVehicleType"
-                  class="button is-primary"
-                  @click="SessionUser.objects.self_serve_questions.showCreateObjectForm({
-                          department: departmentId,
-                          lane: laneId,
-                          vehicle_type: selectedVehicleType?.id
-                        }, () => selfServeQuestionsPagination?.loadList())"
-              >
-                <span class="icon">
-                  <i class="fas fa-plus"></i>
-                </span>
-                <span>Opret spørgsmål</span>
-              </button>
               <button class="button is-dark" @click="router.push(`/admin/${departmentId}/modules/wash-lanes`)">
                 <span class="icon">
                   <i class="fas fa-arrow-left"></i>
@@ -157,7 +143,7 @@ onMounted(() => {
                 >
                   <template #buttons="{ loadList }">
                     <button
-                        class="button is-primary is-small"
+                        class="button is-primary"
                         @click="SessionUser.objects.self_serve_questions.showCreateObjectForm({
                           department: departmentId,
                           lane: laneId,
@@ -166,7 +152,7 @@ onMounted(() => {
                         :disabled="!selectedVehicleType"
                         :title="!selectedVehicleType ? 'Vælg venligst en køretøjstype først' : ''"
                     >
-                      <span class="icon is-small">
+                      <span class="icon">
                         <i class="fas fa-plus"></i>
                       </span>
                       <span>Tilføj spørgsmål</span>