Initial commit

templates/bugreport_overzicht.html

@@ -0,0 +1,102 @@
+{% extends "base.html" %}
+
+{% block title %}Bugoverzicht{% endblock %}
+{% block page_title %}🐞 Bugoverzicht{% endblock %}
+{% block header_class %}header--bug{% endblock %}
+{% block main_class %}wide{% endblock %}
+
+{% block extra_css %}
+<style>
+    .text-wrap { max-width: 380px; white-space: pre-line; word-break: break-word; }
+    .foutcode-block { font-family: ui-monospace, Consolas, monospace; background: var(--surface-muted); border: 1px solid var(--border); padding: 3px 8px; border-radius: 4px; font-size: 12.5px; display: inline-block; max-width: 260px; word-break: break-all; }
+</style>
+{% endblock %}
+
+{% block content %}
+<div class="card">
+    <div class="page-head">
+        <h2>Ingediende bugreports</h2>
+        <div class="actions">
+            <a class="btn btn-success" href="{{ url_for('bugreport.bugreport') }}">➕ Nieuwe bug melden</a>
+        </div>
+    </div>
+
+    <div class="table-wrap">
+        <table>
+            <thead>
+                <tr>
+                    <th>ID</th>
+                    <th>Gebruiker</th>
+                    <th>Datum / tijd</th>
+                    <th>Omschrijving</th>
+                    <th>Foutcode</th>
+                    <th>Status</th>
+                    <th class="actions">Actie</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for bug in results %}
+                <tr>
+                    <td><strong>#{{ bug.Bug_ID }}</strong></td>
+                    <td>{{ bug.Gebruiker }}</td>
+                    <td class="nowrap">{{ bug.Datum.strftime('%d-%m-%Y %H:%M') if bug.Datum else '' }}</td>
+                    <td class="text-wrap">{{ bug.Omschrijving }}</td>
+                    <td>
+                        {% if bug.Foutcode %}<span class="foutcode-block">{{ bug.Foutcode }}</span>
+                        {% else %}<span class="muted"><em>Geen</em></span>{% endif %}
+                    </td>
+                    <td>
+                        {% if bug.Status == 'Fixed' %}<span class="badge badge-success">✅ Fixed</span>
+                        {% elif bug.Status == 'In behandeling' %}<span class="badge badge-warning">🧑‍💻 In behandeling</span>
+                        {% else %}<span class="badge badge-info">ℹ️ Nieuw</span>
+                        {% endif %}
+                    </td>
+                    <td class="actions">
+                        <button type="button" class="btn-sm btn-success" onclick="openStatusModal('{{ bug.Bug_ID }}')">Wijzig status</button>
+                    </td>
+                </tr>
+                {% else %}
+                <tr class="empty-row"><td colspan="7">Er zijn momenteel geen bugreports.</td></tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
+</div>
+{% endblock %}
+
+{% block modals %}
+<div id="statusModal" class="modal">
+    <div class="modal-content">
+        <span class="close" onclick="document.getElementById('statusModal').style.display='none'">&times;</span>
+        <h3>Status wijzigen voor bug <span id="modalBugId"></span></h3>
+
+        <form id="statusForm" method="POST" action="{{ url_for('bugreport_overzicht.bugreport_wijzig_status') }}">
+            <input type="hidden" name="Bug_ID" id="modalHiddenBugId">
+            <input type="hidden" name="new_status" id="modalHiddenStatus">
+            <button type="button" class="status-button status-info" id="btn-nieuw" onclick="submitStatus('Nieuw')">ℹ️ Nieuw</button>
+            <button type="button" class="status-button status-warning" id="btn-behandeling" onclick="submitStatus('In behandeling')">🧑‍💻 In behandeling</button>
+            <button type="button" class="status-button status-success" id="btn-fixed" onclick="submitStatus('Fixed')">✅ Fixed</button>
+        </form>
+    </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+    function openStatusModal(bugId) {
+        document.getElementById('modalBugId').textContent = '#' + bugId;
+        document.getElementById('modalHiddenBugId').value = bugId;
+        document.getElementById('statusModal').style.display = 'block';
+    }
+
+    function submitStatus(chosenStatus) {
+        document.getElementById('modalHiddenStatus').value = chosenStatus;
+        document.getElementById('statusForm').submit();
+    }
+
+    window.onclick = function (event) {
+        const modal = document.getElementById('statusModal');
+        if (event.target === modal) modal.style.display = 'none';
+    };
+</script>
+{% endblock %}