14 changed files with 76 additions and 912 deletions
-60
View File
@@ -1,60 +0,0 @@
<script setup lang="ts">
const props = withDefaults(defineProps<{
open: boolean
title: string
message: string
confirmLabel?: string
cancelLabel?: string
confirmClass?: string
pending?: boolean
}>(), {
confirmLabel: 'Conferma',
cancelLabel: 'Annulla',
confirmClass: 'btn-danger',
pending: false,
})
const emit = defineEmits<{
cancel: []
confirm: []
}>()
const handleBackdropClick = (event: MouseEvent) => {
if (event.target === event.currentTarget && !props.pending) {
emit('cancel')
}
}
</script>
<template>
<div v-if="open">
<div class="modal-backdrop fade show d-block" style="background: rgba(0,0,0,0.5); z-index: 1040;"></div>
<div
class="modal fade show d-block"
tabindex="-1"
style="z-index: 1050;"
@click="handleBackdropClick"
>
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content shadow">
<div class="modal-header">
<h5 class="modal-title">{{ title }}</h5>
<button type="button" class="btn-close" :disabled="pending" @click="emit('cancel')"></button>
</div>
<div class="modal-body">
<p class="mb-0">{{ message }}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" :disabled="pending" @click="emit('cancel')">
{{ cancelLabel }}
</button>
<button type="button" class="btn" :class="confirmClass" :disabled="pending" @click="emit('confirm')">
<span v-if="pending" class="spinner-border spinner-border-sm me-2"></span>
{{ confirmLabel }}
</button>
</div>
</div>
</div>
</div>
</div>
</template>
+12 -22
View File
@@ -3,6 +3,7 @@ import type { Category, CreateReportRequest } from '~/types/api'
import type { LeafletMouseEvent, Map as LeafletMap, Marker as LeafletMarker } from 'leaflet'
import { onMounted, onUnmounted, ref, watch } from 'vue'
import { BARI_BOUNDS, BARI_CENTER, isWithinBariBounds } from '~/utils/bari'
import { reverseGeocode, searchAddresses } from '~/utils/geocoding'
interface Props {
isLoading?: boolean
@@ -19,14 +20,6 @@ interface GeocodingSuggestion {
longitude: number
}
interface SearchAddressesResponse {
suggestions: GeocodingSuggestion[]
}
interface ReverseGeocodeResponse {
address: string
}
const props = withDefaults(defineProps<Props>(), {
isLoading: false,
categories: () => []
@@ -123,18 +116,20 @@ const fetchAddressSuggestions = async (query: string) => {
addressSearchError.value = ''
try {
const response = await $fetch<SearchAddressesResponse>('/api/geocoding/search', {
query: { q: query }
})
if (requestId !== addressSearchRequestId) {
return
}
const suggestions = await searchAddresses(query)
if (requestId !== addressSearchRequestId) {
return
}
addressSuggestions.value = response.suggestions
showAddressSuggestions.value = response.suggestions.length > 0
addressSuggestions.value = suggestions
showAddressSuggestions.value = suggestions.length > 0
if (!response.suggestions.length) {
if (!suggestions.length) {
addressSearchError.value = 'Nessun indirizzo trovato nel Comune di Bari.'
}
} catch {
@@ -157,15 +152,11 @@ const resolveAddressFromCoordinates = async (lat: number, lng: number, fallbackA
addressSearchError.value = ''
try {
const response = await $fetch<ReverseGeocodeResponse>('/api/geocoding/reverse', {
query: { lat, lng }
})
if (requestId !== reverseGeocodeRequestId) {
return
}
const resolvedAddress = response.address?.trim() || fallbackAddress.trim()
const resolvedAddress = (await reverseGeocode(lat, lng))?.trim() || fallbackAddress.trim()
if (resolvedAddress) {
setAddressValue(resolvedAddress)
@@ -541,7 +532,7 @@ watch([() => form.value.latitude, () => form.value.longitude], ([newLat, newLng]
step="0.000001"
class="form-control form-control-sm"
:class="{ 'is-invalid': errors.location }"
placeholder="Latitudine (Bari)"
placeholder="Latitudine (es. 45.5)"
required
/>
</div>
@@ -552,7 +543,7 @@ watch([() => form.value.latitude, () => form.value.longitude], ([newLat, newLng]
step="0.000001"
class="form-control form-control-sm"
:class="{ 'is-invalid': errors.location }"
placeholder="Longitudine (Bari)"
placeholder="Longitudine (es. 10.2)"
required
/>
</div>
@@ -694,4 +685,3 @@ textarea {
align-items: center;
}
</style>
-25
View File
@@ -3,7 +3,6 @@ import type {
ModerationListResponse,
OkResponse,
OverviewStatsResponse, TeamListResponse, UpdateModerationRequest,
UpdateAreaRequest, UpdateCategoryRequest, UpdateTeamRequest,
UpdateUserBanRequest, UpdateUserRolesRequest,
UserListResponse
} from "~/types/api";
@@ -27,35 +26,17 @@ export const useAdmin = () => {
const createArea = (body: CreateAreaRequest) =>
useApiFetch<OkResponse>('/api/v1/admin/areas', { method: 'POST', body })
const updateArea = (id: number, body: UpdateAreaRequest) =>
useApiFetch<OkResponse>(`/api/v1/admin/areas/${id}`, { method: 'PATCH', body })
const deleteArea = (id: number) =>
useApiFetch<OkResponse>(`/api/v1/admin/areas/${id}`, { method: 'DELETE' })
const getCategories = () =>
useApiFetch<CategoryListResponse>('/api/v1/admin/categories', { method: 'GET' })
const createCategory = (body: CreateCategoryRequest) =>
useApiFetch<OkResponse>('/api/v1/admin/categories', { method: 'POST', body })
const updateCategory = (id: number, body: UpdateCategoryRequest) =>
useApiFetch<OkResponse>(`/api/v1/admin/categories/${id}`, { method: 'PATCH', body })
const deleteCategory = (id: number) =>
useApiFetch<OkResponse>(`/api/v1/admin/categories/${id}`, { method: 'DELETE' })
const getTeams = () =>
useApiFetch<TeamListResponse>('/api/v1/admin/teams', { method: 'GET' })
const createTeam = (body: CreateTeamRequest) =>
useApiFetch<OkResponse>('/api/v1/admin/teams', { method: 'POST', body })
const updateTeam = (id: number, body: UpdateTeamRequest) =>
useApiFetch<OkResponse>(`/api/v1/admin/teams/${id}`, { method: 'PATCH', body })
const deleteTeam = (id: number) =>
useApiFetch<OkResponse>(`/api/v1/admin/teams/${id}`, { method: 'DELETE' })
const getModerationFlags = (query?: { status?: string; page?: number; per_page?: number }) =>
useApiFetch<ModerationListResponse>('/api/v1/admin/moderation', { method: 'GET', query })
@@ -70,16 +51,10 @@ export const useAdmin = () => {
updateUserRoles,
getAreas,
createArea,
updateArea,
deleteArea,
getCategories,
createCategory,
updateCategory,
deleteCategory,
getTeams,
createTeam,
updateTeam,
deleteTeam,
getModerationFlags,
updateModerationFlag,
}
-9
View File
@@ -1,5 +1,4 @@
import type {
AssignmentLinkResponse,
AssignTeamRequest,
InterventionSummaryResponse,
OkResponse,
@@ -33,12 +32,6 @@ export const useOperator = () => {
const getInterventionSummary = (id: number) =>
useApiFetch<InterventionSummaryResponse>(`/api/v1/reports/${id}/intervention-summary`, { method: 'GET' })
const createInterventionLink = (id: number) =>
useApiFetch<AssignmentLinkResponse>(`/api/v1/reports/${id}/intervention-link`, { method: 'POST' })
const revokeInterventionLink = (id: number) =>
useApiFetch<OkResponse>(`/api/v1/reports/${id}/intervention-link`, { method: 'DELETE' })
return {
getOpenReports,
getAssignedReports,
@@ -48,7 +41,5 @@ export const useOperator = () => {
updateReportStatus,
assignTeam,
getInterventionSummary,
createInterventionLink,
revokeInterventionLink,
}
}
+15 -161
View File
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, reactive, nextTick, onBeforeUnmount, computed } from 'vue'
import { ref, reactive, nextTick, onBeforeUnmount } from 'vue'
import { BARI_BOUNDS, BARI_CENTER, isWithinBariBounds } from '~/utils/bari'
definePageMeta({
@@ -9,37 +9,23 @@ definePageMeta({
useHead({ title: 'Aree - Admin' })
const { getAreas, createArea, updateArea, deleteArea } = useAdmin()
const { getAreas, createArea } = useAdmin()
const { data: areasRes, pending, refresh } = useAsyncData('admin-areas', () => getAreas())
const isCreating = ref(false)
const editingAreaId = ref<number | null>(null)
const formData = reactive({
name: '',
description: '',
geojson: ''
})
const jsonError = ref('')
const actionError = ref('')
const deletingAreaId = ref<number | null>(null)
const areaPendingDelete = ref<any | null>(null)
// Map variables
let map: any = null
let polygon: any = null
const mapPoints = ref<[number, number][]>([])
const modalTitle = computed(() => editingAreaId.value ? 'Modifica Area' : 'Nuova Area')
const submitLabel = computed(() => editingAreaId.value ? 'Salva Modifiche' : 'Crea Area')
const isEditing = computed(() => editingAreaId.value !== null)
const areas = computed(() => areasRes.value?.areas || [])
const areaDeleteMessage = computed(() =>
areaPendingDelete.value ? `Vuoi eliminare area "${areaPendingDelete.value.name}"? Operazione irreversibile.` : ''
)
const openCreateModal = () => {
actionError.value = ''
editingAreaId.value = null
formData.name = ''
formData.description = ''
formData.geojson = ''
@@ -88,74 +74,6 @@ const openCreateModal = () => {
})
}
const loadPolygonFromGeoJson = (boundaryGeojson: any) => {
const coordinates = boundaryGeojson?.coordinates?.[0]
if (!Array.isArray(coordinates)) {
mapPoints.value = []
return
}
const normalized = coordinates
.slice(0, -1)
.map(([longitude, latitude]: [number, number]) => [latitude, longitude] as [number, number])
mapPoints.value = normalized
if (polygon) {
polygon.setLatLngs(mapPoints.value)
}
}
const openEditModal = (area: any) => {
actionError.value = ''
editingAreaId.value = area.id
formData.name = area.name || ''
formData.description = area.description || ''
formData.geojson = area.boundary_geojson ? JSON.stringify(area.boundary_geojson, null, 2) : ''
jsonError.value = ''
mapPoints.value = []
isCreating.value = true
nextTick(async () => {
const L = (await import('leaflet')).default
if (map) {
map.remove()
map = null
}
const bariBounds = L.latLngBounds(
[BARI_BOUNDS.south, BARI_BOUNDS.west],
[BARI_BOUNDS.north, BARI_BOUNDS.east]
)
map = L.map('areaMap', {
maxBounds: bariBounds,
maxBoundsViscosity: 1,
minZoom: 12
}).setView(BARI_CENTER, 12)
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© OpenStreetMap'
}).addTo(map)
polygon = L.polygon([], { color: 'red' }).addTo(map)
map.fitBounds(bariBounds)
loadPolygonFromGeoJson(area.boundary_geojson)
map.on('click', (e: any) => {
if (!isWithinBariBounds(e.latlng.lat, e.latlng.lng)) {
jsonError.value = 'Puoi disegnare aree solo entro confini del Comune di Bari.'
return
}
jsonError.value = ''
mapPoints.value.push([e.latlng.lat, e.latlng.lng])
polygon.setLatLngs(mapPoints.value)
updateGeojson()
})
})
}
const clearMap = () => {
mapPoints.value = []
if (polygon) {
@@ -182,7 +100,6 @@ const updateGeojson = () => {
const closeCreateModal = () => {
isCreating.value = false
editingAreaId.value = null
if (map) {
map.remove()
map = null
@@ -214,58 +131,19 @@ const handleCreate = async () => {
}
try {
const payload = {
const res = await createArea({
name: formData.name,
description: formData.description || undefined,
boundary_geojson: parsedGeojson
}
const res = editingAreaId.value
? await updateArea(editingAreaId.value, payload)
: await createArea(payload)
})
if (res.ok) {
await refresh()
closeCreateModal()
actionError.value = ''
}
} catch (err) {
console.error('Failed to save area', err)
actionError.value = 'Errore durante il salvataggio dell\'area.'
}
}
const askDeleteArea = (area: any) => {
areaPendingDelete.value = area
}
const closeDeleteAreaModal = () => {
if (deletingAreaId.value) return
areaPendingDelete.value = null
}
const handleDeleteArea = async () => {
if (!areaPendingDelete.value) return
const area = areaPendingDelete.value
deletingAreaId.value = area.id
actionError.value = ''
try {
const res = await deleteArea(area.id)
if (res.ok) {
if (editingAreaId.value === area.id) {
closeCreateModal()
}
await refresh()
areaPendingDelete.value = null
}
} catch (err: any) {
console.error('Failed to delete area', err)
actionError.value = err?.data?.message || 'Errore durante eliminazione area.'
} finally {
deletingAreaId.value = null
console.error('Failed to create area', err)
alert('Errore durante la creazione dell\'area.')
}
}
</script>
@@ -287,14 +165,10 @@ const handleDeleteArea = async () => {
<div class="spinner-border text-primary" role="status"></div>
</div>
<div v-else-if="areas.length === 0" class="alert alert-info">
<div v-else-if="!areasRes?.areas || areasRes.areas.length === 0" class="alert alert-info">
Nessuna area configurata.
</div>
<div v-if="actionError" class="alert alert-danger">
{{ actionError }}
</div>
<div v-else class="table-responsive">
<table class="table table-hover align-middle bg-white shadow-sm rounded">
<thead class="table-light">
@@ -302,32 +176,23 @@ const handleDeleteArea = async () => {
<th>ID</th>
<th>Nome</th>
<th>Descrizione</th>
<th>Stato</th>
<th>GeoJSON</th>
<th class="text-end">Azioni</th>
</tr>
</thead>
<tbody>
<tr v-for="area in areas" :key="area.id">
<tr v-for="area in areasRes.areas" :key="area.id">
<td>{{ area.id }}</td>
<td><strong>{{ area.name }}</strong></td>
<td>{{ area.description || '-' }}</td>
<td>
<span v-if="area.active" class="badge bg-success">Attiva</span>
<span v-else class="badge bg-secondary">Inattiva</span>
</td>
<td>
<span v-if="area.boundary_geojson" class="badge border border-primary text-primary">Configurato</span>
<span v-else class="badge border border-danger text-danger">Mancante</span>
</td>
<td class="text-end">
<button class="btn btn-sm btn-outline-primary me-2" @click="openEditModal(area)">
Modifica
</button>
<button
class="btn btn-sm btn-outline-danger ms-2"
:disabled="deletingAreaId === area.id"
@click="askDeleteArea(area)"
>
<span v-if="deletingAreaId === area.id" class="spinner-border spinner-border-sm me-1"></span>
Elimina
</button>
</td>
</tr>
</tbody>
</table>
@@ -339,7 +204,7 @@ const handleDeleteArea = async () => {
<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">{{ modalTitle }}</h5>
<h5 class="modal-title">Nuova Area</h5>
<button type="button" class="btn-close" @click="closeCreateModal"></button>
</div>
<div class="modal-body">
@@ -386,23 +251,12 @@ const handleDeleteArea = async () => {
<div class="modal-footer d-flex justify-content-end gap-2">
<button type="button" class="btn btn-outline-secondary" @click="closeCreateModal">Annulla</button>
<button type="button" class="btn btn-primary" :disabled="!formData.name || !formData.geojson" @click="handleCreate">
{{ submitLabel }}
Crea Area
</button>
</div>
</div>
</div>
</div>
<ConfirmModal
:open="areaPendingDelete !== null"
title="Elimina area"
:message="areaDeleteMessage"
confirm-label="Elimina area"
confirm-class="btn-danger"
:pending="deletingAreaId !== null"
@cancel="closeDeleteAreaModal"
@confirm="handleDeleteArea"
/>
</div>
</template>
+15 -225
View File
@@ -1,6 +1,4 @@
<script setup lang="ts">
import type { Category, Team } from '~/types/api'
definePageMeta({
middleware: 'auth',
auth: { role: 'ADMIN' }
@@ -8,7 +6,7 @@ definePageMeta({
useHead({ title: 'Categorie e Team - Admin' })
const { createCategory, updateCategory, deleteCategory, getTeams, createTeam, updateTeam, deleteTeam, getAreas } = useAdmin()
const { createCategory, getTeams, createTeam, getAreas } = useAdmin()
const { getCategories } = useReports()
const { data: categoriesRes, refresh: refreshCategories } = await useAsyncData('report-categories-admin-view', () => getCategories())
@@ -20,8 +18,6 @@ const categoryForm = reactive({
description: '',
})
const editingCategoryId = ref<number | null>(null)
const teamForm = reactive({
name: '',
description: '',
@@ -29,70 +25,26 @@ const teamForm = reactive({
area_id: null as number | null,
})
const editingTeamId = ref<number | null>(null)
const isSavingCategory = ref(false)
const isSavingTeam = ref(false)
const categoryError = ref('')
const teamError = ref('')
const deletingCategoryId = ref<number | null>(null)
const deletingTeamId = ref<number | null>(null)
const categoryPendingDelete = ref<Category | null>(null)
const teamPendingDelete = ref<Team | null>(null)
const categories = computed(() => categoriesRes.value?.categories || [])
const teams = computed(() => teamsRes.value?.teams || [])
const areas = computed(() => areasRes.value?.areas || [])
const categoryDeleteMessage = computed(() =>
categoryPendingDelete.value ? `Vuoi eliminare categoria "${categoryPendingDelete.value.name}"? Operazione irreversibile.` : ''
)
const teamDeleteMessage = computed(() =>
teamPendingDelete.value ? `Vuoi eliminare team "${teamPendingDelete.value.name}"? Operazione irreversibile.` : ''
)
const resetCategoryForm = () => {
editingCategoryId.value = null
categoryForm.name = ''
categoryForm.description = ''
}
const resetTeamForm = () => {
editingTeamId.value = null
teamForm.name = ''
teamForm.description = ''
teamForm.team_category_id = null
teamForm.area_id = null
}
const editCategory = (category: Category) => {
editingCategoryId.value = category.id
categoryForm.name = category.name
categoryForm.description = category.description || ''
}
const editTeam = (team: Team) => {
editingTeamId.value = team.id
teamForm.name = team.name
teamForm.description = team.description || ''
teamForm.team_category_id = team.team_category_id
teamForm.area_id = team.area_id ?? null
}
const submitCategory = async () => {
categoryError.value = ''
isSavingCategory.value = true
try {
const payload = {
await createCategory({
name: categoryForm.name.trim(),
description: categoryForm.description.trim() || undefined,
}
if (editingCategoryId.value) {
await updateCategory(editingCategoryId.value, payload)
} else {
await createCategory(payload)
}
resetCategoryForm()
})
categoryForm.name = ''
categoryForm.description = ''
await refreshCategories()
} catch (error: any) {
categoryError.value = error?.data?.message || 'Creazione categoria non riuscita.'
@@ -108,18 +60,16 @@ const submitTeam = async () => {
isSavingTeam.value = true
try {
const payload = {
await createTeam({
name: teamForm.name.trim(),
description: teamForm.description.trim() || undefined,
team_category_id: teamForm.team_category_id,
area_id: teamForm.area_id || undefined,
}
if (editingTeamId.value) {
await updateTeam(editingTeamId.value, payload)
} else {
await createTeam(payload)
}
resetTeamForm()
})
teamForm.name = ''
teamForm.description = ''
teamForm.team_category_id = null
teamForm.area_id = null
await refreshTeams()
} catch (error: any) {
teamError.value = error?.data?.message || 'Creazione team non riuscita.'
@@ -127,86 +77,6 @@ const submitTeam = async () => {
isSavingTeam.value = false
}
}
const toggleCategoryActive = async (category: Category) => {
try {
await updateCategory(category.id, { active: category.active === false })
await refreshCategories()
} catch (error: any) {
categoryError.value = error?.data?.message || 'Aggiornamento categoria non riuscito.'
}
}
const askDeleteCategory = (category: Category) => {
categoryPendingDelete.value = category
}
const closeDeleteCategoryModal = () => {
if (deletingCategoryId.value) return
categoryPendingDelete.value = null
}
const handleDeleteCategory = async () => {
if (!categoryPendingDelete.value) return
const category = categoryPendingDelete.value
deletingCategoryId.value = category.id
categoryError.value = ''
try {
await deleteCategory(category.id)
if (editingCategoryId.value === category.id) {
resetCategoryForm()
}
await refreshCategories()
categoryPendingDelete.value = null
} catch (error: any) {
categoryError.value = error?.data?.message || 'Eliminazione categoria non riuscita.'
} finally {
deletingCategoryId.value = null
}
}
const toggleTeamActive = async (team: Team) => {
try {
await updateTeam(team.id, { active: team.active === false })
await refreshTeams()
} catch (error: any) {
teamError.value = error?.data?.message || 'Aggiornamento team non riuscito.'
}
}
const askDeleteTeam = (team: Team) => {
teamPendingDelete.value = team
}
const closeDeleteTeamModal = () => {
if (deletingTeamId.value) return
teamPendingDelete.value = null
}
const handleDeleteTeam = async () => {
if (!teamPendingDelete.value) return
const team = teamPendingDelete.value
deletingTeamId.value = team.id
teamError.value = ''
try {
await deleteTeam(team.id)
if (editingTeamId.value === team.id) {
resetTeamForm()
}
await refreshTeams()
teamPendingDelete.value = null
} catch (error: any) {
teamError.value = error?.data?.message || 'Eliminazione team non riuscita.'
} finally {
deletingTeamId.value = null
}
}
</script>
<template>
@@ -243,15 +113,7 @@ const handleDeleteTeam = async () => {
</div>
<button type="submit" class="btn btn-primary" :disabled="isSavingCategory || !categoryForm.name.trim()">
<span v-if="isSavingCategory" class="spinner-border spinner-border-sm me-2"></span>
{{ editingCategoryId ? 'Salva categoria' : 'Crea categoria' }}
</button>
<button
v-if="editingCategoryId"
type="button"
class="btn btn-outline-secondary ms-2"
@click="resetCategoryForm"
>
Annulla
Crea categoria
</button>
</form>
@@ -262,7 +124,6 @@ const handleDeleteTeam = async () => {
<th>ID</th>
<th>Nome</th>
<th>Stato</th>
<th class="text-end">Azioni</th>
</tr>
</thead>
<tbody>
@@ -277,29 +138,9 @@ const handleDeleteTeam = async () => {
{{ category.active === false ? 'Inattiva' : 'Attiva' }}
</span>
</td>
<td class="text-end">
<button class="btn btn-sm btn-outline-primary me-2" @click="editCategory(category)">
Modifica
</button>
<button
class="btn btn-sm"
:class="category.active === false ? 'btn-outline-success' : 'btn-outline-secondary'"
@click="toggleCategoryActive(category)"
>
{{ category.active === false ? 'Attiva' : 'Disattiva' }}
</button>
<button
class="btn btn-sm btn-outline-danger ms-2"
:disabled="deletingCategoryId === category.id"
@click="askDeleteCategory(category)"
>
<span v-if="deletingCategoryId === category.id" class="spinner-border spinner-border-sm me-1"></span>
Elimina
</button>
</td>
</tr>
<tr v-if="categories.length === 0">
<td colspan="4" class="text-muted">Nessuna categoria configurata.</td>
<td colspan="3" class="text-muted">Nessuna categoria configurata.</td>
</tr>
</tbody>
</table>
@@ -350,15 +191,7 @@ const handleDeleteTeam = async () => {
<div class="col-12">
<button type="submit" class="btn btn-primary" :disabled="isSavingTeam || !teamForm.name.trim() || !teamForm.team_category_id">
<span v-if="isSavingTeam" class="spinner-border spinner-border-sm me-2"></span>
{{ editingTeamId ? 'Salva team' : 'Crea team' }}
</button>
<button
v-if="editingTeamId"
type="button"
class="btn btn-outline-secondary ms-2"
@click="resetTeamForm"
>
Annulla
Crea team
</button>
</div>
</form>
@@ -372,7 +205,6 @@ const handleDeleteTeam = async () => {
<th>Categoria</th>
<th>Area</th>
<th>Stato</th>
<th class="text-end">Azioni</th>
</tr>
</thead>
<tbody>
@@ -389,29 +221,9 @@ const handleDeleteTeam = async () => {
{{ team.active === false ? 'Inattivo' : 'Attivo' }}
</span>
</td>
<td class="text-end">
<button class="btn btn-sm btn-outline-primary me-2" @click="editTeam(team)">
Modifica
</button>
<button
class="btn btn-sm"
:class="team.active === false ? 'btn-outline-success' : 'btn-outline-secondary'"
@click="toggleTeamActive(team)"
>
{{ team.active === false ? 'Attiva' : 'Disattiva' }}
</button>
<button
class="btn btn-sm btn-outline-danger ms-2"
:disabled="deletingTeamId === team.id"
@click="askDeleteTeam(team)"
>
<span v-if="deletingTeamId === team.id" class="spinner-border spinner-border-sm me-1"></span>
Elimina
</button>
</td>
</tr>
<tr v-if="teams.length === 0">
<td colspan="6" class="text-muted">Nessun team configurato.</td>
<td colspan="5" class="text-muted">Nessun team configurato.</td>
</tr>
</tbody>
</table>
@@ -420,27 +232,5 @@ const handleDeleteTeam = async () => {
</div>
</div>
</div>
<ConfirmModal
:open="categoryPendingDelete !== null"
title="Elimina categoria"
:message="categoryDeleteMessage"
confirm-label="Elimina categoria"
confirm-class="btn-danger"
:pending="deletingCategoryId !== null"
@cancel="closeDeleteCategoryModal"
@confirm="handleDeleteCategory"
/>
<ConfirmModal
:open="teamPendingDelete !== null"
title="Elimina team"
:message="teamDeleteMessage"
confirm-label="Elimina team"
confirm-class="btn-danger"
:pending="deletingTeamId !== null"
@cancel="closeDeleteTeamModal"
@confirm="handleDeleteTeam"
/>
</div>
</template>
+17 -104
View File
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { reactive, ref, watch } from 'vue'
import { ref, watch } from 'vue'
definePageMeta({
middleware: 'auth',
@@ -13,19 +13,6 @@ const { getModerationFlags, updateModerationFlag } = useAdmin()
const page = ref(1)
const perPage = ref(10)
const statusFilter = ref('')
const actionError = ref('')
const resolveModal = reactive({
open: false,
flagId: null as number | null,
rejectReport: false,
note: '',
pending: false,
})
const dismissModal = reactive({
open: false,
flagId: null as number | null,
pending: false,
})
const { data: flagsRes, pending, refresh } = useAsyncData(
'admin-moderation-flags',
@@ -33,72 +20,36 @@ const { data: flagsRes, pending, refresh } = useAsyncData(
{ watch: [page, statusFilter] }
)
const openResolveModal = (id: number, rejectReport: boolean) => {
resolveModal.open = true
resolveModal.flagId = id
resolveModal.rejectReport = rejectReport
resolveModal.note = ''
}
const closeResolveModal = () => {
if (resolveModal.pending) return
resolveModal.open = false
resolveModal.flagId = null
resolveModal.note = ''
}
const handleResolve = async () => {
if (!resolveModal.flagId) return
resolveModal.pending = true
actionError.value = ''
const handleResolve = async (id: number, rejectReport: boolean) => {
const note = prompt('Inserisci una nota di risoluzione (opzionale):')
if (note === null) return // cancelled
try {
const res = await updateModerationFlag(resolveModal.flagId, {
const res = await updateModerationFlag(id, {
status: 'RESOLVED',
reject_report: resolveModal.rejectReport,
resolution_note: resolveModal.note || undefined
reject_report: rejectReport,
resolution_note: note
})
if (res.ok) {
await refresh()
closeResolveModal()
}
} catch (err) {
console.error('Failed to resolve flag', err)
actionError.value = 'Errore durante la risoluzione della segnalazione.'
} finally {
resolveModal.pending = false
alert('Errore durante la risoluzione della segnalazione.')
}
}
const openDismissModal = (id: number) => {
dismissModal.open = true
dismissModal.flagId = id
}
const closeDismissModal = () => {
if (dismissModal.pending) return
dismissModal.open = false
dismissModal.flagId = null
}
const handleDismiss = async () => {
if (!dismissModal.flagId) return
dismissModal.pending = true
actionError.value = ''
const handleDismiss = async (id: number) => {
if (!confirm('Sei sicuro di voler ignorare (dismiss) questo flag?')) return
try {
const res = await updateModerationFlag(dismissModal.flagId, { status: 'DISMISSED' })
const res = await updateModerationFlag(id, { status: 'DISMISSED' })
if (res.ok) {
await refresh()
closeDismissModal()
}
} catch (err) {
console.error('Failed to dismiss flag', err)
actionError.value = 'Errore durante l\'aggiornamento.'
} finally {
dismissModal.pending = false
alert('Errore durante l\'aggiornamento.')
}
}
@@ -137,10 +88,6 @@ const formatDate = (dateStr: string) => {
Nessun elemento da moderare al momento.
</div>
<div v-if="actionError" class="alert alert-danger">
{{ actionError }}
</div>
<div v-else>
<div class="card mb-3 shadow-sm border-0" v-for="flag in flagsRes.flags" :key="flag.id">
<div class="card-header bg-light d-flex justify-content-between align-items-center">
@@ -187,13 +134,13 @@ const formatDate = (dateStr: string) => {
<div class="col-md-4 text-end" v-if="flag.status === 'OPEN'">
<div class="d-flex flex-column gap-2 mt-3 mt-md-0">
<button class="btn btn-outline-danger btn-sm" @click="openResolveModal(flag.id, true)">
<button class="btn btn-outline-danger btn-sm" @click="handleResolve(flag.id, true)">
<BIIcon name="it-ban" size="xs" /> Risolvi & Rigetta Segn.
</button>
<button class="btn btn-outline-warning btn-sm" @click="openResolveModal(flag.id, false)">
<button class="btn btn-outline-warning btn-sm" @click="handleResolve(flag.id, false)">
<BIIcon name="it-check" size="xs" /> Risolvi (Solo Avviso)
</button>
<button class="btn btn-outline-secondary btn-sm" @click="openDismissModal(flag.id)">
<button class="btn btn-outline-secondary btn-sm" @click="handleDismiss(flag.id)">
<BIIcon name="it-close" size="xs" /> Ignora Flag
</button>
</div>
@@ -210,39 +157,5 @@ const formatDate = (dateStr: string) => {
@page-change="page = $event"
/>
</div>
<div v-if="resolveModal.open" class="modal-backdrop fade show d-block" style="background: rgba(0,0,0,0.5); z-index: 1040;"></div>
<div v-if="resolveModal.open" class="modal fade show d-block" tabindex="-1" style="z-index: 1050;">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">{{ resolveModal.rejectReport ? 'Risolvi e rigetta segnalazione' : 'Risolvi flag' }}</h5>
<button type="button" class="btn-close" :disabled="resolveModal.pending" @click="closeResolveModal"></button>
</div>
<div class="modal-body">
<label class="form-label">Nota di risoluzione</label>
<textarea v-model="resolveModal.note" class="form-control" rows="4" placeholder="Nota opzionale"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" :disabled="resolveModal.pending" @click="closeResolveModal">Annulla</button>
<button type="button" class="btn btn-primary" :disabled="resolveModal.pending" @click="handleResolve">
<span v-if="resolveModal.pending" class="spinner-border spinner-border-sm me-2"></span>
Conferma
</button>
</div>
</div>
</div>
</div>
<ConfirmModal
:open="dismissModal.open"
title="Ignora flag"
message="Vuoi ignorare questo flag? Azione registrata in moderazione."
confirm-label="Ignora flag"
confirm-class="btn-outline-secondary"
:pending="dismissModal.pending"
@cancel="closeDismissModal"
@confirm="handleDismiss"
/>
</div>
</template>
+9 -56
View File
@@ -13,18 +13,7 @@ const { getUsers, updateUserBan, updateUserRoles } = useAdmin()
const { data: usersRes, pending, refresh } = useAsyncData('admin-users', () => getUsers())
const search = ref('')
const banError = ref('')
const roleError = ref('')
const pendingBanUser = ref<any | null>(null)
const isUpdatingBan = ref(false)
const parseRoles = (roles?: string) => roles ? roles.split(',').map((r) => r.trim()).filter(Boolean) : []
const banConfirmMessage = computed(() =>
pendingBanUser.value
? `Vuoi ${pendingBanUser.value.banned ? 'sbloccare' : 'bannare'} utente ${pendingBanUser.value.first_name} ${pendingBanUser.value.last_name}?`
: ''
)
const banConfirmLabel = computed(() => pendingBanUser.value?.banned ? 'Sblocca utente' : 'Banna utente')
const banConfirmClass = computed(() => pendingBanUser.value?.banned ? 'btn-success' : 'btn-danger')
const parseRoles = (roles?: string) => roles ? roles.split(',').map((r) => r.trim().toUpperCase()).filter(Boolean) : []
const filteredUsers = computed(() => {
if (!usersRes.value?.users) return []
@@ -38,33 +27,17 @@ const filteredUsers = computed(() => {
)
})
const askToggleBan = (user: any) => {
pendingBanUser.value = user
}
const closeBanModal = () => {
if (isUpdatingBan.value) return
pendingBanUser.value = null
}
const handleToggleBan = async () => {
if (!pendingBanUser.value) return
const user = pendingBanUser.value
isUpdatingBan.value = true
banError.value = ''
const handleToggleBan = async (id: number, currentBanStatus: boolean) => {
if (!confirm(`Sei sicuro di voler ${currentBanStatus ? 'sbloccare' : 'bannare'} questo utente?`)) return
try {
const res = await updateUserBan(user.id, { banned: !user.banned })
const res = await updateUserBan(id, { banned: !currentBanStatus })
if (res.ok) {
await refresh()
pendingBanUser.value = null
}
} catch (err) {
console.error('Failed to update user ban status', err)
banError.value = 'Errore durante l\'aggiornamento dello stato di ban.'
} finally {
isUpdatingBan.value = false
alert('Errore durante l\'aggiornamento dello stato di ban.')
}
}
@@ -85,8 +58,7 @@ const closeRoleModal = () => {
const saveRoles = async () => {
if (!editingUserId.value) return
roleError.value = ''
try {
const res = await updateUserRoles(editingUserId.value, { roles: selectedRoles.value })
if (res.ok) {
@@ -95,7 +67,7 @@ const saveRoles = async () => {
}
} catch (err) {
console.error('Failed to update roles', err)
roleError.value = 'Errore durante l\'aggiornamento dei ruoli.'
alert('Errore durante l\'aggiornamento dei ruoli.')
}
}
</script>
@@ -123,14 +95,6 @@ const saveRoles = async () => {
Nessun utente trovato.
</div>
<div v-if="banError" class="alert alert-danger">
{{ banError }}
</div>
<div v-if="roleError" class="alert alert-danger">
{{ roleError }}
</div>
<div v-else class="table-responsive">
<table class="table table-hover align-middle">
<thead>
@@ -174,7 +138,7 @@ const saveRoles = async () => {
<button
class="btn btn-sm"
:class="user.banned ? 'btn-outline-success' : 'btn-outline-danger'"
@click="askToggleBan(user)"
@click="handleToggleBan(user.id, !!user.banned)"
>
{{ user.banned ? 'Sblocca' : 'Banna' }}
</button>
@@ -213,16 +177,5 @@ const saveRoles = async () => {
</div>
</div>
</div>
<ConfirmModal
:open="pendingBanUser !== null"
title="Conferma stato utente"
:message="banConfirmMessage"
:confirm-label="banConfirmLabel"
:confirm-class="banConfirmClass"
:pending="isUpdatingBan"
@cancel="closeBanModal"
@confirm="handleToggleBan"
/>
</div>
</template>
+1 -136
View File
@@ -17,7 +17,7 @@ if (!reportId) {
}
const { getReportDetail, getMessages, addMessage, flagMessage } = useReports()
const { getInterventionSummary, updateReportStatus, assignTeam, getTeams, createInterventionLink, revokeInterventionLink } = useOperator()
const { getInterventionSummary, updateReportStatus, assignTeam, getTeams } = useOperator()
const { user } = useAuth()
// Dati principali
@@ -52,13 +52,6 @@ const isUpdatingStatus = ref(false)
const isAssignModalOpen = ref(false)
const selectedTeamId = ref<number | null>(null)
const isAssigning = ref(false)
const interventionLink = ref('')
const interventionLinkExpiresAt = ref('')
const isGeneratingInterventionLink = ref(false)
const isRevokingInterventionLink = ref(false)
const interventionLinkError = ref('')
const interventionLinkSuccess = ref('')
const isRevokeInterventionModalOpen = ref(false)
// Messaggi
const isSubmittingMessage = ref(false)
@@ -116,72 +109,6 @@ const handleAssignTeam = async () => {
}
}
const copyInterventionLink = async () => {
if (!interventionLink.value || !navigator?.clipboard) return
try {
await navigator.clipboard.writeText(interventionLink.value)
interventionLinkSuccess.value = 'Link copiato negli appunti.'
interventionLinkError.value = ''
} catch {
interventionLinkError.value = 'Copia automatica non riuscita.'
interventionLinkSuccess.value = ''
}
}
const handleCreateInterventionLink = async () => {
isGeneratingInterventionLink.value = true
interventionLinkError.value = ''
interventionLinkSuccess.value = ''
try {
const res = await createInterventionLink(reportId)
if (res.ok) {
interventionLink.value = res.url
interventionLinkExpiresAt.value = res.expires_at
interventionLinkSuccess.value = 'Link intervento generato.'
}
} catch (e: any) {
console.error('Failed to create intervention link', e)
interventionLinkError.value = e?.data?.message || 'Generazione link non riuscita.'
} finally {
isGeneratingInterventionLink.value = false
}
}
const openRevokeInterventionLinkModal = () => {
if (!interventionLink.value) return
isRevokeInterventionModalOpen.value = true
}
const closeRevokeInterventionLinkModal = () => {
if (isRevokingInterventionLink.value) return
isRevokeInterventionModalOpen.value = false
}
const handleRevokeInterventionLink = async () => {
if (!interventionLink.value) return
isRevokingInterventionLink.value = true
interventionLinkError.value = ''
interventionLinkSuccess.value = ''
try {
const res = await revokeInterventionLink(reportId)
if (res.ok) {
interventionLink.value = ''
interventionLinkExpiresAt.value = ''
interventionLinkSuccess.value = 'Link intervento revocato.'
isRevokeInterventionModalOpen.value = false
}
} catch (e: any) {
console.error('Failed to revoke intervention link', e)
interventionLinkError.value = e?.data?.message || 'Revoca link non riuscita.'
} finally {
isRevokingInterventionLink.value = false
}
}
const handleSendMessage = async (msgText: string, files: File[]) => {
if (!msgText.trim() && files.length === 0) return
isSubmittingMessage.value = true
@@ -231,10 +158,6 @@ const latestCitizenMessage = computed(() => {
.reverse()
.find((message) => message.user_id === reportUserId) || null
})
const formattedInterventionLinkExpiry = computed(() =>
interventionLinkExpiresAt.value ? formatDate(interventionLinkExpiresAt.value) : ''
)
</script>
<template>
@@ -369,54 +292,6 @@ const formattedInterventionLinkExpiry = computed(() =>
</div>
</div>
<div class="card card-bg border-0 shadow-sm mb-4">
<div class="card-body">
<h2 class="h6 mb-3">Link intervento pubblico</h2>
<p class="text-muted small mb-3">Genera link temporaneo per team esterno. Nuova generazione ruota link esistente.</p>
<div v-if="interventionLinkError" class="alert alert-danger py-2" role="alert">
{{ interventionLinkError }}
</div>
<div v-if="interventionLinkSuccess" class="alert alert-success py-2" role="alert">
{{ interventionLinkSuccess }}
</div>
<template v-if="interventionLink">
<label class="form-label">URL attivo</label>
<div class="input-group mb-2">
<input type="text" class="form-control" :value="interventionLink" readonly />
<button type="button" class="btn btn-outline-primary" @click="copyInterventionLink">
Copia
</button>
</div>
<p class="small text-muted mb-3">
Scade: {{ formattedInterventionLinkExpiry || '-' }}
</p>
<div class="d-grid gap-2">
<button type="button" class="btn btn-outline-primary" :disabled="isGeneratingInterventionLink" @click="handleCreateInterventionLink">
<span v-if="isGeneratingInterventionLink" class="spinner-border spinner-border-sm me-2"></span>
Rigenera link
</button>
<button type="button" class="btn btn-outline-danger" :disabled="isRevokingInterventionLink" @click="openRevokeInterventionLinkModal">
<span v-if="isRevokingInterventionLink" class="spinner-border spinner-border-sm me-2"></span>
Revoca link
</button>
</div>
</template>
<button
v-else
type="button"
class="btn btn-outline-primary w-100"
:disabled="isGeneratingInterventionLink"
@click="handleCreateInterventionLink"
>
<span v-if="isGeneratingInterventionLink" class="spinner-border spinner-border-sm me-2"></span>
Genera link
</button>
</div>
</div>
<div class="card card-bg border-0 shadow-sm mb-4">
<div class="card-body">
<h2 class="h6 mb-3">Aggiorna stato</h2>
@@ -500,16 +375,6 @@ const formattedInterventionLinkExpiry = computed(() =>
</div>
</div>
<ConfirmModal
:open="isRevokeInterventionModalOpen"
title="Revoca link intervento"
message="Vuoi revocare link pubblico per team esterno? Link non sara piu utilizzabile."
confirm-label="Revoca link"
confirm-class="btn-danger"
:pending="isRevokingInterventionLink"
@cancel="closeRevokeInterventionLinkModal"
@confirm="handleRevokeInterventionLink"
/>
</div>
<div v-else class="text-center py-5">
<div class="spinner-border text-primary" role="status"></div>
+1 -28
View File
@@ -267,24 +267,11 @@ export interface CreateAreaRequest {
description?: string;
}
export interface UpdateAreaRequest {
name?: string;
boundary_geojson?: GeoJsonObject;
description?: string;
active?: boolean;
}
export interface CreateCategoryRequest {
name: string;
description?: string;
}
export interface UpdateCategoryRequest {
name?: string;
description?: string;
active?: boolean;
}
export interface CreateTeamRequest {
team_category_id: number;
name: string;
@@ -292,14 +279,6 @@ export interface CreateTeamRequest {
area_id?: number;
}
export interface UpdateTeamRequest {
team_category_id?: number;
name?: string;
description?: string;
area_id?: number | null;
active?: boolean;
}
export interface UpdateUserBanRequest {
banned: boolean;
}
@@ -367,12 +346,6 @@ export interface InterventionSummaryResponse {
latest_messages: Message[];
}
export interface AssignmentLinkResponse {
ok: boolean;
url: string;
expires_at: string;
}
export interface MediaUploadResponse {
ok: boolean;
media: Media[];
@@ -443,4 +416,4 @@ export interface OverviewStatsResponse {
avg_resolution_hours_by_area: { area: string; value: number }[];
total_users?: number;
open_reports?: number;
}
}
@@ -1,3 +1,5 @@
import { BARI_BOUNDS, isWithinBariBounds } from '~/utils/bari'
interface NominatimAddress {
road?: string
house_number?: string
@@ -27,26 +29,8 @@ export interface GeocodingSuggestion {
}
const NOMINATIM_BASE_URL = 'https://nominatim.openstreetmap.org'
const BARI_BOUNDS = {
north: 41.1696,
south: 41.0718,
east: 16.9521,
west: 16.7564
}
const NOMINATIM_HEADERS = {
'User-Agent': 'Visione Frontend/1.0 (https://visione.studentindipendenti.it)',
'Referer': 'https://visione.studentindipendenti.it/'
}
const bariViewbox = `${BARI_BOUNDS.west},${BARI_BOUNDS.north},${BARI_BOUNDS.east},${BARI_BOUNDS.south}`
const isWithinBariBounds = (latitude: number, longitude: number) =>
latitude >= BARI_BOUNDS.south &&
latitude <= BARI_BOUNDS.north &&
longitude >= BARI_BOUNDS.west &&
longitude <= BARI_BOUNDS.east
const compactAddress = (displayName: string, address?: NominatimAddress) => {
if (!address) {
return displayName
@@ -91,9 +75,7 @@ export const searchAddresses = async (query: string, limit = 5) => {
limit: String(limit)
})
const results = await $fetch<NominatimResult[]>(`${NOMINATIM_BASE_URL}/search?${params.toString()}`, {
headers: NOMINATIM_HEADERS
})
const results = await $fetch<NominatimResult[]>(`${NOMINATIM_BASE_URL}/search?${params.toString()}`)
return results
.map(toSuggestion)
@@ -111,9 +93,7 @@ export const reverseGeocode = async (latitude: number, longitude: number) => {
'accept-language': 'it'
})
const result = await $fetch<NominatimResult | null>(`${NOMINATIM_BASE_URL}/reverse?${params.toString()}`, {
headers: NOMINATIM_HEADERS
})
const result = await $fetch<NominatimResult | null>(`${NOMINATIM_BASE_URL}/reverse?${params.toString()}`)
if (!result) {
return ''
+2 -23
View File
@@ -8,6 +8,8 @@ export default defineNuxtConfig({
'@nuxtjs/sitemap',
'@nuxtjs/robots'
],
// TODO: riattivare prima di pubblicare il sito
ssr: false,
runtimeConfig: {
public: {
@@ -35,29 +37,6 @@ export default defineNuxtConfig({
]
},
nitro: {
devProxy: {
'/api/v1': {
target: 'https://bk.visione.studentindipendenti.it/api/v1',
changeOrigin: true,
headers: {
host: 'bk.visione.studentindipendenti.it',
origin: 'https://visione.studentindipendenti.it',
referer: 'https://visione.studentindipendenti.it/'
}
},
'/uploads': {
target: 'https://bk.visione.studentindipendenti.it/uploads',
changeOrigin: true,
headers: {
host: 'bk.visione.studentindipendenti.it',
origin: 'https://visione.studentindipendenti.it',
referer: 'https://visione.studentindipendenti.it/'
}
}
}
},
app: {
head: {
link: [
-19
View File
@@ -1,19 +0,0 @@
import { createError, getQuery } from 'h3'
import { reverseGeocode } from '../../utils/geocoding'
export default defineEventHandler(async (event) => {
const query = getQuery(event)
const latitude = typeof query.lat === 'string' ? Number.parseFloat(query.lat) : Number.NaN
const longitude = typeof query.lng === 'string' ? Number.parseFloat(query.lng) : Number.NaN
if (!Number.isFinite(latitude) || !Number.isFinite(longitude)) {
throw createError({
statusCode: 400,
statusMessage: 'Invalid coordinates'
})
}
const address = await reverseGeocode(latitude, longitude)
return { address }
})
-20
View File
@@ -1,20 +0,0 @@
import { createError, getQuery } from 'h3'
import { searchAddresses } from '../../utils/geocoding'
export default defineEventHandler(async (event) => {
const query = getQuery(event)
const rawText = typeof query.q === 'string' ? query.q.trim() : ''
const rawLimit = typeof query.limit === 'string' ? Number.parseInt(query.limit, 10) : 5
const limit = Number.isFinite(rawLimit) ? Math.min(Math.max(rawLimit, 1), 8) : 5
if (rawText.length < 3) {
throw createError({
statusCode: 400,
statusMessage: 'Query too short'
})
}
const suggestions = await searchAddresses(rawText, limit)
return { suggestions }
})