{% extends 'base.html' %}

{% block content %}
    <div class="row is-vertical-align mb-5">
        <div class="col"></div>
        <form class="col-6 card is-vertical-align" method="post">
            <h3 class="is-center mb-5">Создание аренды</h3>
            {% if errors %}
            <div class="alert alert-danger mb-3 h4" role="alert">
                {{ errors }}
            </div>
            {% endif %}
            <div class="row mb-3">
                <label class="h4">
                    Клиент:
                    <select id="client_id" name="client_id" class="mt-2">
                        {% for client in clients %}
                            <option {% if selected_client and selected_client == client['id'] %} selected {% endif %} value="{{ client['id'] }}">ФИО: {{ client['surname'] }} {{ client['name'][0] }}. {{ client['middlename'][0] }}. Телефон: {{ client['phone'] }}</option>
                        {% endfor %}
                    </select>
                </label>
            </div>
            <div class="row mb-3">
                <label class="h4">
                    Машина:
                    <select id="car_id" name="car_id" class="mt-2">
                        {% for car in cars %}
                            <option {% if selected_car and selected_car == car['id'] %} selected {% endif %} value="{{ car['id'] }}">Марка: {{ car['brand'] }}. Модель: {{ car['model'] }}. Цена: {{ car['price'] }}</option>
                        {% endfor %}
                    </select>
                </label>
            </div>
            <div class="row mb-5">
                <button class="button primary is-center">Создать запись об аренде</button>
            </div>
        </form>
        <div class="col"></div>
    </div>
    <div class="row is-vertical-align mt-5">
        <div class="card col table table-striped">
            <h2 class="is-center mb-4">Действительные аренды</h2>
            <table>
                <tr>
                    <th class="h4">Дата начала</th>
                    <th class="h4">Номер телефона клиента</th>
                    <th class="h4">Клиент</th>
                    <th class="h4">Автомобиль</th>
                    <th class="h4">Цена за минуту</th>
                    <th class="h4">Действия</th>
                </tr>
                {% for rent in rents|sort(reverse=true, attribute="start_time") %}
                    {% if not rent.time_amount %}
                        <tr>
                            <td class="h4">{{ rent.start_time }}</td>
                            <td class="h4">{{ rent.client.phone }}</td>
                            <td class="h4"><a href="{{ url_for('clients', id=rent.client_id) }}">{{ rent.client.surname }} {{ rent.client.name }} {{ rent.client.middlename }}</a></td>
                            <td class="h4"><a href="{{ url_for('cars', id=rent.car_id) }}">{{ rent.car.brand }} {{ rent.car.model }}</a></td>
                            <td class="h4">{{ rent.car.price }}</td>
                            <td>
                                <form method="post" class="row">
                                    <input name="id" value="{{ rent.id }}" style="visibility: hidden">
                                    <button class="button primary outline col">Завершить</button>
                                </form>
                            </td>
                        </tr>
                    {% endif %}
                {% endfor %}
            </table>
        </div>
    </div>
    <div class="row is-vertical-align mt-5">
        <div class="card col table table-striped">
            <h2 class="is-center mb-4">Завершённые аренды</h2>
            <table>
                <tr>
                    <th class="h4">Дата начала</th>
                    <th class="h4">Номер телефона клиента</th>
                    <th class="h4">Клиент</th>
                    <th class="h4">Автомобиль</th>
                    <th class="h4">Цена за минуту</th>
                    <th class="h4">Действия</th>
                </tr>
                {% for rent in rents|sort(reverse=true, attribute="start_time") %}
                    {% if rent.time_amount %}
                        <tr>
                            <td class="h4">{{ rent.start_time }}</td>
                            <td class="h4">{{ rent.client.phone }}</td>
                            <td class="h4"><a href="{{ url_for('clients', id=rent.client_id) }}">{{ rent.client.surname }} {{ rent.client.name }} {{ rent.client.middlename }}</a></td>
                            <td class="h4"><a href="{{ url_for('cars', id=rent.car_id) }}">{{ rent.car.brand }} {{ rent.car.model }}</a></td>
                            <td class="h4">{{ rent.car.price }}</td>
                            <td>
                                <a href="{{ url_for('rent', id=rent.id) }}" class="button primary outline">Посмотреть</a>
                            </td>
                        </tr>
                    {% endif %}
                {% endfor %}
            </table>
        </div>
    </div>
{% endblock %}

{% block script %}
    <script>
        $(document).ready(function() {
            $('#client_id').select2();
            $('#car_id').select2();
        });
    </script>
{% endblock %}