@extends('layouts.app')
@section('urlContent')
    {!! view('components.breadcrumbs', [
        'b_items' => [
            'İmza Föyü İşlemleri' => '/accounting/signature-sheet/index',
            'Firmalar' => '/accounting/signature-sheet/company-list',
            'Föyler' => '/accounting/signature-sheet/list/' . request()->segment(4),
        ],
    ]) !!}
@endsection
@section('content')
    <div class="container-app">
        <div class="relative overflow-x-auto shadow-md sm:rounded-lg">
            <table class="w-full text-sm text-left text-gray-400">
                <thead class="text-xs text-theme_white uppercase bg-theme_black">
                    <tr>
                        <th scope="col" class="px-6 py-3">
                            Tarih
                        <th scope="col" class="px-6 py-3 w-12 text-center">
                            Açıklama
                        </th>
                        <th scope="col" class="px-6 py-3 w-12 text-center">
                            Firma
                        </th>
                        <th scope="col" class="px-6 py-3 w-12 text-center">
                            Şube
                        </th>
                        <th scope="col" class="px-6 py-3 w-12 text-center">
                            Belge
                        </th>
                        </th>
                        <th scope="col" class="px-6 py-3 w-12 text-center">
                            Sil
                        </th>
                        <th scope="col" class="px-6 py-3 w-12 text-center">
                            Düzenle
                        </th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($signatures as $item)
                        <tr class="border-t bg-theme_secondary_black hover:bg-teheme_third_black">
                            <th scope="row" class="px-6 py-4 font-medium text-gray-200 whitespace-nowrap">
                                {{ $item->date }}
                            </th>
                            <th scope="row" class="px-6 py-4 font-medium text-gray-200 whitespace-nowrap">
                                {{ $item->description }}
                            </th>
                            <th scope="row" class="px-6 py-4 font-medium text-gray-200 whitespace-nowrap">
                                {{ $item->headOffice->office_name ?? 'Firma Bulunamadı' }}
                            </th>
                            <th scope="row" class="px-6 py-4 font-medium text-gray-200 whitespace-nowrap">
                                {{ $item->branchOffice->branch_name ?? 'Şube Bulunamadı' }}
                            </th>
                            <th scope="row" class="px-6 py-4 font-medium text-gray-200 whitespace-nowrap text-center">
                                @php
                                    $path = Str::substr($item->file_path, -3);
                                @endphp
                                <button value="{{ getCdnFile($item->file_path)}}"
                                    class="@if ($path == 'png') imageFile @else pdfFile @endif inline-flex items-center p-1 rounded gap-2 font-medium text-white bg-blue-600">
                                    <i class="fa-solid fa-eye"></i>
                                </button>
                                <a href="{{ route('download.file', ['url' => $item->file_path]) }}"
                                    class="ml-2 inline-flex items-center p-1 rounded gap-2 font-medium text-white bg-green-600">
                                    <i class="fa-solid fa-file-arrow-down"></i>
                                </a>
                            </th>
                            <td class="px-6 py-4 text-center">
                                <form method="POST" action="{{ route('accounting.signatureSheetDelete', [$item->id]) }}" onsubmit="showLoading()">
                                    @csrf
                                    @method('DELETE')
                                    <button class="font-medium text-red-600 dark:text-red-600">
                                        Sil
                                    </button>
                                </form>
                            </td>
                            <td class="px-6 py-4 text-center">
                                <a href="{{ route('accounting.editSignatureSheet', [$item->id]) }}"
                                    class="font-medium text-blue-600 dark:text-blue-500 hover:underline">
                                    Düzenle
                                </a>
                            </td>
                        </tr>
                    @empty
                        <tr class="border-t bg-theme_secondary_black hover:bg-teheme_third_black">
                            <th colspan="7" class="px-6 py-4 font-medium text-gray-200 whitespace-nowrap">
                                Hiç Föy Bulunamadı
                            </th>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
    @include('components.pdfViewer')
    @if (session('error'))
        @include('components.error-modal')
    @endif
    @if (session('success'))
        @include('components.success-modal')
    @endif
@endsection
@section('javascript')
    <script>
        $('.imageFile').click(function() {
            $('#filePath').empty();
            $('#filePath').append(
                '<img class="w-full rounded-lg h-full object-contain" src="' + $(this).val() + '">'
            );
            $('#pdf-popup').fadeIn('slow');
        })

        $('.pdfFile').click(function() {
            $('#filePath').empty();
            $('#filePath').append(
                '<iframe src="' + $(this).val() +
                '" style="width:100%; height:500px; border-radius:8px;" frameborder="0"></iframe>'
            );
            $('#pdf-popup').fadeIn('slow');
        })

        $('.close-pdf-popup').click(function() {
            $('#pdf-popup').fadeOut('slow');
        })
    </script>
@endsection