adapt unified design in template

src/demodata/equipment.ts

@@ -8,6 +8,8 @@ export const equipmentDemoData: Array<EquipmentViewModel> = [
     code: "0456984224498",
     name: "B-Schlauch",
     location: "HLF",
+    commissioned: new Date(),
+    decommissioned: undefined,
     equipmentTypeId: equipmentTypeDemoData[0].id,
     equipmentType: equipmentTypeDemoData[0],
     inspections: [inspectionDemoData[0]],

src/demodata/vehicle.ts

@@ -7,6 +7,8 @@ export const vehicleDemoData: Array<VehicleViewModel> = [
     code: "",
     name: "HLF",
     location: "Tor 1",
+    commissioned: new Date(),
+    decommissioned: undefined,
     vehicleTypeId: vehicleTypeDemoData[0].id,
     vehicleType: vehicleTypeDemoData[0],
     inspections: [],
@@ -16,6 +18,8 @@ export const vehicleDemoData: Array<VehicleViewModel> = [
     code: "",
     name: "LF",
     location: "Tor 2",
+    commissioned: new Date(),
+    decommissioned: undefined,
     vehicleTypeId: vehicleTypeDemoData[1].id,
     vehicleType: vehicleTypeDemoData[1],
     inspections: [],

src/demodata/wearable.ts

@@ -7,6 +7,8 @@ export const wearableDemoData: Array<WearableViewModel> = [
     code: "0456984224498",
     name: "Jacke",
     location: "Spint",
+    commissioned: new Date(),
+    decommissioned: undefined,
     wearerId: "9469991d-fa22-4899-82ce-b1ba5de990dc",
     wearer: {
       id: "9469991d-fa22-4899-82ce-b1ba5de990dc",

src/viewmodels/admin/unit/equipment/equipment.models.ts

@@ -6,6 +6,8 @@ export interface EquipmentViewModel {
   code?: string;
   name: string;
   location: string;
+  commissioned: Date;
+  decommissioned?: Date;
   equipmentTypeId: string;
   equipmentType: EquipmentTypeViewModel;
   inspections: Array<InspectionViewModel>;
@@ -15,6 +17,7 @@ export interface CreateEquipmentViewModel {
   code?: string;
   name: string;
   location: string;
+  commissioned: Date;
   equipmentTypeId: string;
 }
 
@@ -23,4 +26,6 @@ export interface UpdateEquipmentViewModel {
   code?: string;
   name: string;
   location: string;
+  commissioned: Date;
+  decommissioned?: Date;
 }

src/viewmodels/admin/unit/inspection/inspection.models.ts

@@ -26,6 +26,7 @@ export interface InspectionPointViewModel {
   title: string;
   description: string;
   type: "iO-niO" | "text" | "number";
+  min?: number;
 }
 
 export interface InspectionPointResultViewModel {

src/viewmodels/admin/unit/vehicle/vehicle.models.ts

@@ -6,6 +6,8 @@ export interface VehicleViewModel {
   code?: string;
   name: string;
   location: string;
+  commissioned: Date;
+  decommissioned?: Date;
   vehicleTypeId: string;
   vehicleType: VehicleTypeViewModel;
   inspections: Array<InspectionViewModel>;
@@ -15,6 +17,7 @@ export interface CreateVehicleViewModel {
   code?: string;
   name: string;
   location: string;
+  commissioned: Date;
   vehicleTypeId: string;
 }
 
@@ -23,4 +26,6 @@ export interface UpdateVehicleViewModel {
   code?: string;
   name: string;
   location: string;
+  commissioned: Date;
+  decommissioned?: Date;
 }

src/viewmodels/admin/unit/wearable/wearable.models.ts

@@ -5,7 +5,9 @@ export interface WearableViewModel {
   id: string;
   code?: string;
   name: string;
-  location?: string;
+  location: string;
+  commissioned: Date;
+  decommissioned?: Date;
   wearerId?: string;
   wearer?: MemberViewModel;
   wearableTypeId: string;
@@ -17,6 +19,7 @@ export interface CreateWearableViewModel {
   name: string;
   wearerId?: string;
   location?: string;
+  commissioned: Date;
   wearableTypeId: string;
 }
 
@@ -25,5 +28,7 @@ export interface UpdateWearableViewModel {
   code?: string;
   name: string;
   location?: string;
+  commissioned: Date;
+  decommissioned?: Date;
   wearerId?: string;
 }

src/views/admin/unit/damageReport/DamageReportRouting.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Schadensmeldungen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Schadensmeldungen">
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">
         <div class="flex flex-col grow gap-2 overflow-hidden">

src/views/admin/unit/equipment/CreateEquipment.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Ausrüstung erfassen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Ausrüstung erfassen">
     <template #diffMain>
       <div class="flex flex-col gap-2 h-full w-full overflow-y-auto">
         <form class="flex flex-col gap-4 py-2 w-full max-w-xl mx-auto" @submit.prevent="triggerCreate">
@@ -14,6 +9,10 @@
             <input type="text" id="name" required />
           </div>
           <ScanInput name="code" label="Code" :required="false" />
+          <div>
+            <label for="commissioned">In-Betrieb-Nahme</label>
+            <input type="date" id="commissioned" required />
+          </div>
           <div>
             <label for="location">Verortung (optional)</label>
             <input type="text" id="location" />
@@ -81,6 +80,7 @@ export default defineComponent({
         name: formData.name.value,
         location: formData.location.value,
         equipmentTypeId: this.selectedType,
+        commissioned: formData.commissioned.value,
       };
       this.status = "loading";
       this.createEquipment(createEquipment)

src/views/admin/unit/equipment/Equipment.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Gerätschaften</h1>
-      </div>
-    </template>
+  <MainTemplate title="Gerätschaften">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/equipment/EquipmentRouting.vue

@@ -1,18 +1,12 @@
 <template>
-  <MainTemplate>
+  <MainTemplate :title="activeEquipmentObj?.name">
     <template #headerInsert>
       <RouterLink to="../" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          {{ activeEquipmentObj?.name }}
-        </h1>
-
-        <RouterLink v-if="can('update', 'unit', 'equipment')" :to="{ name: 'admin-unit-equipment-edit' }">
-          <PencilIcon class="w-5 h-5" />
-        </RouterLink>
-      </div>
+      <RouterLink v-if="can('update', 'unit', 'equipment')" :to="{ name: 'admin-unit-equipment-edit' }">
+        <PencilIcon class="w-5 h-5" />
+      </RouterLink>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/equipment/Overview.vue

@@ -17,6 +17,14 @@
         <label for="location">Verortung</label>
         <input type="text" id="location" :value="activeEquipmentObj.location" readonly />
       </div>
+      <div>
+        <label for="commissioned">In-Betrieb-Nahme</label>
+        <input type="date" id="commissioned" :value="activeEquipmentObj.commissioned" readonly />
+      </div>
+      <div>
+        <label for="decommissioned">Außer-Betrieb-Nahme</label>
+        <input type="date" id="decommissioned" :value="activeEquipmentObj.decommissioned" readonly />
+      </div>
     </div>
 
     <Spinner v-if="loadingActive == 'loading'" class="mx-auto" />

src/views/admin/unit/equipment/UpdateEquipment.vue

@@ -17,6 +17,14 @@
         <label for="location">Verortung (optional)</label>
         <input type="text" id="location" v-model="equipment.location" />
       </div>
+      <div>
+        <label for="commissioned">In-Betrieb-Nahme</label>
+        <input type="date" id="commissioned" required v-model="equipment.commissioned" />
+      </div>
+      <div>
+        <label for="decommissioned">Außer-Betrieb-Nahme (optional)</label>
+        <input type="date" id="decommissioned" v-model="equipment.decommissioned" />
+      </div>
       <div class="flex flex-row justify-end gap-2">
         <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
           abbrechen
@@ -98,6 +106,8 @@ export default defineComponent({
         code: formData.code.value || null,
         name: formData.name.value,
         location: formData.location.value,
+        commissioned: formData.commissioned.value,
+        decommissioned: formData.decommissioned.value ?? null,
       };
       this.status = "loading";
       this.updateActiveEquipment(updateEquipment)

src/views/admin/unit/equipmentType/EquipmentType.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Geräte-Typen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Geräte-Typen">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/equipmentType/EquipmentTypeRouting.vue

@@ -1,14 +1,10 @@
 <template>
-  <MainTemplate>
+  <MainTemplate :title="activeEquipmentTypeObj?.type">
     <template #headerInsert>
       <RouterLink :to="{ name: 'admin-unit-equipment_type' }" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          {{ activeEquipmentTypeObj?.type }}
-        </h1>
-
+      <div class="flex flex-row gap-2">
         <RouterLink v-if="can('update', 'unit', 'equipment_type')" :to="{ name: 'admin-unit-equipment_type-edit' }">
           <PencilIcon class="w-5 h-5" />
         </RouterLink>

src/views/admin/unit/inspection/InspectionExecute.vue

@@ -1,11 +1,9 @@
 <template>
   <MainTemplate>
     <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl min-h-8">
-          Prüfung durchführen: {{ activeInspectionObj?.related.name }} - {{ activeInspectionObj?.inspectionPlan.title }}
-        </h1>
-      </div>
+      <h1 class="font-bold text-xl min-h-8">
+        Prüfung durchführen: {{ activeInspectionObj?.related.name }} - {{ activeInspectionObj?.inspectionPlan.title }}
+      </h1>
     </template>
     <template #main>
       <Spinner v-if="loading == 'loading'" class="mx-auto" />

src/views/admin/unit/inspection/InspectionPlan.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Prüfung erstellen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Prüfung erstellen">
     <template #main>
       <form class="flex flex-col gap-4 py-2 w-full max-w-xl mx-auto" @submit.prevent="">
         <div class="flex flex-row">

src/views/admin/unit/inspectionPlan/CreateInspectionPlan.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Prüfplan erstellen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Prüfplan erstellen">
     <template #diffMain>
       <div class="flex flex-col gap-2 h-full w-full overflow-y-auto">
         <form class="flex flex-col gap-4 py-2 w-full max-w-xl mx-auto" @submit.prevent="triggerCreate">

src/views/admin/unit/inspectionPlan/InspectionPlan.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Prüfpläne</h1>
-      </div>
-    </template>
+  <MainTemplate title="Prüfpläne">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/inspectionPlan/InspectionPlanRouting.vue

@@ -1,18 +1,12 @@
 <template>
-  <MainTemplate>
+  <MainTemplate :title="activeInspectionPlanObj?.title">
     <template #headerInsert>
       <RouterLink to="./" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          {{ activeInspectionPlanObj?.title }}
-        </h1>
-
-        <RouterLink v-if="can('update', 'unit', 'inspection_plan')" :to="{ name: 'admin-unit-inspection_plan-edit' }">
-          <PencilIcon class="w-5 h-5" />
-        </RouterLink>
-      </div>
+      <RouterLink v-if="can('update', 'unit', 'inspection_plan')" :to="{ name: 'admin-unit-inspection_plan-edit' }">
+        <PencilIcon class="w-5 h-5" />
+      </RouterLink>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/respiratoryGear/RespiratoryGear.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Atemschutz-Geräte</h1>
-      </div>
-    </template>
+  <MainTemplate title="Atemschutz-Geräte">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/respiratoryGear/RespiratoryGearRouting.vue

@@ -4,19 +4,17 @@
       <RouterLink to="../" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">AGT-Gerät: {{ activeRespiratoryGearObj?.equipment.name }}</h1>
+      <h1 class="font-bold text-xl h-8 min-h-fit">AGT-Gerät: {{ activeRespiratoryGearObj?.equipment.name }}</h1>
 
-        <RouterLink
-          v-if="can('read', 'unit', 'equipment')"
-          :to="{
-            name: 'admin-unit-equipment-overview',
-            params: { equipmentId: activeRespiratoryGearObj?.equipment.id ?? '_' },
-          }"
-        >
-          <ArrowTopRightOnSquareIcon class="w-5 h-5" />
-        </RouterLink>
-      </div>
+      <RouterLink
+        v-if="can('read', 'unit', 'equipment')"
+        :to="{
+          name: 'admin-unit-equipment-overview',
+          params: { equipmentId: activeRespiratoryGearObj?.equipment.id ?? '_' },
+        }"
+      >
+        <ArrowTopRightOnSquareIcon class="w-5 h-5" />
+      </RouterLink>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/respiratoryMission/RespiratoryMission.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Atemschutz-Einsätze</h1>
-      </div>
-    </template>
+  <MainTemplate title="Atemschutz-Einsätze">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/respiratoryMission/RespiratoryMissionRouting.vue

@@ -4,9 +4,7 @@
       <RouterLink to="../" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">AGT-Einsatz: {{ activeRespiratoryMissionObj?.title }}</h1>
-      </div>
+      <h1 class="font-bold text-xl h-8 min-h-fit">AGT-Einsatz: {{ activeRespiratoryMissionObj?.title }}</h1>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/respiratoryWearer/RespiratoryWearer.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Atemschutz-Träger</h1>
-      </div>
-    </template>
+  <MainTemplate title="Atemschutz-Träger">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/respiratoryWearer/RespiratoryWearerRouting.vue

@@ -4,12 +4,10 @@
       <RouterLink to="../" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          AGT-Träger: {{ activeRespiratoryWearerObj?.member.lastname }},
-          {{ activeRespiratoryWearerObj?.member.firstname }}
-        </h1>
-      </div>
+      <h1 class="font-bold text-xl h-8 min-h-fit grow">
+        AGT-Träger: {{ activeRespiratoryWearerObj?.member.lastname }},
+        {{ activeRespiratoryWearerObj?.member.firstname }}
+      </h1>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/vehicle/CreateVehicle.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Fahrzeug erfassen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Fahrzeug erfassen">
     <template #diffMain>
       <div class="flex flex-col gap-2 h-full w-full overflow-y-auto">
         <form class="flex flex-col gap-4 py-2 w-full max-w-xl mx-auto" @submit.prevent="triggerCreate">
@@ -14,6 +9,10 @@
             <input type="text" id="name" required />
           </div>
           <ScanInput name="code" label="Code" :required="false" />
+          <div>
+            <label for="commissioned">In-Betrieb-Nahme</label>
+            <input type="date" id="commissioned" required />
+          </div>
           <div>
             <label for="location">Verortung (optional)</label>
             <input type="text" id="location" />
@@ -80,6 +79,7 @@ export default defineComponent({
         code: formData.code.value || null,
         location: formData.location.value,
         vehicleTypeId: this.selectedType,
+        commissioned: formData.commissioned.value,
       };
       this.status = "loading";
       this.createVehicle(createVehicle)

src/views/admin/unit/vehicle/Overview.vue

@@ -17,6 +17,14 @@
         <label for="location">Verortung</label>
         <input type="text" id="location" :value="activeVehicleObj.location" readonly />
       </div>
+      <div>
+        <label for="commissioned">In-Betrieb-Nahme</label>
+        <input type="date" id="commissioned" :value="activeVehicleObj.commissioned" readonly />
+      </div>
+      <div>
+        <label for="decommissioned">Außer-Betrieb-Nahme</label>
+        <input type="date" id="decommissioned" :value="activeVehicleObj.decommissioned" readonly />
+      </div>
     </div>
 
     <Spinner v-if="loadingActive == 'loading'" class="mx-auto" />

src/views/admin/unit/vehicle/UpdateVehicle.vue

@@ -17,6 +17,14 @@
         <label for="location">Verortung (optional)</label>
         <input type="text" id="location" />
       </div>
+      <div>
+        <label for="commissioned">In-Betrieb-Nahme</label>
+        <input type="date" id="commissioned" required v-model="vehicle.commissioned" />
+      </div>
+      <div>
+        <label for="decommissioned">Außer-Betrieb-Nahme (optional)</label>
+        <input type="date" id="decommissioned" v-model="vehicle.decommissioned" />
+      </div>
       <div class="flex flex-row justify-end gap-2">
         <RouterLink
           :to="{ name: 'admin-unit-vehicle' }"
@@ -100,6 +108,8 @@ export default defineComponent({
         name: formData.name.value,
         code: formData.code.value || null,
         location: formData.location.value,
+        commissioned: formData.commissioned.value,
+        decommissioned: formData.decommissioned.value ?? null,
       };
       this.status = "loading";
       this.updateActiveVehicle(updateVehicle)

src/views/admin/unit/vehicle/Vehicle.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Fahrzeuge</h1>
-      </div>
-    </template>
+  <MainTemplate title="Fahrzeuge">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/vehicle/VehicleRouting.vue

@@ -1,18 +1,12 @@
 <template>
-  <MainTemplate>
+  <MainTemplate :title="activeVehicleObj?.name">
     <template #headerInsert>
       <RouterLink to="../" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          {{ activeVehicleObj?.name }}
-        </h1>
-
-        <RouterLink v-if="can('update', 'unit', 'vehicle')" :to="{ name: 'admin-unit-vehicle-edit' }">
-          <PencilIcon class="w-5 h-5" />
-        </RouterLink>
-      </div>
+      <RouterLink v-if="can('update', 'unit', 'vehicle')" :to="{ name: 'admin-unit-vehicle-edit' }">
+        <PencilIcon class="w-5 h-5" />
+      </RouterLink>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/vehicleType/VehicleType.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Geräte-Typen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Geräte-Typen">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/vehicleType/VehicleTypeRouting.vue

@@ -1,14 +1,10 @@
 <template>
-  <MainTemplate>
+  <MainTemplate :title="activeVehicleTypeObj?.type">
     <template #headerInsert>
       <RouterLink :to="{ name: 'admin-unit-vehicle_type' }" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          {{ activeVehicleTypeObj?.type }}
-        </h1>
-
+      <div class="flex flex-row gap-2">
         <RouterLink v-if="can('update', 'unit', 'vehicle_type')" :to="{ name: 'admin-unit-vehicle_type-edit' }">
           <PencilIcon class="w-5 h-5" />
         </RouterLink>

src/views/admin/unit/wearable/CreateWearable.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Kleidung erfassen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Kleidung erfassen">
     <template #diffMain>
       <div class="flex flex-col gap-2 h-full w-full overflow-y-auto">
         <form class="flex flex-col gap-4 py-2 w-full max-w-xl mx-auto" @submit.prevent="triggerCreate">
@@ -14,11 +9,15 @@
             <input type="text" id="name" required />
           </div>
           <ScanInput name="code" label="Code" :required="false" />
+          <div>
+            <label for="commissioned">In-Betrieb-Nahme</label>
+            <input type="date" id="commissioned" required />
+          </div>
           <div>
             <label for="location">Verortung (optional)</label>
             <input type="text" id="location" />
           </div>
-          <MemberSearchSelectSingle title="Träger (optional)" />
+          <MemberSearchSelectSingle title="Träger (optional)" v-model="wearer" />
           <div class="flex flex-row justify-end gap-2">
             <RouterLink
               :to="{ name: 'admin-unit-wearable' }"
@@ -62,6 +61,7 @@ export default defineComponent({
       status: null as null | "loading" | { status: "success" | "failed"; reason?: string },
       timeout: null as any,
       selectedType: "" as string,
+      wearer: "" as string,
     };
   },
   computed: {
@@ -82,8 +82,9 @@ export default defineComponent({
         code: formData.code.value || null,
         name: formData.name.value,
         location: formData.location.value,
-        wearerId: "",
+        wearerId: this.wearer,
         wearableTypeId: this.selectedType,
+        commissioned: formData.commissioned.value,
       };
       this.status = "loading";
       this.createWearable(createWearable)

src/views/admin/unit/wearable/Overview.vue

@@ -17,6 +17,14 @@
         <label for="location">Verortung</label>
         <input type="text" id="location" :value="activeWearableObj.location" readonly />
       </div>
+      <div>
+        <label for="commissioned">In-Betrieb-Nahme</label>
+        <input type="date" id="commissioned" :value="activeWearableObj.commissioned" readonly />
+      </div>
+      <div>
+        <label for="decommissioned">Außer-Betrieb-Nahme</label>
+        <input type="date" id="decommissioned" :value="activeWearableObj.decommissioned" readonly />
+      </div>
       <div>
         <label for="wearer">Träger</label>
         <input

src/views/admin/unit/wearable/UpdateWearable.vue

@@ -18,6 +18,14 @@
         <input type="text" id="location" v-model="wearable.location" />
       </div>
       <MemberSearchSelectMultiple title="Träger (optional)" />
+      <div>
+        <label for="commissioned">In-Betrieb-Nahme</label>
+        <input type="date" id="commissioned" required v-model="wearable.commissioned" />
+      </div>
+      <div>
+        <label for="decommissioned">Außer-Betrieb-Nahme (optional)</label>
+        <input type="date" id="decommissioned" v-model="wearable.decommissioned" />
+      </div>
       <div class="flex flex-row justify-end gap-2">
         <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
           abbrechen
@@ -100,6 +108,8 @@ export default defineComponent({
         code: formData.code.value || null,
         name: formData.name.value,
         location: formData.location.value,
+        commissioned: formData.commissioned.value,
+        decommissioned: formData.decommissioned.value ?? null,
       };
       this.status = "loading";
       this.updateActiveWearable(updateWearable)

src/views/admin/unit/wearable/Wearable.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Kleidungen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Kleidungen">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination

src/views/admin/unit/wearable/WearableRouting.vue

@@ -1,18 +1,12 @@
 <template>
-  <MainTemplate>
+  <MainTemplate :title="activeWearableObj?.name">
     <template #headerInsert>
       <RouterLink to="../" class="text-primary">zurück zur Liste</RouterLink>
     </template>
     <template #topBar>
-      <div class="flex flex-row gap-2 items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8 min-h-fit grow">
-          {{ activeWearableObj?.name }}
-        </h1>
-
-        <RouterLink v-if="can('update', 'unit', 'wearable')" :to="{ name: 'admin-unit-wearable-edit' }">
-          <PencilIcon class="w-5 h-5" />
-        </RouterLink>
-      </div>
+      <RouterLink v-if="can('update', 'unit', 'wearable')" :to="{ name: 'admin-unit-wearable-edit' }">
+        <PencilIcon class="w-5 h-5" />
+      </RouterLink>
     </template>
     <template #diffMain>
       <div class="flex flex-col gap-2 grow px-7 overflow-hidden">

src/views/admin/unit/wearableType/WearableType.vue

@@ -1,10 +1,5 @@
 <template>
-  <MainTemplate>
-    <template #topBar>
-      <div class="flex flex-row items-center justify-between pt-5 pb-3 px-7">
-        <h1 class="font-bold text-xl h-8">Kleidungs-Typen</h1>
-      </div>
-    </template>
+  <MainTemplate title="Kleidungs-Typen">
     <template #diffMain>
       <div class="flex flex-col w-full h-full gap-2 justify-center px-7">
         <Pagination