<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.w3.org/1999/xhtml"
      layout:decorate="~{layouts/main-layout}">
<head>
    <title>Dynamic Plan</title>
    <link rel="stylesheet" href="/css/dynamic-plan.css"/>
</head>
<body>
<th:block layout:fragment="content">
    <div class="dynamic-plan-page py-3">
        <div class="d-flex justify-content-between align-items-start flex-wrap gap-3 mb-4">
            <div>
                <h2 class="mb-1">Dynamic Plan</h2>
                <div class="dynamic-plan-helper">Запуск расчета модели комплексного плана по одной заявке.</div>
            </div>
        </div>

        <div id="dynamic-plan-alert"></div>

        <div class="row g-4">
            <div class="col-12 col-xl-5">
                <div class="dynamic-plan-panel">
                    <div class="dynamic-plan-panel-header">
                        <div>
                            <div class="dynamic-plan-section-title">Параметры расчета</div>
                            <div class="dynamic-plan-helper mt-1">UUID заявки, выбранные КА и расчетный интервал.</div>
                        </div>
                    </div>
                    <form id="dynamic-plan-form" class="dynamic-plan-form">
                        <div class="mb-3">
                            <label for="dynamic-plan-request-id" class="form-label">UUID заявки</label>
                            <input id="dynamic-plan-request-id"
                                   type="text"
                                   class="form-control form-control-sm"
                                   required
                                   placeholder="00000000-0000-0000-0000-000000000000">
                        </div>
                        <div class="mb-3">
                            <label for="dynamic-plan-satellite-ids" class="form-label">Идентификаторы КА</label>
                            <input id="dynamic-plan-satellite-ids"
                                   type="text"
                                   class="form-control form-control-sm"
                                   required
                                   placeholder="56756, 62138">
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Вариант расчета</label>
                            <div class="dynamic-plan-mode-group" role="group" aria-label="Вариант расчета">
                                <input id="dynamic-plan-mode-full"
                                       type="radio"
                                       class="btn-check"
                                       name="dynamic-plan-mode"
                                       value="FULL"
                                       autocomplete="off"
                                       checked>
                                <label class="btn btn-outline-primary btn-sm" for="dynamic-plan-mode-full">
                                    Полный
                                </label>

                                <input id="dynamic-plan-mode-greedy"
                                       type="radio"
                                       class="btn-check"
                                       name="dynamic-plan-mode"
                                       value="GREEDY"
                                       autocomplete="off">
                                <label class="btn btn-outline-primary btn-sm" for="dynamic-plan-mode-greedy">
                                    Жадный
                                </label>
                            </div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Виток для жадного расчета</label>
                            <div class="dynamic-plan-revolution-group" role="group" aria-label="Виток для жадного расчета">
                                <input id="dynamic-plan-revolution-both"
                                       type="radio"
                                       class="btn-check"
                                       name="dynamic-plan-revolution-mode"
                                       value="BOTH"
                                       autocomplete="off"
                                       checked>
                                <label class="btn btn-outline-primary btn-sm" for="dynamic-plan-revolution-both">
                                    Оба
                                </label>

                                <input id="dynamic-plan-revolution-asc"
                                       type="radio"
                                       class="btn-check"
                                       name="dynamic-plan-revolution-mode"
                                       value="ASC"
                                       autocomplete="off">
                                <label class="btn btn-outline-primary btn-sm" for="dynamic-plan-revolution-asc">
                                    Восх.
                                </label>

                                <input id="dynamic-plan-revolution-desc"
                                       type="radio"
                                       class="btn-check"
                                       name="dynamic-plan-revolution-mode"
                                       value="DESC"
                                       autocomplete="off">
                                <label class="btn btn-outline-primary btn-sm" for="dynamic-plan-revolution-desc">
                                    Нисх.
                                </label>
                            </div>
                        </div>
                        <div class="form-check mb-3">
                            <input id="dynamic-plan-filter-covered-routes"
                                   type="checkbox"
                                   class="form-check-input">
                            <label for="dynamic-plan-filter-covered-routes" class="form-check-label">
                                Удалять маршруты по уже снятой территории
                            </label>
                        </div>
                        <div class="mb-3">
                            <label for="dynamic-plan-interval-start" class="form-label">Дата начала интервала</label>
                            <input id="dynamic-plan-interval-start"
                                   type="date"
                                   class="form-control form-control-sm"
                                   required>
                        </div>
                        <div class="mb-3">
                            <label for="dynamic-plan-interval-end" class="form-label">Дата конца интервала</label>
                            <input id="dynamic-plan-interval-end"
                                   type="date"
                                   class="form-control form-control-sm"
                                   required>
                        </div>
                        <button id="dynamic-plan-submit" type="submit" class="btn btn-primary btn-sm">
                            Запустить
                        </button>
                    </form>
                </div>

                <div class="dynamic-plan-panel mt-4">
                    <div class="dynamic-plan-panel-header">
                        <div>
                            <div class="dynamic-plan-section-title">История запусков</div>
                            <div id="dynamic-plan-runs-meta" class="dynamic-plan-helper mt-1">Последние расчеты.</div>
                        </div>
                        <button id="dynamic-plan-runs-refresh" type="button" class="btn btn-outline-secondary btn-sm">
                            Обновить
                        </button>
                    </div>
                    <div id="dynamic-plan-runs-body" class="dynamic-plan-runs">
                        <div class="text-muted py-4 text-center">Нет данных</div>
                    </div>
                </div>
            </div>

            <div class="col-12 col-xl-7">
                <div class="dynamic-plan-panel">
                    <div class="dynamic-plan-panel-header">
                        <div>
                            <div class="dynamic-plan-section-title">Запуск и результат</div>
                            <div id="dynamic-plan-result-meta" class="dynamic-plan-helper mt-1">Расчет еще не запускался.</div>
                        </div>
                    </div>
                    <div id="dynamic-plan-result" class="dynamic-plan-result">
                        <div class="text-muted py-5 text-center">Нет данных</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="/dynamic_plan_map_layers.js"></script>
    <script src="/dynamic_plan_scripts.js"></script>
</th:block>
</body>
</html>
