Compare commits
10
Commits
5599022f66
...
3e16f66180
@@ -0,0 +1,60 @@
|
|||||||
|
<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>
|
||||||
@@ -3,6 +3,7 @@ import type { Category, CreateReportRequest } from '~/types/api'
|
|||||||
import type { LeafletMouseEvent, Map as LeafletMap, Marker as LeafletMarker } from 'leaflet'
|
import type { LeafletMouseEvent, Map as LeafletMap, Marker as LeafletMarker } from 'leaflet'
|
||||||
import { onMounted, onUnmounted, ref, watch } from 'vue'
|
import { onMounted, onUnmounted, ref, watch } from 'vue'
|
||||||
import { BARI_BOUNDS, BARI_CENTER, isWithinBariBounds } from '~/utils/bari'
|
import { BARI_BOUNDS, BARI_CENTER, isWithinBariBounds } from '~/utils/bari'
|
||||||
|
import { reverseGeocode, searchAddresses } from '~/utils/geocoding'
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
isLoading?: boolean
|
isLoading?: boolean
|
||||||
@@ -19,14 +20,6 @@ interface GeocodingSuggestion {
|
|||||||
longitude: number
|
longitude: number
|
||||||
}
|
}
|
||||||
|
|
||||||
interface SearchAddressesResponse {
|
|
||||||
suggestions: GeocodingSuggestion[]
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ReverseGeocodeResponse {
|
|
||||||
address: string
|
|
||||||
}
|
|
||||||
|
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
categories: () => []
|
categories: () => []
|
||||||
@@ -123,18 +116,20 @@ const fetchAddressSuggestions = async (query: string) => {
|
|||||||
addressSearchError.value = ''
|
addressSearchError.value = ''
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await $fetch<SearchAddressesResponse>('/api/geocoding/search', {
|
if (requestId !== addressSearchRequestId) {
|
||||||
query: { q: query }
|
return
|
||||||
})
|
}
|
||||||
|
|
||||||
|
const suggestions = await searchAddresses(query)
|
||||||
|
|
||||||
if (requestId !== addressSearchRequestId) {
|
if (requestId !== addressSearchRequestId) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
addressSuggestions.value = response.suggestions
|
addressSuggestions.value = suggestions
|
||||||
showAddressSuggestions.value = response.suggestions.length > 0
|
showAddressSuggestions.value = suggestions.length > 0
|
||||||
|
|
||||||
if (!response.suggestions.length) {
|
if (!suggestions.length) {
|
||||||
addressSearchError.value = 'Nessun indirizzo trovato nel Comune di Bari.'
|
addressSearchError.value = 'Nessun indirizzo trovato nel Comune di Bari.'
|
||||||
}
|
}
|
||||||
} catch {
|
} catch {
|
||||||
@@ -157,15 +152,11 @@ const resolveAddressFromCoordinates = async (lat: number, lng: number, fallbackA
|
|||||||
addressSearchError.value = ''
|
addressSearchError.value = ''
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await $fetch<ReverseGeocodeResponse>('/api/geocoding/reverse', {
|
|
||||||
query: { lat, lng }
|
|
||||||
})
|
|
||||||
|
|
||||||
if (requestId !== reverseGeocodeRequestId) {
|
if (requestId !== reverseGeocodeRequestId) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
const resolvedAddress = response.address?.trim() || fallbackAddress.trim()
|
const resolvedAddress = (await reverseGeocode(lat, lng))?.trim() || fallbackAddress.trim()
|
||||||
|
|
||||||
if (resolvedAddress) {
|
if (resolvedAddress) {
|
||||||
setAddressValue(resolvedAddress)
|
setAddressValue(resolvedAddress)
|
||||||
@@ -541,7 +532,7 @@ watch([() => form.value.latitude, () => form.value.longitude], ([newLat, newLng]
|
|||||||
step="0.000001"
|
step="0.000001"
|
||||||
class="form-control form-control-sm"
|
class="form-control form-control-sm"
|
||||||
:class="{ 'is-invalid': errors.location }"
|
:class="{ 'is-invalid': errors.location }"
|
||||||
placeholder="Latitudine (Bari)"
|
placeholder="Latitudine (es. 45.5)"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -552,7 +543,7 @@ watch([() => form.value.latitude, () => form.value.longitude], ([newLat, newLng]
|
|||||||
step="0.000001"
|
step="0.000001"
|
||||||
class="form-control form-control-sm"
|
class="form-control form-control-sm"
|
||||||
:class="{ 'is-invalid': errors.location }"
|
:class="{ 'is-invalid': errors.location }"
|
||||||
placeholder="Longitudine (Bari)"
|
placeholder="Longitudine (es. 10.2)"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -694,4 +685,3 @@ textarea {
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import type {
|
|||||||
ModerationListResponse,
|
ModerationListResponse,
|
||||||
OkResponse,
|
OkResponse,
|
||||||
OverviewStatsResponse, TeamListResponse, UpdateModerationRequest,
|
OverviewStatsResponse, TeamListResponse, UpdateModerationRequest,
|
||||||
|
UpdateAreaRequest, UpdateCategoryRequest, UpdateTeamRequest,
|
||||||
UpdateUserBanRequest, UpdateUserRolesRequest,
|
UpdateUserBanRequest, UpdateUserRolesRequest,
|
||||||
UserListResponse
|
UserListResponse
|
||||||
} from "~/types/api";
|
} from "~/types/api";
|
||||||
@@ -26,17 +27,35 @@ export const useAdmin = () => {
|
|||||||
const createArea = (body: CreateAreaRequest) =>
|
const createArea = (body: CreateAreaRequest) =>
|
||||||
useApiFetch<OkResponse>('/api/v1/admin/areas', { method: 'POST', body })
|
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 = () =>
|
const getCategories = () =>
|
||||||
useApiFetch<CategoryListResponse>('/api/v1/admin/categories', { method: 'GET' })
|
useApiFetch<CategoryListResponse>('/api/v1/admin/categories', { method: 'GET' })
|
||||||
|
|
||||||
const createCategory = (body: CreateCategoryRequest) =>
|
const createCategory = (body: CreateCategoryRequest) =>
|
||||||
useApiFetch<OkResponse>('/api/v1/admin/categories', { method: 'POST', body })
|
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 = () =>
|
const getTeams = () =>
|
||||||
useApiFetch<TeamListResponse>('/api/v1/admin/teams', { method: 'GET' })
|
useApiFetch<TeamListResponse>('/api/v1/admin/teams', { method: 'GET' })
|
||||||
|
|
||||||
const createTeam = (body: CreateTeamRequest) =>
|
const createTeam = (body: CreateTeamRequest) =>
|
||||||
useApiFetch<OkResponse>('/api/v1/admin/teams', { method: 'POST', body })
|
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 }) =>
|
const getModerationFlags = (query?: { status?: string; page?: number; per_page?: number }) =>
|
||||||
useApiFetch<ModerationListResponse>('/api/v1/admin/moderation', { method: 'GET', query })
|
useApiFetch<ModerationListResponse>('/api/v1/admin/moderation', { method: 'GET', query })
|
||||||
@@ -51,10 +70,16 @@ export const useAdmin = () => {
|
|||||||
updateUserRoles,
|
updateUserRoles,
|
||||||
getAreas,
|
getAreas,
|
||||||
createArea,
|
createArea,
|
||||||
|
updateArea,
|
||||||
|
deleteArea,
|
||||||
getCategories,
|
getCategories,
|
||||||
createCategory,
|
createCategory,
|
||||||
|
updateCategory,
|
||||||
|
deleteCategory,
|
||||||
getTeams,
|
getTeams,
|
||||||
createTeam,
|
createTeam,
|
||||||
|
updateTeam,
|
||||||
|
deleteTeam,
|
||||||
getModerationFlags,
|
getModerationFlags,
|
||||||
updateModerationFlag,
|
updateModerationFlag,
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import type {
|
import type {
|
||||||
|
AssignmentLinkResponse,
|
||||||
AssignTeamRequest,
|
AssignTeamRequest,
|
||||||
InterventionSummaryResponse,
|
InterventionSummaryResponse,
|
||||||
OkResponse,
|
OkResponse,
|
||||||
@@ -32,6 +33,12 @@ export const useOperator = () => {
|
|||||||
const getInterventionSummary = (id: number) =>
|
const getInterventionSummary = (id: number) =>
|
||||||
useApiFetch<InterventionSummaryResponse>(`/api/v1/reports/${id}/intervention-summary`, { method: 'GET' })
|
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 {
|
return {
|
||||||
getOpenReports,
|
getOpenReports,
|
||||||
getAssignedReports,
|
getAssignedReports,
|
||||||
@@ -41,5 +48,7 @@ export const useOperator = () => {
|
|||||||
updateReportStatus,
|
updateReportStatus,
|
||||||
assignTeam,
|
assignTeam,
|
||||||
getInterventionSummary,
|
getInterventionSummary,
|
||||||
|
createInterventionLink,
|
||||||
|
revokeInterventionLink,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+161
-15
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive, nextTick, onBeforeUnmount } from 'vue'
|
import { ref, reactive, nextTick, onBeforeUnmount, computed } from 'vue'
|
||||||
import { BARI_BOUNDS, BARI_CENTER, isWithinBariBounds } from '~/utils/bari'
|
import { BARI_BOUNDS, BARI_CENTER, isWithinBariBounds } from '~/utils/bari'
|
||||||
|
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
@@ -9,23 +9,37 @@ definePageMeta({
|
|||||||
|
|
||||||
useHead({ title: 'Aree - Admin' })
|
useHead({ title: 'Aree - Admin' })
|
||||||
|
|
||||||
const { getAreas, createArea } = useAdmin()
|
const { getAreas, createArea, updateArea, deleteArea } = useAdmin()
|
||||||
const { data: areasRes, pending, refresh } = useAsyncData('admin-areas', () => getAreas())
|
const { data: areasRes, pending, refresh } = useAsyncData('admin-areas', () => getAreas())
|
||||||
|
|
||||||
const isCreating = ref(false)
|
const isCreating = ref(false)
|
||||||
|
const editingAreaId = ref<number | null>(null)
|
||||||
const formData = reactive({
|
const formData = reactive({
|
||||||
name: '',
|
name: '',
|
||||||
description: '',
|
description: '',
|
||||||
geojson: ''
|
geojson: ''
|
||||||
})
|
})
|
||||||
const jsonError = ref('')
|
const jsonError = ref('')
|
||||||
|
const actionError = ref('')
|
||||||
|
const deletingAreaId = ref<number | null>(null)
|
||||||
|
const areaPendingDelete = ref<any | null>(null)
|
||||||
|
|
||||||
// Map variables
|
// Map variables
|
||||||
let map: any = null
|
let map: any = null
|
||||||
let polygon: any = null
|
let polygon: any = null
|
||||||
const mapPoints = ref<[number, number][]>([])
|
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 = () => {
|
const openCreateModal = () => {
|
||||||
|
actionError.value = ''
|
||||||
|
editingAreaId.value = null
|
||||||
formData.name = ''
|
formData.name = ''
|
||||||
formData.description = ''
|
formData.description = ''
|
||||||
formData.geojson = ''
|
formData.geojson = ''
|
||||||
@@ -74,6 +88,74 @@ 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 = () => {
|
const clearMap = () => {
|
||||||
mapPoints.value = []
|
mapPoints.value = []
|
||||||
if (polygon) {
|
if (polygon) {
|
||||||
@@ -100,6 +182,7 @@ const updateGeojson = () => {
|
|||||||
|
|
||||||
const closeCreateModal = () => {
|
const closeCreateModal = () => {
|
||||||
isCreating.value = false
|
isCreating.value = false
|
||||||
|
editingAreaId.value = null
|
||||||
if (map) {
|
if (map) {
|
||||||
map.remove()
|
map.remove()
|
||||||
map = null
|
map = null
|
||||||
@@ -131,19 +214,58 @@ const handleCreate = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const res = await createArea({
|
const payload = {
|
||||||
name: formData.name,
|
name: formData.name,
|
||||||
description: formData.description || undefined,
|
description: formData.description || undefined,
|
||||||
boundary_geojson: parsedGeojson
|
boundary_geojson: parsedGeojson
|
||||||
})
|
}
|
||||||
|
|
||||||
|
const res = editingAreaId.value
|
||||||
|
? await updateArea(editingAreaId.value, payload)
|
||||||
|
: await createArea(payload)
|
||||||
|
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
await refresh()
|
await refresh()
|
||||||
closeCreateModal()
|
closeCreateModal()
|
||||||
|
actionError.value = ''
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to create area', err)
|
console.error('Failed to save area', err)
|
||||||
alert('Errore durante la creazione dell\'area.')
|
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
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -165,10 +287,14 @@ const handleCreate = async () => {
|
|||||||
<div class="spinner-border text-primary" role="status"></div>
|
<div class="spinner-border text-primary" role="status"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="!areasRes?.areas || areasRes.areas.length === 0" class="alert alert-info">
|
<div v-else-if="areas.length === 0" class="alert alert-info">
|
||||||
Nessuna area configurata.
|
Nessuna area configurata.
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div v-if="actionError" class="alert alert-danger">
|
||||||
|
{{ actionError }}
|
||||||
|
</div>
|
||||||
|
|
||||||
<div v-else class="table-responsive">
|
<div v-else class="table-responsive">
|
||||||
<table class="table table-hover align-middle bg-white shadow-sm rounded">
|
<table class="table table-hover align-middle bg-white shadow-sm rounded">
|
||||||
<thead class="table-light">
|
<thead class="table-light">
|
||||||
@@ -176,23 +302,32 @@ const handleCreate = async () => {
|
|||||||
<th>ID</th>
|
<th>ID</th>
|
||||||
<th>Nome</th>
|
<th>Nome</th>
|
||||||
<th>Descrizione</th>
|
<th>Descrizione</th>
|
||||||
<th>Stato</th>
|
|
||||||
<th>GeoJSON</th>
|
<th>GeoJSON</th>
|
||||||
|
<th class="text-end">Azioni</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="area in areasRes.areas" :key="area.id">
|
<tr v-for="area in areas" :key="area.id">
|
||||||
<td>{{ area.id }}</td>
|
<td>{{ area.id }}</td>
|
||||||
<td><strong>{{ area.name }}</strong></td>
|
<td><strong>{{ area.name }}</strong></td>
|
||||||
<td>{{ area.description || '-' }}</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>
|
<td>
|
||||||
<span v-if="area.boundary_geojson" class="badge border border-primary text-primary">Configurato</span>
|
<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>
|
<span v-else class="badge border border-danger text-danger">Mancante</span>
|
||||||
</td>
|
</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>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -204,7 +339,7 @@ const handleCreate = async () => {
|
|||||||
<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
|
<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<h5 class="modal-title">Nuova Area</h5>
|
<h5 class="modal-title">{{ modalTitle }}</h5>
|
||||||
<button type="button" class="btn-close" @click="closeCreateModal"></button>
|
<button type="button" class="btn-close" @click="closeCreateModal"></button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
@@ -251,12 +386,23 @@ const handleCreate = async () => {
|
|||||||
<div class="modal-footer d-flex justify-content-end gap-2">
|
<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-outline-secondary" @click="closeCreateModal">Annulla</button>
|
||||||
<button type="button" class="btn btn-primary" :disabled="!formData.name || !formData.geojson" @click="handleCreate">
|
<button type="button" class="btn btn-primary" :disabled="!formData.name || !formData.geojson" @click="handleCreate">
|
||||||
Crea Area
|
{{ submitLabel }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
+225
-15
@@ -1,4 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import type { Category, Team } from '~/types/api'
|
||||||
|
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
middleware: 'auth',
|
middleware: 'auth',
|
||||||
auth: { role: 'ADMIN' }
|
auth: { role: 'ADMIN' }
|
||||||
@@ -6,7 +8,7 @@ definePageMeta({
|
|||||||
|
|
||||||
useHead({ title: 'Categorie e Team - Admin' })
|
useHead({ title: 'Categorie e Team - Admin' })
|
||||||
|
|
||||||
const { createCategory, getTeams, createTeam, getAreas } = useAdmin()
|
const { createCategory, updateCategory, deleteCategory, getTeams, createTeam, updateTeam, deleteTeam, getAreas } = useAdmin()
|
||||||
const { getCategories } = useReports()
|
const { getCategories } = useReports()
|
||||||
|
|
||||||
const { data: categoriesRes, refresh: refreshCategories } = await useAsyncData('report-categories-admin-view', () => getCategories())
|
const { data: categoriesRes, refresh: refreshCategories } = await useAsyncData('report-categories-admin-view', () => getCategories())
|
||||||
@@ -18,6 +20,8 @@ const categoryForm = reactive({
|
|||||||
description: '',
|
description: '',
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const editingCategoryId = ref<number | null>(null)
|
||||||
|
|
||||||
const teamForm = reactive({
|
const teamForm = reactive({
|
||||||
name: '',
|
name: '',
|
||||||
description: '',
|
description: '',
|
||||||
@@ -25,26 +29,70 @@ const teamForm = reactive({
|
|||||||
area_id: null as number | null,
|
area_id: null as number | null,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const editingTeamId = ref<number | null>(null)
|
||||||
|
|
||||||
const isSavingCategory = ref(false)
|
const isSavingCategory = ref(false)
|
||||||
const isSavingTeam = ref(false)
|
const isSavingTeam = ref(false)
|
||||||
const categoryError = ref('')
|
const categoryError = ref('')
|
||||||
const teamError = 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 categories = computed(() => categoriesRes.value?.categories || [])
|
||||||
const teams = computed(() => teamsRes.value?.teams || [])
|
const teams = computed(() => teamsRes.value?.teams || [])
|
||||||
const areas = computed(() => areasRes.value?.areas || [])
|
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 () => {
|
const submitCategory = async () => {
|
||||||
categoryError.value = ''
|
categoryError.value = ''
|
||||||
isSavingCategory.value = true
|
isSavingCategory.value = true
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await createCategory({
|
const payload = {
|
||||||
name: categoryForm.name.trim(),
|
name: categoryForm.name.trim(),
|
||||||
description: categoryForm.description.trim() || undefined,
|
description: categoryForm.description.trim() || undefined,
|
||||||
})
|
}
|
||||||
categoryForm.name = ''
|
if (editingCategoryId.value) {
|
||||||
categoryForm.description = ''
|
await updateCategory(editingCategoryId.value, payload)
|
||||||
|
} else {
|
||||||
|
await createCategory(payload)
|
||||||
|
}
|
||||||
|
resetCategoryForm()
|
||||||
await refreshCategories()
|
await refreshCategories()
|
||||||
} catch (error: any) {
|
} catch (error: any) {
|
||||||
categoryError.value = error?.data?.message || 'Creazione categoria non riuscita.'
|
categoryError.value = error?.data?.message || 'Creazione categoria non riuscita.'
|
||||||
@@ -60,16 +108,18 @@ const submitTeam = async () => {
|
|||||||
isSavingTeam.value = true
|
isSavingTeam.value = true
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await createTeam({
|
const payload = {
|
||||||
name: teamForm.name.trim(),
|
name: teamForm.name.trim(),
|
||||||
description: teamForm.description.trim() || undefined,
|
description: teamForm.description.trim() || undefined,
|
||||||
team_category_id: teamForm.team_category_id,
|
team_category_id: teamForm.team_category_id,
|
||||||
area_id: teamForm.area_id || undefined,
|
area_id: teamForm.area_id || undefined,
|
||||||
})
|
}
|
||||||
teamForm.name = ''
|
if (editingTeamId.value) {
|
||||||
teamForm.description = ''
|
await updateTeam(editingTeamId.value, payload)
|
||||||
teamForm.team_category_id = null
|
} else {
|
||||||
teamForm.area_id = null
|
await createTeam(payload)
|
||||||
|
}
|
||||||
|
resetTeamForm()
|
||||||
await refreshTeams()
|
await refreshTeams()
|
||||||
} catch (error: any) {
|
} catch (error: any) {
|
||||||
teamError.value = error?.data?.message || 'Creazione team non riuscita.'
|
teamError.value = error?.data?.message || 'Creazione team non riuscita.'
|
||||||
@@ -77,6 +127,86 @@ const submitTeam = async () => {
|
|||||||
isSavingTeam.value = false
|
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>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -113,7 +243,15 @@ const submitTeam = async () => {
|
|||||||
</div>
|
</div>
|
||||||
<button type="submit" class="btn btn-primary" :disabled="isSavingCategory || !categoryForm.name.trim()">
|
<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>
|
<span v-if="isSavingCategory" class="spinner-border spinner-border-sm me-2"></span>
|
||||||
Crea categoria
|
{{ editingCategoryId ? 'Salva categoria' : 'Crea categoria' }}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
v-if="editingCategoryId"
|
||||||
|
type="button"
|
||||||
|
class="btn btn-outline-secondary ms-2"
|
||||||
|
@click="resetCategoryForm"
|
||||||
|
>
|
||||||
|
Annulla
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
@@ -124,6 +262,7 @@ const submitTeam = async () => {
|
|||||||
<th>ID</th>
|
<th>ID</th>
|
||||||
<th>Nome</th>
|
<th>Nome</th>
|
||||||
<th>Stato</th>
|
<th>Stato</th>
|
||||||
|
<th class="text-end">Azioni</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -138,9 +277,29 @@ const submitTeam = async () => {
|
|||||||
{{ category.active === false ? 'Inattiva' : 'Attiva' }}
|
{{ category.active === false ? 'Inattiva' : 'Attiva' }}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</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>
|
||||||
<tr v-if="categories.length === 0">
|
<tr v-if="categories.length === 0">
|
||||||
<td colspan="3" class="text-muted">Nessuna categoria configurata.</td>
|
<td colspan="4" class="text-muted">Nessuna categoria configurata.</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -191,7 +350,15 @@ const submitTeam = async () => {
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<button type="submit" class="btn btn-primary" :disabled="isSavingTeam || !teamForm.name.trim() || !teamForm.team_category_id">
|
<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>
|
<span v-if="isSavingTeam" class="spinner-border spinner-border-sm me-2"></span>
|
||||||
Crea team
|
{{ editingTeamId ? 'Salva team' : 'Crea team' }}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
v-if="editingTeamId"
|
||||||
|
type="button"
|
||||||
|
class="btn btn-outline-secondary ms-2"
|
||||||
|
@click="resetTeamForm"
|
||||||
|
>
|
||||||
|
Annulla
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
@@ -205,6 +372,7 @@ const submitTeam = async () => {
|
|||||||
<th>Categoria</th>
|
<th>Categoria</th>
|
||||||
<th>Area</th>
|
<th>Area</th>
|
||||||
<th>Stato</th>
|
<th>Stato</th>
|
||||||
|
<th class="text-end">Azioni</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -221,9 +389,29 @@ const submitTeam = async () => {
|
|||||||
{{ team.active === false ? 'Inattivo' : 'Attivo' }}
|
{{ team.active === false ? 'Inattivo' : 'Attivo' }}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</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>
|
||||||
<tr v-if="teams.length === 0">
|
<tr v-if="teams.length === 0">
|
||||||
<td colspan="5" class="text-muted">Nessun team configurato.</td>
|
<td colspan="6" class="text-muted">Nessun team configurato.</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@@ -232,5 +420,27 @@ const submitTeam = async () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
+104
-17
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, watch } from 'vue'
|
import { reactive, ref, watch } from 'vue'
|
||||||
|
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
middleware: 'auth',
|
middleware: 'auth',
|
||||||
@@ -13,6 +13,19 @@ const { getModerationFlags, updateModerationFlag } = useAdmin()
|
|||||||
const page = ref(1)
|
const page = ref(1)
|
||||||
const perPage = ref(10)
|
const perPage = ref(10)
|
||||||
const statusFilter = ref('')
|
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(
|
const { data: flagsRes, pending, refresh } = useAsyncData(
|
||||||
'admin-moderation-flags',
|
'admin-moderation-flags',
|
||||||
@@ -20,36 +33,72 @@ const { data: flagsRes, pending, refresh } = useAsyncData(
|
|||||||
{ watch: [page, statusFilter] }
|
{ watch: [page, statusFilter] }
|
||||||
)
|
)
|
||||||
|
|
||||||
const handleResolve = async (id: number, rejectReport: boolean) => {
|
const openResolveModal = (id: number, rejectReport: boolean) => {
|
||||||
const note = prompt('Inserisci una nota di risoluzione (opzionale):')
|
resolveModal.open = true
|
||||||
if (note === null) return // cancelled
|
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 = ''
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const res = await updateModerationFlag(id, {
|
const res = await updateModerationFlag(resolveModal.flagId, {
|
||||||
status: 'RESOLVED',
|
status: 'RESOLVED',
|
||||||
reject_report: rejectReport,
|
reject_report: resolveModal.rejectReport,
|
||||||
resolution_note: note
|
resolution_note: resolveModal.note || undefined
|
||||||
})
|
})
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
await refresh()
|
await refresh()
|
||||||
|
closeResolveModal()
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to resolve flag', err)
|
console.error('Failed to resolve flag', err)
|
||||||
alert('Errore durante la risoluzione della segnalazione.')
|
actionError.value = 'Errore durante la risoluzione della segnalazione.'
|
||||||
|
} finally {
|
||||||
|
resolveModal.pending = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleDismiss = async (id: number) => {
|
const openDismissModal = (id: number) => {
|
||||||
if (!confirm('Sei sicuro di voler ignorare (dismiss) questo flag?')) return
|
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 = ''
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const res = await updateModerationFlag(id, { status: 'DISMISSED' })
|
const res = await updateModerationFlag(dismissModal.flagId, { status: 'DISMISSED' })
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
await refresh()
|
await refresh()
|
||||||
|
closeDismissModal()
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to dismiss flag', err)
|
console.error('Failed to dismiss flag', err)
|
||||||
alert('Errore durante l\'aggiornamento.')
|
actionError.value = 'Errore durante l\'aggiornamento.'
|
||||||
|
} finally {
|
||||||
|
dismissModal.pending = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -88,6 +137,10 @@ const formatDate = (dateStr: string) => {
|
|||||||
Nessun elemento da moderare al momento.
|
Nessun elemento da moderare al momento.
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div v-if="actionError" class="alert alert-danger">
|
||||||
|
{{ actionError }}
|
||||||
|
</div>
|
||||||
|
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div class="card mb-3 shadow-sm border-0" v-for="flag in flagsRes.flags" :key="flag.id">
|
<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">
|
<div class="card-header bg-light d-flex justify-content-between align-items-center">
|
||||||
@@ -134,13 +187,13 @@ const formatDate = (dateStr: string) => {
|
|||||||
|
|
||||||
<div class="col-md-4 text-end" v-if="flag.status === 'OPEN'">
|
<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">
|
<div class="d-flex flex-column gap-2 mt-3 mt-md-0">
|
||||||
<button class="btn btn-outline-danger btn-sm" @click="handleResolve(flag.id, true)">
|
<button class="btn btn-outline-danger btn-sm" @click="openResolveModal(flag.id, true)">
|
||||||
<BIIcon name="it-ban" size="xs" /> Risolvi & Rigetta Segn.
|
<BIIcon name="it-ban" size="xs" /> Risolvi & Rigetta Segn.
|
||||||
</button>
|
</button>
|
||||||
<button class="btn btn-outline-warning btn-sm" @click="handleResolve(flag.id, false)">
|
<button class="btn btn-outline-warning btn-sm" @click="openResolveModal(flag.id, false)">
|
||||||
<BIIcon name="it-check" size="xs" /> Risolvi (Solo Avviso)
|
<BIIcon name="it-check" size="xs" /> Risolvi (Solo Avviso)
|
||||||
</button>
|
</button>
|
||||||
<button class="btn btn-outline-secondary btn-sm" @click="handleDismiss(flag.id)">
|
<button class="btn btn-outline-secondary btn-sm" @click="openDismissModal(flag.id)">
|
||||||
<BIIcon name="it-close" size="xs" /> Ignora Flag
|
<BIIcon name="it-close" size="xs" /> Ignora Flag
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -157,5 +210,39 @@ const formatDate = (dateStr: string) => {
|
|||||||
@page-change="page = $event"
|
@page-change="page = $event"
|
||||||
/>
|
/>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -13,7 +13,18 @@ const { getUsers, updateUserBan, updateUserRoles } = useAdmin()
|
|||||||
const { data: usersRes, pending, refresh } = useAsyncData('admin-users', () => getUsers())
|
const { data: usersRes, pending, refresh } = useAsyncData('admin-users', () => getUsers())
|
||||||
|
|
||||||
const search = ref('')
|
const search = ref('')
|
||||||
const parseRoles = (roles?: string) => roles ? roles.split(',').map((r) => r.trim()).filter(Boolean) : []
|
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().toUpperCase()).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 filteredUsers = computed(() => {
|
const filteredUsers = computed(() => {
|
||||||
if (!usersRes.value?.users) return []
|
if (!usersRes.value?.users) return []
|
||||||
@@ -27,17 +38,33 @@ const filteredUsers = computed(() => {
|
|||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
const handleToggleBan = async (id: number, currentBanStatus: boolean) => {
|
const askToggleBan = (user: any) => {
|
||||||
if (!confirm(`Sei sicuro di voler ${currentBanStatus ? 'sbloccare' : 'bannare'} questo utente?`)) return
|
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 = ''
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const res = await updateUserBan(id, { banned: !currentBanStatus })
|
const res = await updateUserBan(user.id, { banned: !user.banned })
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
await refresh()
|
await refresh()
|
||||||
|
pendingBanUser.value = null
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to update user ban status', err)
|
console.error('Failed to update user ban status', err)
|
||||||
alert('Errore durante l\'aggiornamento dello stato di ban.')
|
banError.value = 'Errore durante l\'aggiornamento dello stato di ban.'
|
||||||
|
} finally {
|
||||||
|
isUpdatingBan.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -58,7 +85,8 @@ const closeRoleModal = () => {
|
|||||||
|
|
||||||
const saveRoles = async () => {
|
const saveRoles = async () => {
|
||||||
if (!editingUserId.value) return
|
if (!editingUserId.value) return
|
||||||
|
|
||||||
|
roleError.value = ''
|
||||||
try {
|
try {
|
||||||
const res = await updateUserRoles(editingUserId.value, { roles: selectedRoles.value })
|
const res = await updateUserRoles(editingUserId.value, { roles: selectedRoles.value })
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
@@ -67,7 +95,7 @@ const saveRoles = async () => {
|
|||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to update roles', err)
|
console.error('Failed to update roles', err)
|
||||||
alert('Errore durante l\'aggiornamento dei ruoli.')
|
roleError.value = 'Errore durante l\'aggiornamento dei ruoli.'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -95,6 +123,14 @@ const saveRoles = async () => {
|
|||||||
Nessun utente trovato.
|
Nessun utente trovato.
|
||||||
</div>
|
</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">
|
<div v-else class="table-responsive">
|
||||||
<table class="table table-hover align-middle">
|
<table class="table table-hover align-middle">
|
||||||
<thead>
|
<thead>
|
||||||
@@ -138,7 +174,7 @@ const saveRoles = async () => {
|
|||||||
<button
|
<button
|
||||||
class="btn btn-sm"
|
class="btn btn-sm"
|
||||||
:class="user.banned ? 'btn-outline-success' : 'btn-outline-danger'"
|
:class="user.banned ? 'btn-outline-success' : 'btn-outline-danger'"
|
||||||
@click="handleToggleBan(user.id, !!user.banned)"
|
@click="askToggleBan(user)"
|
||||||
>
|
>
|
||||||
{{ user.banned ? 'Sblocca' : 'Banna' }}
|
{{ user.banned ? 'Sblocca' : 'Banna' }}
|
||||||
</button>
|
</button>
|
||||||
@@ -177,5 +213,16 @@ const saveRoles = async () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -17,7 +17,7 @@ if (!reportId) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { getReportDetail, getMessages, addMessage, flagMessage } = useReports()
|
const { getReportDetail, getMessages, addMessage, flagMessage } = useReports()
|
||||||
const { getInterventionSummary, updateReportStatus, assignTeam, getTeams } = useOperator()
|
const { getInterventionSummary, updateReportStatus, assignTeam, getTeams, createInterventionLink, revokeInterventionLink } = useOperator()
|
||||||
const { user } = useAuth()
|
const { user } = useAuth()
|
||||||
|
|
||||||
// Dati principali
|
// Dati principali
|
||||||
@@ -52,6 +52,13 @@ const isUpdatingStatus = ref(false)
|
|||||||
const isAssignModalOpen = ref(false)
|
const isAssignModalOpen = ref(false)
|
||||||
const selectedTeamId = ref<number | null>(null)
|
const selectedTeamId = ref<number | null>(null)
|
||||||
const isAssigning = ref(false)
|
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
|
// Messaggi
|
||||||
const isSubmittingMessage = ref(false)
|
const isSubmittingMessage = ref(false)
|
||||||
@@ -109,6 +116,72 @@ 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[]) => {
|
const handleSendMessage = async (msgText: string, files: File[]) => {
|
||||||
if (!msgText.trim() && files.length === 0) return
|
if (!msgText.trim() && files.length === 0) return
|
||||||
isSubmittingMessage.value = true
|
isSubmittingMessage.value = true
|
||||||
@@ -158,6 +231,10 @@ const latestCitizenMessage = computed(() => {
|
|||||||
.reverse()
|
.reverse()
|
||||||
.find((message) => message.user_id === reportUserId) || null
|
.find((message) => message.user_id === reportUserId) || null
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const formattedInterventionLinkExpiry = computed(() =>
|
||||||
|
interventionLinkExpiresAt.value ? formatDate(interventionLinkExpiresAt.value) : ''
|
||||||
|
)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -292,6 +369,54 @@ const latestCitizenMessage = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
</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 card-bg border-0 shadow-sm mb-4">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h2 class="h6 mb-3">Aggiorna stato</h2>
|
<h2 class="h6 mb-3">Aggiorna stato</h2>
|
||||||
@@ -375,6 +500,16 @@ const latestCitizenMessage = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
</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>
|
||||||
<div v-else class="text-center py-5">
|
<div v-else class="text-center py-5">
|
||||||
<div class="spinner-border text-primary" role="status"></div>
|
<div class="spinner-border text-primary" role="status"></div>
|
||||||
|
|||||||
Vendored
+28
-1
@@ -267,11 +267,24 @@ export interface CreateAreaRequest {
|
|||||||
description?: string;
|
description?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface UpdateAreaRequest {
|
||||||
|
name?: string;
|
||||||
|
boundary_geojson?: GeoJsonObject;
|
||||||
|
description?: string;
|
||||||
|
active?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
export interface CreateCategoryRequest {
|
export interface CreateCategoryRequest {
|
||||||
name: string;
|
name: string;
|
||||||
description?: string;
|
description?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface UpdateCategoryRequest {
|
||||||
|
name?: string;
|
||||||
|
description?: string;
|
||||||
|
active?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
export interface CreateTeamRequest {
|
export interface CreateTeamRequest {
|
||||||
team_category_id: number;
|
team_category_id: number;
|
||||||
name: string;
|
name: string;
|
||||||
@@ -279,6 +292,14 @@ export interface CreateTeamRequest {
|
|||||||
area_id?: number;
|
area_id?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface UpdateTeamRequest {
|
||||||
|
team_category_id?: number;
|
||||||
|
name?: string;
|
||||||
|
description?: string;
|
||||||
|
area_id?: number | null;
|
||||||
|
active?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
export interface UpdateUserBanRequest {
|
export interface UpdateUserBanRequest {
|
||||||
banned: boolean;
|
banned: boolean;
|
||||||
}
|
}
|
||||||
@@ -346,6 +367,12 @@ export interface InterventionSummaryResponse {
|
|||||||
latest_messages: Message[];
|
latest_messages: Message[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface AssignmentLinkResponse {
|
||||||
|
ok: boolean;
|
||||||
|
url: string;
|
||||||
|
expires_at: string;
|
||||||
|
}
|
||||||
|
|
||||||
export interface MediaUploadResponse {
|
export interface MediaUploadResponse {
|
||||||
ok: boolean;
|
ok: boolean;
|
||||||
media: Media[];
|
media: Media[];
|
||||||
@@ -416,4 +443,4 @@ export interface OverviewStatsResponse {
|
|||||||
avg_resolution_hours_by_area: { area: string; value: number }[];
|
avg_resolution_hours_by_area: { area: string; value: number }[];
|
||||||
total_users?: number;
|
total_users?: number;
|
||||||
open_reports?: number;
|
open_reports?: number;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
|
import { BARI_BOUNDS, isWithinBariBounds } from '~/utils/bari'
|
||||||
|
|
||||||
interface NominatimAddress {
|
interface NominatimAddress {
|
||||||
road?: string
|
road?: string
|
||||||
house_number?: string
|
house_number?: string
|
||||||
@@ -27,26 +29,8 @@ export interface GeocodingSuggestion {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const NOMINATIM_BASE_URL = 'https://nominatim.openstreetmap.org'
|
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 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) => {
|
const compactAddress = (displayName: string, address?: NominatimAddress) => {
|
||||||
if (!address) {
|
if (!address) {
|
||||||
return displayName
|
return displayName
|
||||||
@@ -91,9 +75,7 @@ export const searchAddresses = async (query: string, limit = 5) => {
|
|||||||
limit: String(limit)
|
limit: String(limit)
|
||||||
})
|
})
|
||||||
|
|
||||||
const results = await $fetch<NominatimResult[]>(`${NOMINATIM_BASE_URL}/search?${params.toString()}`, {
|
const results = await $fetch<NominatimResult[]>(`${NOMINATIM_BASE_URL}/search?${params.toString()}`)
|
||||||
headers: NOMINATIM_HEADERS
|
|
||||||
})
|
|
||||||
|
|
||||||
return results
|
return results
|
||||||
.map(toSuggestion)
|
.map(toSuggestion)
|
||||||
@@ -111,9 +93,7 @@ export const reverseGeocode = async (latitude: number, longitude: number) => {
|
|||||||
'accept-language': 'it'
|
'accept-language': 'it'
|
||||||
})
|
})
|
||||||
|
|
||||||
const result = await $fetch<NominatimResult | null>(`${NOMINATIM_BASE_URL}/reverse?${params.toString()}`, {
|
const result = await $fetch<NominatimResult | null>(`${NOMINATIM_BASE_URL}/reverse?${params.toString()}`)
|
||||||
headers: NOMINATIM_HEADERS
|
|
||||||
})
|
|
||||||
|
|
||||||
if (!result) {
|
if (!result) {
|
||||||
return ''
|
return ''
|
||||||
+2
-23
@@ -8,6 +8,8 @@ export default defineNuxtConfig({
|
|||||||
'@nuxtjs/sitemap',
|
'@nuxtjs/sitemap',
|
||||||
'@nuxtjs/robots'
|
'@nuxtjs/robots'
|
||||||
],
|
],
|
||||||
|
// TODO: riattivare prima di pubblicare il sito
|
||||||
|
ssr: false,
|
||||||
|
|
||||||
runtimeConfig: {
|
runtimeConfig: {
|
||||||
public: {
|
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: {
|
app: {
|
||||||
head: {
|
head: {
|
||||||
link: [
|
link: [
|
||||||
|
|||||||
@@ -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 }
|
|
||||||
})
|
|
||||||
@@ -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 }
|
|
||||||
})
|
|
||||||
Reference in New Issue
Block a user