Enable Edit and View of Reports

This commit is contained in:
Julian Krauser 2025-07-17 10:37:40 +02:00
parent 5ea5a0160a
commit 31b7ec9c3e
10 changed files with 162 additions and 56 deletions

View file

@ -4,21 +4,36 @@
:items="damageReports"
:totalCount="totalCount"
:indicateLoading="false"
@load-data="(offset, count, search) => {}"
@search="(search) => {}"
@load-data="(offset, count, search) => fetchDamageReportForWearable(offset, count, search)"
@search="(search) => fetchDamageReportForWearable(0, 25, search, true)"
>
<template #pageRow="{ row }: { row: DamageReportViewModel }">
<div class="flex flex-col h-fit w-full border border-primary rounded-md">
<RouterLink
:to="{ name: 'admin-unit-damage_report-overview', params: { damageReportId: 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.done" class="w-5 h-5" />
<PhotoIcon v-if="row.imageCount != 0" class="w-5 h-5" />
<p>{{ row.reportedAt }} - {{ row.status }}</p>
<p class="grow">{{ row.reportedAt }} - {{ row.status }}</p>
<div class="flex flex-row gap-2">
<div v-if="row.images.length != 0" class="cursor-pointer">
<PhotoIcon class="w-5 h-5" />
</div>
<div v-if="row.location" class="cursor-pointer">
<MapPinIcon class="w-5 h-5" />
</div>
<div v-if="row.reportedBy" class="cursor-pointer">
<UserIcon class="w-5 h-5" />
</div>
<div v-if="row.maintenance" class="cursor-pointer">
<WrenchScrewdriverIcon class="w-5 h-5" />
</div>
</div>
</div>
<div class="p-2">
<p v-if="row.reportedBy">gemeldet von: {{ row.reportedBy }}</p>
<p>Beschreibung: {{ row.description }}</p>
</div>
</div>
</RouterLink>
</template>
</Pagination>
</div>
@ -31,7 +46,7 @@ import { useAbilityStore } from "@/stores/ability";
import { useWearableDamageReportStore } from "@/stores/admin/unit/wearable/damageReport";
import Pagination from "@/components/Pagination.vue";
import type { DamageReportViewModel } from "@/viewmodels/admin/unit/damageReport.models";
import { PhotoIcon, PencilSquareIcon } from "@heroicons/vue/24/outline";
import { PhotoIcon, PencilSquareIcon, MapPinIcon, WrenchScrewdriverIcon, UserIcon } from "@heroicons/vue/24/outline";
</script>
<script lang="ts">
@ -44,13 +59,10 @@ export default defineComponent({
...mapState(useWearableDamageReportStore, ["damageReports", "loading", "totalCount"]),
},
mounted() {
this.fetchItem();
this.fetchDamageReportForWearable(0, 25, "", true);
},
methods: {
...mapActions(useWearableDamageReportStore, ["fetchDamageReportForWearable"]),
fetchItem() {
this.fetchDamageReportForWearable();
},
},
});
</script>