@extends('layouts.app')

@push('pageTitle')
    {{ __('labels.download_logs') }}
@endpush

@push('css')
<style>
    .file-preview {
        width: 40px;
        height: 40px;
        object-fit: cover;
        border-radius: 8px;
        cursor: pointer;
        transition: transform 0.2s;
    }
    .file-preview:hover {
        transform: scale(1.1);
    }
    .file-icon {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f8f9fa;
        border-radius: 8px;
        font-size: 20px;
    }
    .status-badge {
        padding: 5px 12px;
        border-radius: 20px;
        font-size: 12px;
        font-weight: 500;
    }
    .table-row:hover {
        background-color: #f8f9fa;
    }
    .file-info {
        display: flex;
        align-items: center;
        gap: 10px;
    }
    .file-details {
        flex: 1;
    }
    .file-name {
        font-weight: 500;
        margin-bottom: 2px;
    }
    .file-meta {
        font-size: 11px;
        color: #6c757d;
    }
    .module-badge {
        background: #e9ecef;
        padding: 4px 8px;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 500;
    }
    .tooltip-custom {
        position: relative;
        display: inline-block;
    }
    .error-tooltip {
        cursor: help;
        border-bottom: 1px dashed #dc3545;
    }
</style>
@endpush

@section('content')
    <div class="row">
        <div class="col-xl-12">
            <div class="row" data-paginate-type="backend" data-paginate-container data-url="{{ route('download-logs.index') }}">
                @include('pages.download-logs.partials.sort-filters')
                @include('components.common.flush-message')

                <div class="col-xl-12 wow fadeInUp" data-wow-delay="1.5s">
                    @include('components.datatable.backend-pagination.error')
                    @include('components.datatable.backend-pagination.loading')


                    <div class="table-responsive full-data">
                        <table class="table-responsive-lg table display dataTablesCard dataTable no-footer">
                            <thead class="thead-light">
                                <tr>
                                    <th width="50">#</th>
                                    <th>{{ __('labels.file') }}</th>
                                    <th>{{ __('labels.user') }}</th>
                                    <th>{{ __('labels.module') }}</th>
                                    <th>{{ __('labels.ip_address') }}</th>
                                    <th>{{ __('labels.file_size') }}</th>
                                    <th>{{ __('labels.status') }}</th>
                                    <th>{{ __('labels.downloaded_at') }}</th>
                                    {{-- <th width="80">{{ __('labels.actions') }}</th> --}}
                                </tr>
                            </thead>
                            <tbody data-table-container>
                                @include('pages.download-logs.partials.datatable-rows', ['listresults' => $listresults])
                            </tbody>
                        </table>
                    </div>
                    @include('components.datatable.backend-pagination.pagination',[
                        'listresults' => $listresults
                    ])
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
    <script>
        $(document).ready(function() {
            initBackendPagination();
        });
    </script>
@endpush