- Added "rejected_to_reviewer" state to the `ServerStates` enum. - Implemented routes and controller actions (`rejectToReviewer`, `rejectToReviewerUpdate`) for editors to reject datasets back to reviewers with a rejection note. - Added UI elements (button) in the editor dataset index and publish views to trigger the "reject to reviewer" action. - Updated the reviewer dataset index view to display datasets in the "rejected_to_reviewer" state and show the editor's rejection note. - Modified the reviewer dataset review page to allow reviewers to view and accept datasets that have been rejected back to them by editors. - Updated the database migration to include the "rejected_to_reviewer" state in the `documents_server_state_check` constraint. - Updated dependencies (pinia, redis).
124 lines
No EOL
3.1 KiB
Vue
124 lines
No EOL
3.1 KiB
Vue
<script setup>
|
|
import { onMounted, ref, watch } from 'vue';
|
|
import L from 'leaflet';
|
|
import 'leaflet/dist/leaflet.css';
|
|
|
|
const DEFAULT_BASE_LAYER_NAME = 'BaseLayer';
|
|
const DEFAULT_BASE_LAYER_ATTRIBUTION = '© <a target="_blank" href="http://osm.org/copyright">OpenStreetMap</a> contributors';
|
|
|
|
const props = defineProps({
|
|
coverage: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
height: {
|
|
type: String,
|
|
default: '250px'
|
|
},
|
|
mapId: {
|
|
type: String,
|
|
default: 'view-map'
|
|
}
|
|
});
|
|
|
|
const map = ref(null);
|
|
const mapContainer = ref(null);
|
|
|
|
onMounted(() => {
|
|
initializeMap();
|
|
});
|
|
|
|
watch(() => props.coverage, (newCoverage) => {
|
|
if (map.value && newCoverage) {
|
|
updateBounds();
|
|
}
|
|
}, { deep: true });
|
|
|
|
const initializeMap = () => {
|
|
// Create the map with minimal controls
|
|
map.value = L.map(mapContainer.value, {
|
|
zoomControl: false,
|
|
attributionControl: false,
|
|
dragging: false,
|
|
scrollWheelZoom: false,
|
|
doubleClickZoom: false,
|
|
boxZoom: false,
|
|
tap: false,
|
|
keyboard: false,
|
|
touchZoom: false
|
|
});
|
|
|
|
// // Add a simple tile layer (OpenStreetMap)
|
|
let osmGgray = new L.TileLayer.WMS('https://ows.terrestris.de/osm-gray/service', {
|
|
format: 'image/png',
|
|
attribution: DEFAULT_BASE_LAYER_ATTRIBUTION,
|
|
layers: 'OSM-WMS',
|
|
});
|
|
let layerOptions = {
|
|
label: DEFAULT_BASE_LAYER_NAME,
|
|
visible: true,
|
|
layer: osmGgray,
|
|
};
|
|
layerOptions.layer.addTo(map.value);
|
|
|
|
// Add a light-colored rectangle for the coverage area
|
|
updateBounds();
|
|
};
|
|
|
|
const updateBounds = () => {
|
|
if (!props.coverage || !map.value) return;
|
|
|
|
// Clear any existing layers except the base tile layer
|
|
map.value.eachLayer(layer => {
|
|
if (layer instanceof L.Rectangle) {
|
|
map.value.removeLayer(layer);
|
|
}
|
|
});
|
|
|
|
// Create bounds from the coverage coordinates
|
|
const bounds = L.latLngBounds(
|
|
[props.coverage.y_min, props.coverage.x_min],
|
|
[props.coverage.y_max, props.coverage.x_max]
|
|
);
|
|
|
|
// Add a rectangle with emerald styling
|
|
L.rectangle(bounds, {
|
|
color: '#10b981', // emerald-500
|
|
weight: 2,
|
|
fillColor: '#d1fae5', // emerald-100
|
|
fillOpacity: 0.5
|
|
}).addTo(map.value);
|
|
|
|
// Fit the map to the bounds with some padding
|
|
map.value.fitBounds(bounds, {
|
|
padding: [20, 20]
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div class="map-container bg-emerald-50 dark:bg-emerald-900/30
|
|
rounded-lg shadow-sm overflow-hidden">
|
|
<div :id="mapId" ref="mapContainer" :style="{ height: height }" class="w-full"></div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
/* Ensure the Leaflet container has proper styling */
|
|
:deep(.leaflet-container) {
|
|
background-color: #f0fdf4;
|
|
/* emerald-50 */
|
|
}
|
|
|
|
/* Dark mode adjustments */
|
|
@media (prefers-color-scheme: dark) {
|
|
:deep(.leaflet-container) {
|
|
background-color: rgba(6, 78, 59, 0.3);
|
|
/* emerald-900/30 */
|
|
}
|
|
|
|
:deep(.leaflet-tile) {
|
|
filter: brightness(0.8) contrast(1.2) grayscale(0.3);
|
|
}
|
|
}
|
|
</style> |