60 lines
2.3 KiB
Vue
60 lines
2.3 KiB
Vue
<script setup lang="ts">
|
|
const { getOpenReports, getAssignedReports, takeReport } = useOperator()
|
|
|
|
const { data: openReportsRes, refresh: refreshOpen } = useAsyncData('open-reports', () => getOpenReports({ per_page: 5 }))
|
|
const { data: assignedReportsRes, refresh: refreshAssigned } = useAsyncData('assigned-reports', () => getAssignedReports({ per_page: 5 }))
|
|
|
|
const handleTakeReport = async (id: number) => {
|
|
const res = await takeReport(id)
|
|
if (res.ok) {
|
|
await Promise.all([refreshOpen(), refreshAssigned()])
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="row">
|
|
<!-- Colonna Sinistra: Segnalazioni da prendere in carico -->
|
|
<div class="col-12 col-lg-6 mb-4">
|
|
<h3 class="mb-3 border-bottom pb-2">Da prendere in carico (OPEN)</h3>
|
|
<div class="list-group">
|
|
<div v-if="openReportsRes?.ok && openReportsRes.reports.length === 0" class="text-muted">
|
|
Nessuna nuova segnalazione in ingresso.
|
|
</div>
|
|
<div
|
|
v-for="report in openReportsRes?.reports" :key="report.id"
|
|
class="list-group-item d-flex justify-content-between align-items-center"
|
|
>
|
|
<div>
|
|
<h6 class="mb-1">{{ report.address }}</h6>
|
|
<small class="text-muted">{{ report.created_at }}</small>
|
|
</div>
|
|
<button @click="handleTakeReport(report.id)" class="btn btn-outline-primary btn-sm">
|
|
Prendi in carico
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Colonna Destra: Segnalazioni in gestione dell'operatore -->
|
|
<div class="col-12 col-lg-6 mb-4">
|
|
<h3 class="mb-3 border-bottom pb-2">Le mie assegnazioni</h3>
|
|
<div class="list-group">
|
|
<div v-if="assignedReportsRes?.ok && assignedReportsRes.reports.length === 0" class="text-muted">
|
|
Non hai segnalazioni in carico.
|
|
</div>
|
|
<NuxtLink
|
|
v-for="report in assignedReportsRes?.reports" :key="report.id"
|
|
:to="`/operator/reports/${report.id}`"
|
|
class="list-group-item list-group-item-action d-flex justify-content-between align-items-center"
|
|
>
|
|
<div>
|
|
<h6 class="mb-1">{{ report.address }}</h6>
|
|
<StatusBadge :status="report.status" />
|
|
</div>
|
|
<BIIcon name="it-chevron-right" size="sm" color="primary" />
|
|
</NuxtLink>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template> |