src/components/admin/unit/inspection/FileInput.vue

@@ -13,6 +13,7 @@
         type="button"
         class="flex flex-row gap-2"
         @click="($refs.fileInput as HTMLInputElement).click()"
+        :disabled="!editable"
       >
         <span v-if="value == ''">Datei wählen</span><span v-else>Datei gewählt</span>
         <CheckIcon v-if="value != ''" class="h-5 w-5" />
@@ -47,6 +48,10 @@ export default defineComponent({
       type: String,
       default: "",
     },
+    editable: {
+      type: Boolean,
+      default: true,
+    },
   },
   emits: {
     "update:model-value": (p: string) => {

src/components/admin/unit/inspection/NumberInput.vue

@@ -16,7 +16,8 @@
         v-model="value"
         :min="inspectionPoint.min"
         :max="inspectionPoint.max"
-        :class="{ 'ring-red-500! ring-1!': isInRange }"
+        :class="{ 'ring-red-500! ring-1!': isInRange && editable }"
+        :disabled="!editable"
       />
     </div>
   </div>
@@ -38,6 +39,10 @@ export default defineComponent({
       type: String,
       default: "",
     },
+    editable: {
+      type: Boolean,
+      default: true,
+    },
   },
   emits: ["update:model-value"],
   computed: {

src/components/admin/unit/inspection/OkNotOk.vue

@@ -6,7 +6,7 @@
     <div class="p-2">
       <p v-if="inspectionPoint.description" class="pb-2">Beschreibung: {{ inspectionPoint.description }}</p>
       <hr v-if="inspectionPoint.description" />
-      <RadioGroup v-model="value" :name="inspectionPoint.id" class="flex flex-row gap-2">
+      <RadioGroup v-model="value" :name="inspectionPoint.id" class="flex flex-row gap-2" :disabled="!editable">
         <RadioGroupOption
           v-for="option in options"
           :key="option.key"
@@ -39,6 +39,10 @@ export default defineComponent({
       type: String as PropType<"true" | "false" | "">,
       default: "",
     },
+    editable: {
+      type: Boolean,
+      default: true,
+    },
   },
   emits: ["update:model-value"],
   data() {

src/components/admin/unit/inspection/TextInput.vue

@@ -11,8 +11,9 @@
         :id="inspectionPoint.id"
         :name="inspectionPoint.id"
         class="h-18"
-        :class="{ 'ring-red-500! ring-1!': value == '' }"
+        :class="{ 'ring-red-500! ring-1!': value == '' && editable }"
         v-model="value"
+        :disabled="!editable"
       ></textarea>
     </div>
   </div>
@@ -34,6 +35,10 @@ export default defineComponent({
       type: String,
       default: "",
     },
+    editable: {
+      type: Boolean,
+      default: true,
+    },
   },
   emits: ["update:model-value"],
   computed: {

src/router/index.ts

@@ -930,12 +930,12 @@ const router = createRouter({
                     {
                       path: "next",
                       name: "admin-unit-inspection",
-                      component: () => import("@/views/admin/unit/inspection/NextInspection.vue"),
+                      component: () => import("@/views/admin/unit/inspection/NextInspections.vue"),
                     },
                     {
                       path: "running",
                       name: "admin-unit-inspection-running",
-                      component: () => import("@/views/admin/unit/inspection/NextInspection.vue"),
+                      component: () => import("@/views/admin/unit/inspection/RunningInspections.vue"),
                     },
                   ],
                 },

src/stores/admin/unit/inspection/inspection.ts

@@ -3,19 +3,77 @@ import { http } from "@/serverCom";
 import type { AxiosResponse } from "axios";
 import type {
   CreateInspectionViewModel,
+  InspectionNextViewModel,
   InspectionViewModel,
+  MinifiedInspectionViewModel,
   UpdateInspectionViewModel,
 } from "@/viewmodels/admin/unit/inspection/inspection.models";
 
 export const useInspectionStore = defineStore("inspection", {
   state: () => {
     return {
+      inspections: [] as Array<MinifiedInspectionViewModel & { tab_pos: number }>,
+      totalCount: 0 as number,
+      loading: "loading" as "loading" | "fetched" | "failed",
+      nextInspections: [] as Array<InspectionNextViewModel & { tab_pos: number }>,
+      nextTotalCount: 0 as number,
+      nextLoading: "loading" as "loading" | "fetched" | "failed",
       activeInspection: null as string | null,
       activeInspectionObj: null as InspectionViewModel | null,
       loadingActive: "loading" as "loading" | "fetched" | "failed",
     };
   },
   actions: {
+    fetchRunningInspections(offset = 0, count = 25, search = "", clear = false) {
+      if (clear) this.inspections = [];
+      this.loading = "loading";
+      http
+        .get(`/admin/inspection/running?offset=${offset}&count=${count}${search != "" ? "&search=" + search : ""}`)
+        .then((result) => {
+          this.totalCount = result.data.total;
+          result.data.inspections
+            .filter((elem: MinifiedInspectionViewModel) => this.inspections.findIndex((m) => m.id == elem.id) == -1)
+            .map(
+              (elem: MinifiedInspectionViewModel, index: number): MinifiedInspectionViewModel & { tab_pos: number } => {
+                return {
+                  ...elem,
+                  tab_pos: index + offset,
+                };
+              }
+            )
+            .forEach((elem: MinifiedInspectionViewModel & { tab_pos: number }) => {
+              this.inspections.push(elem);
+            });
+          this.loading = "fetched";
+        })
+        .catch((err) => {
+          this.loading = "failed";
+        });
+    },
+    fetchNextInspections(offset = 0, count = 25, search = "", clear = false) {
+      if (clear) this.nextInspections = [];
+      this.nextLoading = "loading";
+      http
+        .get(`/admin/inspection/next?offset=${offset}&count=${count}${search != "" ? "&search=" + search : ""}`)
+        .then((result) => {
+          this.nextTotalCount = result.data.total;
+          result.data.inspections
+            .filter((elem: InspectionNextViewModel) => this.nextInspections.findIndex((m) => m.id == elem.id) == -1)
+            .map((elem: InspectionNextViewModel, index: number): InspectionNextViewModel & { tab_pos: number } => {
+              return {
+                ...elem,
+                tab_pos: index + offset,
+              };
+            })
+            .forEach((elem: InspectionNextViewModel & { tab_pos: number }) => {
+              this.nextInspections.push(elem);
+            });
+          this.nextLoading = "fetched";
+        })
+        .catch((err) => {
+          this.nextLoading = "failed";
+        });
+    },
     fetchInspectionByActiveId() {
       this.loadingActive = "loading";
       http

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

@@ -7,18 +7,7 @@ import type {
 import type { VehicleViewModel } from "../vehicle/vehicle.models";
 import type { WearableViewModel } from "../wearable/wearable.models";
 
-export type InspectionViewModel = {
+export type InspectionRelated = {
-  id: string;
-  inspectionPlanId: string;
-  inspectionPlan: InspectionPlanViewModel;
-  inspectionVersionedPlanId: string;
-  inspectionVersionedPlan: InspectionVersionedPlanViewModel;
-  context: string;
-  created: Date;
-  finished?: Date;
-  isOpen: boolean;
-  nextInspection?: Date;
-  checks: Array<InspectionPointResultViewModel>;
   relatedId: string;
 } & (
   | {
@@ -35,6 +24,41 @@ export type InspectionViewModel = {
     }
 );
 
+export type InspectionViewModel = {
+  id: string;
+  inspectionPlanId: string;
+  inspectionPlan: InspectionPlanViewModel;
+  inspectionVersionedPlanId: string;
+  inspectionVersionedPlan: InspectionVersionedPlanViewModel;
+  context: string;
+  created: Date;
+  finished?: Date;
+  isOpen: boolean;
+  nextInspection?: Date;
+  checks: Array<InspectionPointResultViewModel>;
+  relatedId: string;
+} & InspectionRelated;
+
+export type MinifiedInspectionViewModel = {
+  id: string;
+  inspectionPlanId: string;
+  inspectionPlan: InspectionPlanViewModel;
+  context: string;
+  created: Date;
+  finished?: Date;
+  isOpen: boolean;
+  nextInspection?: Date;
+  relatedId: string;
+} & InspectionRelated;
+
+export type InspectionNextViewModel = {
+  id: string;
+  inspectionPlanId: string;
+  inspectionPlan: InspectionPlanViewModel;
+  dueDate: Date;
+  relatedId: string;
+} & InspectionRelated;
+
 export interface InspectionPointResultViewModel {
   inspectionId: string;
   inspectionPointId: string;

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

@@ -14,9 +14,9 @@
         >
           <div class="bg-primary p-2 text-white flex flex-row gap-2 items-center">
             <PencilSquareIcon v-if="row.isOpen" class="w-5 h-5" />
-            <p>{{ row.inspectionPlan.title }} - {{ row.finished }}</p>
+            <p>{{ row.inspectionPlan.title }} - {{ row.finished ?? "in Arbeit" }}</p>
           </div>
-          <div class="p-2">
+          <div v-if="row.context || row.nextInspection" class="p-2">
             <p v-if="row.context">Kontext: {{ row.context }}</p>
             <p v-if="row.nextInspection">nächste Inspektion: {{ row.nextInspection }}</p>
           </div>
@@ -30,9 +30,9 @@
         button
         primary
         class="w-fit!"
-        @click=""
-        >Prüfung durchführen</RouterLink
       >
+        Prüfung durchführen
+      </RouterLink>
     </div>
   </div>
 </template>

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

@@ -14,36 +14,45 @@
         v-else-if="activeInspectionObj != null"
         class="flex flex-col gap-4 py-2 grow w-full max-w-xl mx-auto overflow-hidden"
       >
+        <div>
+          <p>Kontext:</p>
+          <textarea readonly :value="activeInspectionObj.context || '---'" class="h-18"></textarea>
+        </div>
+
         <div class="flex flex-col gap-2 grow overflow-y-scroll">
           <div v-for="point in points" :key="point.title" class="contents">
             <OkNotOk
               v-if="point.type == InspectionPointEnum.oknok"
               :inspectionPoint="point"
+              :editable="activeInspectionObj.isOpen"
               :modelValue="boolPointResult(point.id)"
               @update:model-value="(val) => updateCheckResult(point.id, val)"
             />
             <NumberInput
               v-else-if="point.type == InspectionPointEnum.number"
               :inspectionPoint="point"
+              :editable="activeInspectionObj.isOpen"
               :modelValue="pointResult(point.id)"
               @update:model-value="(val) => updateCheckResult(point.id, val)"
             />
             <TextInput
               v-else-if="point.type == InspectionPointEnum.text"
               :inspectionPoint="point"
+              :editable="activeInspectionObj.isOpen"
               :modelValue="pointResult(point.id)"
               @update:model-value="(val) => updateCheckResult(point.id, val)"
             />
             <FileInput
               v-else-if="point.type == InspectionPointEnum.file"
               :inspectionPoint="point"
+              :editable="activeInspectionObj.isOpen"
               :modelValue="pointResult(point.id)"
               @update:model-value="(val) => updateCheckResult(point.id, val)"
               @update:upload="(val) => (fileStore[point.id] = val)"
             />
           </div>
         </div>
-        <div class="flex flex-row justify-end flex-wrap min-h-fit gap-2">
+        <div v-if="activeInspectionObj.isOpen" class="flex flex-row justify-end flex-wrap min-h-fit gap-2">
           <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
             verwerfen
           </button>
@@ -69,6 +78,9 @@
           <SuccessCheckmark v-else-if="status?.status == 'success'" />
           <FailureXMark v-else-if="status?.status == 'failed'" />
         </div>
+        <div v-else>
+          <button primary type="button" @click="">Bericht anzeigen</button>
+        </div>
       </div>
     </template>
   </MainTemplate>

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

@@ -1,45 +0,0 @@
-<template>
-  <div class="flex flex-col w-full h-full gap-2 justify-center">
-    <Pagination
-      :items="[]"
-      :totalCount="0"
-      :indicateLoading="false"
-      @load-data="(offset, count, search) => {}"
-      @search="(search) => {}"
-    >
-      <template #pageRow="{ row }: { row: any }">
-        {{ row }}
-      </template>
-    </Pagination>
-
-    <div class="flex flex-row gap-4">
-      <RouterLink
-        v-if="can('create', 'unit', 'inspection')"
-        :to="{ name: 'admin-unit-inspection-start' }"
-        primary
-        button
-        class="w-fit!"
-      >
-        Prüfung starten
-      </RouterLink>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { defineComponent } from "vue";
-import { mapActions, mapState } from "pinia";
-import Pagination from "@/components/Pagination.vue";
-import { useAbilityStore } from "@/stores/ability";
-</script>
-
-<script lang="ts">
-export default defineComponent({
-  data() {
-    return {};
-  },
-  computed: {
-    ...mapState(useAbilityStore, ["can"]),
-  },
-});
-</script>

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

@@ -0,0 +1,69 @@
+<template>
+  <div class="flex flex-col w-full h-full gap-2 justify-center">
+    <Pagination
+      :items="nextInspections"
+      :totalCount="nextTotalCount"
+      :indicateLoading="nextLoading == 'loading'"
+      @load-data="(offset, count, search) => fetchNextInspections(offset, count, search)"
+      @search="(search) => fetchNextInspections(0, maxEntriesPerPage, search, true)"
+    >
+      <template #pageRow="{ row }: { row: InspectionNextViewModel }">
+        <RouterLink
+          :to="{
+            name: 'admin-unit-inspection-start',
+            params: { type: row.assigned, relatedId: row.relatedId, inspectionPlanId: row.inspectionPlanId },
+          }"
+          class="flex flex-col h-fit w-full border border-primary rounded-md"
+        >
+          <div class="bg-primary p-2 text-white flex flex-row gap-2 items-center">
+            <p>
+              {{ row.related.name }} <small v-if="row.related.code">({{ row.related.code }})</small> -
+              {{ row.inspectionPlan.title }} - {{ row.dueDate ?? "ohne Fälligkeit" }}
+            </p>
+          </div>
+        </RouterLink>
+      </template>
+    </Pagination>
+
+    <div class="flex flex-row gap-4">
+      <RouterLink
+        v-if="can('create', 'unit', 'inspection')"
+        :to="{ name: 'admin-unit-inspection-start' }"
+        primary
+        button
+        class="w-fit!"
+      >
+        Prüfung starten
+      </RouterLink>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapActions, mapState } from "pinia";
+import Pagination from "@/components/Pagination.vue";
+import { useAbilityStore } from "@/stores/ability";
+import { useInspectionStore } from "@/stores/admin/unit/inspection/inspection";
+import type { InspectionNextViewModel } from "@/viewmodels/admin/unit/inspection/inspection.models";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  data() {
+    return {
+      maxEntriesPerPage: 25,
+    };
+  },
+  computed: {
+    ...mapState(useInspectionStore, ["nextInspections", "nextTotalCount", "nextLoading"]),
+    ...mapState(useAbilityStore, ["can"]),
+  },
+  mounted() {
+    this.fetchNextInspections(0, this.maxEntriesPerPage, "", true);
+  },
+  methods: {
+    ...mapActions(useInspectionStore, ["fetchNextInspections"]),
+  },
+});
+</script>

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

@@ -0,0 +1,68 @@
+<template>
+  <div class="flex flex-col w-full h-full gap-2 justify-center">
+    <Pagination
+      :items="inspections"
+      :totalCount="totalCount"
+      :indicateLoading="loading == 'loading'"
+      @load-data="(offset, count, search) => fetchRunningInspections(offset, count, search)"
+      @search="(search) => fetchRunningInspections(0, maxEntriesPerPage, search, true)"
+    >
+      <template #pageRow="{ row }: { row: MinifiedInspectionViewModel }">
+        <RouterLink
+          :to="{ name: 'admin-unit-inspection-execute', params: { inspectionId: row.id } }"
+          class="flex flex-col h-fit w-full border border-primary rounded-md"
+        >
+          <div class="bg-primary p-2 text-white flex flex-row gap-2 items-center">
+            <PencilSquareIcon v-if="row.isOpen" class="w-5 h-5" />
+            <p>{{ row.inspectionPlan.title }} - in Arbeit seit {{ row.created }}</p>
+          </div>
+          <div v-if="row.context" class="p-2">
+            <p v-if="row.context">Kontext: {{ row.context }}</p>
+          </div>
+        </RouterLink>
+      </template>
+    </Pagination>
+
+    <div class="flex flex-row gap-4">
+      <RouterLink
+        v-if="can('create', 'unit', 'inspection')"
+        :to="{ name: 'admin-unit-inspection-start' }"
+        primary
+        button
+        class="w-fit!"
+      >
+        Prüfung starten
+      </RouterLink>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import { mapActions, mapState } from "pinia";
+import Pagination from "@/components/Pagination.vue";
+import { useAbilityStore } from "@/stores/ability";
+import type { MinifiedInspectionViewModel } from "@/viewmodels/admin/unit/inspection/inspection.models";
+import { useInspectionStore } from "@/stores/admin/unit/inspection/inspection";
+import { PencilSquareIcon } from "@heroicons/vue/24/outline";
+</script>
+
+<script lang="ts">
+export default defineComponent({
+  data() {
+    return {
+      maxEntriesPerPage: 25,
+    };
+  },
+  computed: {
+    ...mapState(useInspectionStore, ["inspections", "totalCount", "loading"]),
+    ...mapState(useAbilityStore, ["can"]),
+  },
+  mounted() {
+    this.fetchRunningInspections(0, this.maxEntriesPerPage, "", true);
+  },
+  methods: {
+    ...mapActions(useInspectionStore, ["fetchRunningInspections"]),
+  },
+});
+</script>

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

@@ -14,9 +14,9 @@
         >
           <div class="bg-primary p-2 text-white flex flex-row gap-2 items-center">
             <PencilSquareIcon v-if="row.isOpen" class="w-5 h-5" />
-            <p>{{ row.inspectionPlan.title }} - {{ row.finished }}</p>
+            <p>{{ row.inspectionPlan.title }} - {{ row.finished ?? "in Arbeit" }}</p>
           </div>
-          <div class="p-2">
+          <div v-if="row.context || row.nextInspection" class="p-2">
             <p v-if="row.context">Kontext: {{ row.context }}</p>
             <p v-if="row.nextInspection">nächste Inspektion: {{ row.nextInspection }}</p>
           </div>
@@ -30,9 +30,9 @@
         button
         primary
         class="w-fit!"
-        @click=""
-        >Prüfung durchführen</RouterLink
       >
+        Prüfung durchführen
+      </RouterLink>
     </div>
   </div>
 </template>

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

@@ -14,9 +14,9 @@
         >
           <div class="bg-primary p-2 text-white flex flex-row gap-2 items-center">
             <PencilSquareIcon v-if="row.isOpen" class="w-5 h-5" />
-            <p>{{ row.inspectionPlan.title }} - {{ row.finished }}</p>
+            <p>{{ row.inspectionPlan.title }} - {{ row.finished ?? "in Arbeit" }}</p>
           </div>
-          <div class="p-2">
+          <div v-if="row.context || row.nextInspection" class="p-2">
             <p v-if="row.context">Kontext: {{ row.context }}</p>
             <p v-if="row.nextInspection">nächste Inspektion: {{ row.nextInspection }}</p>
           </div>
@@ -30,9 +30,9 @@
         button
         primary
         class="w-fit!"
-        @click=""
-        >Prüfung durchführen</RouterLink
       >
+        Prüfung durchführen
+      </RouterLink>
     </div>
   </div>
 </template>