{% extends 'base.html' %}

{% block title %}جستجوی سریع{% endblock %}

{% block content %}

<div class="container-fluid">

    <!-- Header -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h4 class="fw-bold mb-1">
                <i class="bi bi-search"></i>
                جستجوی سریع
            </h4>

            {% if query %}
                <p class="text-muted mb-0">
                    نتایج جستجو برای:
                    <strong>{{ query }}</strong>
                </p>
            {% else %}
                <p class="text-muted mb-0">
                    تجهیزات و مکان‌ها را جستجو کنید.
                </p>
            {% endif %}
        </div>
    </div>


    <!-- Search Box -->
    <div class="card shadow-sm mb-4">
        <div class="card-body">

            <form method="get" action="{% url 'quick_search' %}">
                <div class="input-group">

                    <input
                        type="text"
                        name="q"
                        value="{{ query }}"
                        class="form-control"
                        placeholder="کد تجهیز، نام تجهیز، سریال، کد مکان، نام مکان..."
                        autofocus
                    >

                    <button type="submit" class="btn btn-primary">
                        <i class="bi bi-search"></i>
                        جستجو
                    </button>

                </div>
            </form>

        </div>
    </div>


    {% if query %}

        <!-- Assets -->
        <div class="card shadow-sm mb-4">

            <div class="card-header">
                <h5 class="mb-0">
                    <i class="bi bi-pc-display"></i>
                    تجهیزات
                    <span class="badge bg-primary">
                        {{ assets|length }}
                    </span>
                </h5>
            </div>

            <div class="card-body p-0">

                {% if assets %}

                    <div class="table-responsive">

                        <table class="table table-hover mb-0">

                            <thead>
                                <tr>
                                    <th>کد تجهیز</th>
                                    <th>نام تجهیز</th>
                                    <th>دسته</th>
                                    <th>برند</th>
                                    <th>مدل</th>
                                    <th>مکان</th>
                                    <th>عملیات</th>
                                </tr>
                            </thead>

                            <tbody>

                                {% for asset in assets %}

                                <tr>

                                    <td>
                                        <strong>{{ asset.asset_code }}</strong>
                                    </td>

                                    <td>
                                        {{ asset.name }}
                                    </td>

                                    <td>
                                        {{ asset.category.name }}
                                    </td>

                                    <td>
                                        {{ asset.brand|default:"-" }}
                                    </td>

                                    <td>
                                        {{ asset.model|default:"-" }}
                                    </td>

                                    <td>
                                        {{ asset.location.name }}
                                    </td>

                                    <td>
                                        <a
                                            href="{% url 'asset_detail' asset.pk %}"
                                            class="btn btn-sm btn-outline-primary"
                                        >
                                            <i class="bi bi-eye"></i>
                                            مشاهده
                                        </a>
                                    </td>

                                </tr>

                                {% endfor %}

                            </tbody>

                        </table>

                    </div>

                {% else %}

                    <div class="text-center text-muted py-4">
                        <i class="bi bi-search fs-2 d-block mb-2"></i>
                        هیچ تجهیزی پیدا نشد.
                    </div>

                {% endif %}

            </div>
        </div>


        <!-- Facilities -->
        <div class="card shadow-sm mb-4">

            <div class="card-header">
                <h5 class="mb-0">
                    <i class="bi bi-building"></i>
                    مکان‌ها
                    <span class="badge bg-success">
                        {{ facilities|length }}
                    </span>
                </h5>
            </div>

            <div class="card-body p-0">

                {% if facilities %}

                    <div class="table-responsive">

                        <table class="table table-hover mb-0">

                            <thead>
                                <tr>
                                    <th>کد مکان</th>
                                    <th>نام مکان</th>
                                    <th>نوع</th>
                                    <th>تعمیر</th>
                                    <th>طبقه</th>
                                    <th>شماره اتاق</th>
                                    <th>عملیات</th>
                                </tr>
                            </thead>

                            <tbody>

                                {% for facility in facilities %}

                                <tr>

                                    <td>
                                        <strong>{{ facility.code }}</strong>
                                    </td>

                                    <td>
                                        {{ facility.name }}
                                    </td>

                                    <td>
                                        {{ facility.get_facility_type_display }}
                                    </td>

                                    <td>
                                        {{ facility.building|default:"-" }}
                                    </td>

                                    <td>
                                        {{ facility.get_floor_display }}
                                    </td>

                                    <td>
                                        {{ facility.room_number|default:"-" }}
                                    </td>

                                    <td>
                                        <a
                                            href="{% url 'facility_detail' facility.pk %}"
                                            class="btn btn-sm btn-outline-success"
                                        >
                                            <i class="bi bi-eye"></i>
                                            مشاهده
                                        </a>
                                    </td>

                                </tr>

                                {% endfor %}

                            </tbody>

                        </table>

                    </div>

                {% else %}

                    <div class="text-center text-muted py-4">
                        <i class="bi bi-building fs-2 d-block mb-2"></i>
                        هیچ مکانی پیدا نشد.
                    </div>

                {% endif %}

            </div>
        </div>

    {% endif %}

</div>

{% endblock %}