{% extends 'base.html.twig' %}

{% block content %}
    <div class="container mt-4">
        <h1 class="mb-4">Quest bearbeiten: {{ quest.name }}</h1>

        <div class="row">
            <!-- Quest-Daten bearbeiten -->
            <div class="col-md-6">
                <div class="card shadow-sm mb-4">
                    <div class="card-header bg-primary text-white">
                        <h3 class="card-title">Quest-Details</h3>
                    </div>
                    <div class="card-body">
                        {{ form_start(questForm) }}
                        <div class="mb-3">
                            {{ form_row(questForm.name) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(questForm.description) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(questForm.xpReward) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(questForm.moneyReward) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(questForm.requiredLevel) }}
                        </div>
                        <button type="submit" class="btn btn-primary btn-block">Speichern</button>
                        {{ form_end(questForm) }}
                    </div>
                </div>
            </div>

            <!-- Zonen bearbeiten -->
            <div class="col-md-6">
                <div class="card shadow-sm mb-4">
                    <div class="card-header bg-success text-white">
                        <h3 class="card-title">Quest-Zonen / Steps</h3>
                    </div>
                    <div class="card-body">
                        {{ form_start(zoneForm) }}
                        <div class="mb-3">
                            {{ form_row(zoneForm.step) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.minX) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.maxX) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.minY) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.maxY) }}
                        </div>
                        <!-- Hier wird das 'items' Feld hinzugefügt -->
                        <div class="mb-3">
                            {{ form_row(zoneForm.items) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.itemCoordinateX) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.itemCoordinateY) }}
                        </div>
                        <div class="mb-3">
                            {{ form_row(zoneForm.itemCoordinateZ) }}
                        </div>

                        <button type="submit" class="btn btn-success btn-block">Zone hinzufügen</button>
                        {{ form_end(zoneForm) }}

                    </div>
                </div>
            </div>
        </div>

        <hr>

        <h3 class="mb-4">Vorhandene Zonen</h3>
        <div class="table-responsive">
            <table class="table table-striped table-bordered">
                <thead>
                <tr>
                    <th>Min X</th>
                    <th>Max X</th>
                    <th>Min Y</th>
                    <th>Max Y</th>
                    <th>Aktionen</th>
                </tr>
                </thead>
                <tbody>
                {% for zone in zones %}
                    <tr>
                        <td>{{ zone.minX }}</td>
                        <td>{{ zone.maxX }}</td>
                        <td>{{ zone.minY }}</td>
                        <td>{{ zone.maxY }}</td>
                        <td>
                            <a href="{{ path('quest_zone_delete', { id: zone.id }) }}" class="btn btn-danger btn-sm">Löschen</a>
                        </td>
                    </tr>
                {% else %}
                    <tr>
                        <td colspan="5" class="text-center">Keine Zonen vorhanden.</td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
{% endblock %}