dbstorage/dbapp/lyngsatapp/templates/lyngsatapp/lyngsat_list.html

{% extends 'mainapp/base.html' %}

{% block title %}Источники LyngSat{% endblock %}

{% block extra_css %}
<style>
    .table-responsive tr.selected {
        background-color: #d4edff;
    }
    .sticky-top {
        position: sticky;
        top: 0;
        z-index: 10;
    }
</style>
{% endblock %}

{% block content %}
<div class="container-fluid px-3">
    <!-- Page Header -->
    <div class="row mb-3">
        <div class="col-12">
            <h2>Данные по ИРИ с ресурса LyngSat</h2>
        </div>
    </div>

    <!-- Toolbar Component -->
    <div class="row mb-3">
        <div class="col-12">
            {% include 'mainapp/components/_toolbar.html' with show_search=True show_filters=True show_actions=True search_placeholder="Поиск по ID..." action_buttons=action_buttons_html %}
        </div>
    </div>

    <!-- Filter Panel Component -->
    {% include 'mainapp/components/_filter_panel.html' with filters=filter_html_list %}

    <!-- Main Table -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body p-0">
                    <div class="table-responsive" style="max-height: 75vh; overflow-y: auto;">
                        <table class="table table-striped table-hover table-sm table-bordered mb-0" style="font-size: 0.85rem;">
                            <thead class="table-dark sticky-top">
                                <tr>
                                    <th scope="col" class="text-center" style="min-width: 60px;">
                                        {% include 'mainapp/components/_sort_header.html' with field='id' label='ID' current_sort=sort %}
                                    </th>
                                    <th scope="col" style="min-width: 120px;">Спутник</th>
                                    <th scope="col" style="min-width: 100px;">
                                        {% include 'mainapp/components/_sort_header.html' with field='frequency' label='Частота, МГц' current_sort=sort %}
                                    </th>
                                    <th scope="col" style="min-width: 100px;">Поляризация</th>
                                    <th scope="col" style="min-width: 120px;">
                                        {% include 'mainapp/components/_sort_header.html' with field='sym_velocity' label='Сим. скорость, БОД' current_sort=sort %}
                                    </th>
                                    <th scope="col" style="min-width: 100px;">Модуляция</th>
                                    <th scope="col" style="min-width: 100px;">Стандарт</th>
                                    <th scope="col" style="min-width: 80px;">FEC</th>
                                    <th scope="col" style="min-width: 150px;">Описание</th>
                                    <th scope="col" style="min-width: 120px;">
                                        {% include 'mainapp/components/_sort_header.html' with field='last_update' label='Обновлено' current_sort=sort %}
                                    </th>
                                    <th scope="col" style="min-width: 100px;">Ссылка</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for item in lyngsat_items %}
                                <tr>
                                    <td class="text-center">{{ item.id }}</td>
                                    <td>
                                        {% if item.id_satellite %}
                                        <a href="#" class="text-decoration-underline"
                                            onclick="showSatelliteModal({{ item.id_satellite.id }}); return false;">
                                            {{ item.id_satellite.name }}
                                        </a>
                                        {% else %}
                                        -
                                        {% endif %}
                                    </td>
                                    <td>{{ item.frequency|floatformat:3|default:"-" }}</td>
                                    <td>{{ item.polarization.name|default:"-" }}</td>
                                    <td>{{ item.sym_velocity|floatformat:0|default:"-" }}</td>
                                    <td>{{ item.modulation.name|default:"-" }}</td>
                                    <td>{{ item.standard.name|default:"-" }}</td>
                                    <td>{{ item.fec|default:"-" }}</td>
                                    <td>{{ item.channel_info|default:"-" }}</td>
                                    <td>{{ item.last_update|date:"d.m.Y"|default:"-" }}</td>
                                    <td>
                                        {% if item.url %}
                                            <a href="{{ item.url }}" target="_blank" class="btn btn-sm btn-outline-primary" title="Открыть ссылку">
                                                <i class="bi bi-link-45deg"></i>
                                            </a>
                                        {% else %}
                                            -
                                        {% endif %}
                                    </td>
                                </tr>
                                {% empty %}
                                <tr>
                                    <td colspan="11" class="text-center text-muted">Нет данных для отображения</td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{% endblock %}

{% block extra_js %}
{% load static %}
<!-- Include sorting functionality -->
<script src="{% static 'js/sorting.js' %}"></script>

<script>
// Function to select/deselect all options in a select element
function selectAllOptions(selectName, selectAll) {
    const selectElement = document.querySelector(`select[name="${selectName}"]`);
    if (selectElement) {
        for (let i = 0; i < selectElement.options.length; i++) {
            selectElement.options[i].selected = selectAll;
        }
    }
}

// Enhanced filter counter for multi-select fields
document.addEventListener('DOMContentLoaded', function() {
    const form = document.getElementById('filter-form');
    if (form) {
        // Add event listeners to multi-select fields
        const selectFields = form.querySelectorAll('select[multiple]');
        selectFields.forEach(select => {
            select.addEventListener('change', function() {
                // Trigger the filter counter update from _filter_panel.html
                const event = new Event('change', { bubbles: true });
                form.dispatchEvent(event);
            });
        });
    }
});
</script>

<!-- Include the satellite modal component -->
{% include 'mainapp/components/_satellite_modal.html' %}

{% endblock %}