SARBase/templates/sar_details.html

45 lines
1.3 KiB
HTML

{% extends "base.html" %}
{% block title %}
SAR job details
{% endblock %}
{% block content %}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<style>
#map { height: 400px; }
.button { margin: 5px; }
</style>
<div class="container mt-4">
<h1 class="mb-4">SAR Job Details</h1>
<div class="card mb-4">
<div class="card-body">
<p><strong>ID:</strong> {{ sar.id }}</p>
<p><strong>Start Date:</strong> {{ sar.start_date }}</p>
<p><strong>Manager:</strong> {{ sar.manager }}</p>
<!-- Other SAR details -->
</div>
</div>
<div id="map" class="mb-4"></div>
<div>
<a href="{{ url_for('edit_sar', id=sar.id) }}" class="btn btn-primary">Edit</a>
<a href="{{ url_for('delete_sar', id=sar.id) }}" class="btn btn-danger">Delete</a>
</div>
</div>
<script>
var map = L.map('map').setView([{{ sar.latitude }}, {{ sar.longitude }}], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© OpenStreetMap contributors'
}).addTo(map);
L.marker([{{ sar.latitude }}, {{ sar.longitude }}]).addTo(map);
</script>
{% endblock %}