125 lines
No EOL
4.6 KiB
HTML
125 lines
No EOL
4.6 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Fragify{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="text-center">
|
|
<h1 class="title display-4">Fragify</h1>
|
|
<p class="description">
|
|
Erstelle einfach Links für Anfragen bei dem Portal
|
|
<a href="https://fragdenstaat.de" target="_blank" class="text-decoration-none">FragDenStaat.de</a>,
|
|
welche du vorausfüllen und an Freund:innen schicken kannst!
|
|
</p>
|
|
|
|
<form id="fragifyForm" class="text-start">
|
|
<div class="mb-4">
|
|
<label for="publicbody" class="form-label fw-bold">Behörde</label>
|
|
<select class="form-select" id="publicbody" name="publicbody_id" required>
|
|
<option value="">Behörde auswählen...</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label for="subject" class="form-label fw-bold">Betreff</label>
|
|
<input type="text" class="form-control" id="subject" name="subject"
|
|
placeholder="Betreff der Anfrage" required>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label for="body" class="form-label fw-bold">Dokumente anfragen:</label>
|
|
<textarea class="form-control" id="body" name="body" rows="5"
|
|
placeholder="Beschreibe hier, welche Dokumente oder Informationen du anfragen möchtest..." required></textarea>
|
|
</div>
|
|
|
|
<div class="text-center">
|
|
<button type="submit" class="btn btn-primary btn-lg">
|
|
<span class="btn-text">Anfrage Link generieren</span>
|
|
<span class="loading spinner-border spinner-border-sm ms-2" role="status"></span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div id="result" class="mt-4" style="display: none;">
|
|
<h5 class="text-success mb-3">Link erfolgreich generiert!</h5>
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" id="generatedLinkInput" readonly>
|
|
<button class="btn btn-outline-primary" type="button" id="copyBtn">In Zwischenablage</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
$(document).ready(function() {
|
|
// Initialize Select2 for public bodies
|
|
$('#publicbody').select2({
|
|
theme: 'bootstrap-5',
|
|
placeholder: 'Behörde auswählen...',
|
|
allowClear: true,
|
|
ajax: {
|
|
url: '/api/publicbodies',
|
|
dataType: 'json',
|
|
delay: 250,
|
|
data: function(params) {
|
|
return {
|
|
search: params.term,
|
|
page: params.page || 1
|
|
};
|
|
},
|
|
processResults: function(data, params) {
|
|
params.page = params.page || 1;
|
|
return {
|
|
results: data.objects.map(function(item) {
|
|
return {
|
|
id: item.id,
|
|
text: item.name + ' (' + item.jurisdiction.name + ')'
|
|
};
|
|
}),
|
|
pagination: {
|
|
more: data.meta.next !== null
|
|
}
|
|
};
|
|
},
|
|
cache: true
|
|
}
|
|
});
|
|
|
|
// Handle form submission (client-side)
|
|
$('#fragifyForm').on('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
const publicbodyId = $('#publicbody').val() || '';
|
|
const subject = $('#subject').val() || '';
|
|
const body = $('#body').val() || '';
|
|
|
|
let link = 'https://fragdenstaat.de/anfrage-stellen/';
|
|
if (publicbodyId) {
|
|
link += `an/${publicbodyId}/`;
|
|
}
|
|
|
|
const params = new URLSearchParams();
|
|
if (subject) params.set('subject', subject);
|
|
if (body) params.set('body', body);
|
|
|
|
if ([...params].length > 0) {
|
|
link += `?${params.toString()}`;
|
|
}
|
|
|
|
$('#generatedLinkInput').val(link);
|
|
$('#result').show();
|
|
});
|
|
|
|
// Copy to clipboard
|
|
$(document).on('click', '#copyBtn', function() {
|
|
const link = $('#generatedLinkInput').val();
|
|
navigator.clipboard.writeText(link).then(function() {
|
|
const btn = $('#copyBtn');
|
|
const originalText = btn.text();
|
|
btn.text('Kopiert!');
|
|
setTimeout(() => btn.text(originalText), 1500);
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %} |