{% extends "base.html" %}

{% block title %}{{ _('Material Inventory') }}{% endblock %}

{% block content %}
<div class="container mt-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2>{{ _('Material Inventory') }}</h2>
        <div>
            <a href="{{ url_for('export_inventario_pdf') }}{% if sito_filter %}?sito={{ sito_filter }}{% endif %}" class="btn btn-danger">
                <i class="fas fa-file-pdf"></i> {{ _('Export PDF') }}
            </a>
            <a href="{{ url_for('create_inventario') }}" class="btn btn-primary">{{ _('New Artifact') }}</a>
        </div>
    </div>

    <!-- Filters -->
    <form method="GET" class="mb-4">
        <div class="row">
            <div class="col-md-5">
                <select name="sito" class="form-select">
                    <option value="">{{ _('All sites') }}</option>
                    {% for site in sites %}
                    <option value="{{ site.sito }}" {% if sito_filter == site.sito %}selected{% endif %}>{{ site.sito }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="col-md-5">
                <input type="text" name="tipo" class="form-control" placeholder="{{ _('Artifact type') }}" value="{{ tipo_filter or '' }}">
            </div>
            <div class="col-md-2">
                <button type="submit" class="btn btn-primary w-100">{{ _('Filter') }}</button>
            </div>
        </div>
    </form>

    <!-- Inventory Table -->
    {% if inventory_list %}
    <div class="table-responsive">
        <!-- Desktop/Tablet Table View -->
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>{{ _('Inventory No.') }}</th>
                    <th>{{ _('Site') }}</th>
                    <th>{{ _('Type') }}</th>
                    <th>{{ _('Definition') }}</th>
                    <th>US</th>
                    <th>{{ _('Weight (g)') }}</th>
                    <th>Media</th>
                    <th>{{ _('Actions') }}</th>
                </tr>
            </thead>
            <tbody>
                {% for item in inventory_list %}
                <tr>
                    <td><strong>{{ item.numero_inventario }}</strong></td>
                    <td>{{ item.sito }}</td>
                    <td>{{ item.tipo_reperto or '-' }}</td>
                    <td>{{ item.definizione or '-' }}</td>
                    <td>{{ item.us or '-' }}</td>
                    <td>{{ item.peso or '-' }}</td>
                    <td>
                        {% if item.id_invmat in media_ids %}
                            <span class="badge bg-success" title="{{ _('Has media attached') }}"><i class="fas fa-paperclip"></i> {{ _('Yes') }}</span>
                        {% else %}
                            <span class="badge bg-secondary" title="{{ _('No media') }}">{{ _('No') }}</span>
                        {% endif %}
                    </td>
                    <td>
                        <a href="{{ url_for('edit_inventario', inv_id=item.id_invmat) }}" class="btn btn-sm btn-primary">
                            <i class="fas fa-edit"></i> <span class="d-none d-lg-inline">{{ _('Edit') }}</span>
                        </a>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>

        <!-- Mobile Card View -->
        {% for item in inventory_list %}
        <div class="mobile-card">
            <div class="mobile-card-header">
                <i class="fas fa-archive"></i> {{ _('Inv.') }} {{ item.numero_inventario }} - {{ item.sito }}
            </div>
            <div class="mobile-card-body">
                {% if item.tipo_reperto %}
                <div class="label">{{ _('Artifact Type') }}</div>
                <div class="value">{{ item.tipo_reperto }}</div>
                {% endif %}
                {% if item.definizione %}
                <div class="label">{{ _('Definition') }}</div>
                <div class="value">{{ item.definizione }}</div>
                {% endif %}
                {% if item.us %}
                <div class="label">US</div>
                <div class="value">{{ item.us }}</div>
                {% endif %}
                {% if item.peso %}
                <div class="label">{{ _('Weight') }}</div>
                <div class="value">{{ item.peso }} g</div>
                {% endif %}
                <div class="label">Media</div>
                <div class="value">
                    {% if item.id_invmat in media_ids %}
                        <span class="badge bg-success"><i class="fas fa-paperclip"></i> {{ _('Yes') }}</span>
                    {% else %}
                        <span class="badge bg-secondary">{{ _('No') }}</span>
                    {% endif %}
                </div>
            </div>
            <div class="mobile-card-actions">
                <a href="{{ url_for('edit_inventario', inv_id=item.id_invmat) }}" class="btn btn-primary btn-sm">
                    <i class="fas fa-edit"></i> {{ _('Edit Artifact') }}
                </a>
            </div>
        </div>
        {% endfor %}
    </div>
    <p class="text-muted">{{ _('Total') }}: {{ total }} {{ _('artifacts') }}</p>
    {% else %}
    <div class="alert alert-info">{{ _('No artifacts found.') }}</div>
    {% endif %}
</div>
{% endblock %}