69 lines
1.8 KiB
Vue
69 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
definePageMeta({
|
|
middleware: 'auth',
|
|
auth: { role: 'OPERATOR' }
|
|
})
|
|
|
|
useHead({ title: 'Segnalazioni Aperte - Operatore' })
|
|
|
|
const { getOpenReports, takeReport } = useOperator()
|
|
|
|
const page = ref(1)
|
|
const perPage = ref(10)
|
|
|
|
const { data: reportsRes, pending, refresh } = useAsyncData(
|
|
'operator-open-reports',
|
|
() => getOpenReports({ page: page.value, per_page: perPage.value }),
|
|
{ watch: [page] }
|
|
)
|
|
|
|
const handleTakeReport = async (id: number) => {
|
|
try {
|
|
const res = await takeReport(id)
|
|
if (res.ok) {
|
|
await refresh()
|
|
}
|
|
} catch (err) {
|
|
console.error('Failed to take report', err)
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="container my-5">
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h1 class="h3 font-weight-bold mb-0">Segnalazioni da prendere in carico (OPEN)</h1>
|
|
<div>
|
|
<NuxtLink to="/dashboard" class="btn btn-outline-secondary btn-sm me-2">Dashboard</NuxtLink>
|
|
<NuxtLink to="/operator/assigned" class="btn btn-outline-primary btn-sm">Le mie assegnazioni</NuxtLink>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="pending" class="text-center py-5">
|
|
<div class="spinner-border text-primary" role="status"></div>
|
|
</div>
|
|
|
|
<div v-else-if="!reportsRes?.reports || reportsRes.reports.length === 0" class="alert alert-info">
|
|
Non ci sono segnalazioni aperte in questo momento.
|
|
</div>
|
|
|
|
<div v-else>
|
|
<ReportTable
|
|
:reports="reportsRes.reports"
|
|
action-variant="manage"
|
|
detail-base-path="/operator/reports"
|
|
@take="handleTakeReport"
|
|
/>
|
|
|
|
<Pagination
|
|
v-if="reportsRes.total > perPage"
|
|
:current-page="page"
|
|
:per-page="perPage"
|
|
:total-items="reportsRes.total"
|
|
@page-change="page = $event"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|