{{--
    Danh sách dịch vụ (nạp lại bằng AJAX khi tìm kiếm / lọc; CombosController cũng trả view này khi search).
    Style bảng dùng chung: .crm-list-table (public/css/crm-2026/components.css).
    Lưu ý: JS ở index thay nội dung bằng $('.table-responsive').html(data) nên phần tử gốc PHẢI giữ class
    .table-responsive và chứa luôn footer (nếu tách footer ra ngoài sẽ bị nhân đôi footer sau mỗi lần tìm).
    Giữ hook JS: nút xoá .delete[data-url] (xử lý chung trong layout/_script.blade.php).
--}}
<div class="table-responsive crm-list">
    <table class="table crm-list-table">
        <thead>
        <tr>
            <th class="crm-list-table__no">STT</th>
            <th class="crm-list-table__thumb">Ảnh</th>
            <th>Tên</th>
            <th>Mã</th>
            <th>Nhà cung cấp</th>
            <th>Thuộc danh mục</th>
            <th>Trạng thái</th>
            <th class="crm-list-table__actions">Thao tác</th>
        </tr>
        </thead>
        <tbody>
        @if(@count($docs))
            @foreach($docs as $k => $s)
                <tr>
                    {{-- STT liên tục theo trang --}}
                    <td class="crm-list-table__no">{{ $docs->firstItem() + $k }}</td>
                    <td class="crm-list-table__thumb">
                        <img src="{{App\Helpers\Functions::getImageModels($s,'services','images')}}" alt="{{ @$s->name }}" class="crm-list-thumb">
                    </td>
                    <td>
                        <a class="crm-list-table__title" href="{{ url('services/' . $s->id . '/edit') }}">{{@$s->name}}</a>
                    </td>
                    <td>
                        @if(@$s->code)
                            <span class="crm-code-chip">{{@$s->code}}</span>
                        @endif
                    </td>
                    <td>{{@$s->trademarks->name}}</td>
                    <td>{{@$s->category->name}}</td>
                    <td>{{@$s->active_text}}</td>
                    <td class="crm-list-table__actions">
                        <a class="crm-action-btn crm-action-btn--edit" href="{{ url('services/' . $s->id . '/edit') }}"
                           data-toggle="tooltip" title="Sửa" aria-label="Sửa {{ @$s->name }}">
                            <i class="fas fa-pen"></i>
                        </a>
                        <a class="crm-action-btn crm-action-btn--delete delete" href="javascript:void(0)"
                           data-url="{{ url('services/' . $s->id) }}" data-toggle="tooltip" title="Xoá" aria-label="Xoá {{ @$s->name }}">
                            <i class="fas fa-trash-alt"></i>
                        </a>
                    </td>
                </tr>
            @endforeach
        @else
            <tr>
                <td id="no-data" colspan="8">
                    <div class="crm-list-empty">
                        <i class="fas fa-folder-open"></i>
                        <span>Không tồn tại dữ liệu</span>
                    </div>
                </td>
            </tr>
        @endif
        </tbody>
    </table>
    <div class="crm-list-footer">
        <span class="crm-list-footer__total">Tổng số <b>{{ number_format($docs->total()) }}</b> bản ghi</span>
        {{ $docs->appends(['category_id' => @$input['category_id'],'search' => @$input['search'] ])->links() }}
    </div>
</div>
<script>
    // Tooltip cho nút thao tác (nội dung được nạp lại bằng AJAX nên khởi tạo lại mỗi lần)
    if ($.fn.tooltip) {
        $('.crm-list-table [data-toggle="tooltip"]').tooltip({trigger: 'hover', placement: 'top'});
    }
</script>