@php
    $table_id = isset($table_id) ? $table_id : uniqid(); //rand(1,100);
    $supplier_offers = $supplier_offers ?? [];
    $create_button = $create_button ?? true;
    $dom = $dom ?? 'tip';
    $all = strpos($dom, 'f');
    $status_class = [
        'offer_request_preparing' => 'bg-secondary',
        'offer_request_sent'      => 'bg-primary',
        'offer_received'          => 'bg-success',
        'order_preparing'         => 'bg-success',
        'order_sent'              => 'bg-success',
        'order_confirmation'      => 'bg-success',
        'order_confirmed'         => 'bg-success',
        'order_incomplete'        => 'bg-success',
        'order_received'          => 'bg-success',
        'order_deleted'           => 'bg-success',
    ];
    $rand = rand(1, 10000);
@endphp

<table class="table table-bordered table-striped table-hover display responsive" width="100%" id="supplier_offers_table_{{ $table_id }}">
    <thead>
        <tr>
            <th data-key="description">Árajánlat azonosító</th>
            <th data-key="description">Leírás</th>
            <th data-key="status">Státusz</th>
            <th data-key="offer_sent_at">Kérés időpontja</th>
            <th data-key="offer_received">Beérkezésének időpontja</th>
            <th data-key="amount">Összeg</th>
            <th data-key="name">Beszállító neve</th>
            <th data-key="email">Beszállító email címe</th>
            <th data-key="address">Beszállító címe</th>
            <th data-key="action" data-priority="1"></th>
        </tr>
    </thead>
    <tbody>
        @foreach ($supplier_offers as $row)
        <tr>
            <td>{{ $row->offer_identifier }}</td>
            <td>
                <div style="position:relative;cursor:pointer;" 
                    data-content="{{ $row->description }}" 
                    onmouseover="window.popoverClick($(this),true)" 
                    onmouseout="window.popoverClick($(this),false)">{{ mb_substr($row->description ?? '', 0, 10) }}...</div>    
            </td>
            <td>
                <span class="badge rounded-pill {{ $status_class[$row->status] }}">
                    {{ $row->status_lang }}
                </span>
            </td>
            <td>{{ $row->offer_sent_at }}</td>
            <td>{{ $row->offer_received }}</td>
            <td>{{ $row->amount }}</td>
            <td>{{ $row->supplier->name }}</td>
            <td>{{ $row->supplier->email }}</td>
            <td>{{ $row->supplier->address }}</td>
            <td>
                @if($row->status == 'offer_request_preparing')
                    {{-- <button type="button" class="btn btn-primary btn-label mx-auto"
                        data-bs-toggle="modal" data-bs-target="#supplierOfferRequestUploadModal" data-id="{{ $row->id }}"
                        @if($row->status == 'offer_request_preparing')
                            data-type="supplier_offer"
                        @else
                            data-type="supplier_offer"
                        @endif
                        >
                        <i class="fas fa-file-upload"></i>
                    </button> --}}
                    <button type="button" class="btn btn-primary btn-label mx-auto btn-sm"
                        {{-- onclick="formModal( '{{ route('process.show_supplier_offer_modal', ['client' => $client, 'process' => $process, 'offer' => $offer, 'form_blade' => 'form_supplier_offer', 'type' => 'supplier_offer', 'target_id' => $row->id, 'step' => 'file_upload']) }}', 'Beszállítói ajánlat kérése', 'Mentés', function(){}, function(){}, function(){window.location.reload();}, function(){}, function () {} );"  --}}


                        {{-- FormModal megnyitása a fájl feltöltéshez, és amennyiben a modalon ki van pipálva az email küldése, akkor megjelenítjük az email küldése modalt --}}
                        onclick="
                        formModal( 
                            '{{ route('process.show_supplier_offer_modal', ['client' => $client, 'process' => $process, 'offer' => $offer, 'form_blade' => 'form_supplier_offer', 'type' => 'supplier_offer', 'target_id' => $row->id, 'step' => 'file_upload']) }}', // url
                            'Beszállítói ajánlat feltöltése', // title
                            'Mentés', // button
                            function(){}, // beforeCallback
                            function(){}, // hideCallback
                            function(){
                                window.location.reload();
                                // if(window.send_email !== undefined && window.send_email == true) 
                                // {
                                //     window.send_email = false;
                                //     // email kiküldés modal megjelenítése
                                //     formModal(
                                //         '{{-- route('process.show_send_email_modal', ['email_type' => 'supplier_offer', 'file_type' => 'supplier_offer', 'data_id' => $row->id, 'data_model' => 'SupplierOffer', 'form_blade' => 'form_send_email']) --}}', // url
                                //         'Beszállítói ajánlat küldése emailben', // title
                                //         'Mentés', // button
                                //         function(){}, // beforeCallback
                                //         function(){}, // hideCallback
                                //         function(){window.location.reload();}, // doneCallback
                                //         function(){}, // failCallback
                                //         function(){} // submitClickCallback
                                //     ) 
                                // } else {window.location.reload();};
                            }, // doneCallback
                         function(){}, // failCallback
                         function(){
                            // if($('.modal.show').find('input[name=\'send_email\']').is(':checked')) // ha az email kiküldés checkbox be van pipálva, akkor send_email változó true és a doneCallback-ben le fut az email kiküldés modal megjelenítése
                            //     window.send_email = true;
                            // else 
                            //     window.send_email = false;
                            } // submitCallback
                        );" 

                        title="Ajánlatkérés kiküldése">
                        {{--<i class="fas fa-file-upload"></i>--}}
                        Küldés
                    </button>
                @endif
                @if($row->status == 'offer_request_sent')
                    {{-- <button type="button" class="btn btn-primary btn-label mx-auto"
                        data-bs-toggle="modal" data-bs-target="#supplierOfferUploadModal" data-id="{{ $row->id }}"
                        @if($row->status == 'offer_request_preparing')
                            data-type="supplier_offer"
                        @else
                            data-type="supplier_offer"
                        @endif
                        >
                        <i class="fas fa-file-upload"></i>
                    </button> --}}

                    <button type="button" class="btn btn-primary btn-label mx-auto btn-sm"
                        onclick="formModal( '{{ route('process.show_supplier_offer_modal', ['client' => $client, 'process' => $process, 'offer' => $offer, 'form_blade' => 'form_supplier_offer', 'type' => 'supplier_offer', 'target_id' => $row->id, 'step' => 'file_upload']) }}', 'Beszállítói ajánlat feltöltése', 'Mentés', function(){}, function(){}, function(){window.location.reload();}, function(){}, function () {} );" title="Megérkezett">
                        {{--<i class="fas fa-file-upload"></i>--}}
                        Megérkezett
                    </button>
                @endif
            </td>
        </tr>
        @endforeach
    </tbody>
</table>

@if ($create_button)
<div class="d-flex align-items-start gap-3 mt-4">
    <button type="button" class="btn btn-success btn-label ms-auto right"
        onclick="rowCreate('{{ route('supplier_offers.create', [$order->id]) }}', supplier_offers_table_{{ $table_id }}, '{{__('Új Beszállítói ajánlat')}}', '{!! __('Mentés') !!}', function() {window.location.reload()})">
        Új Beszállítói ajánlat
    </button>
</div>
@endif

@push('scripts')
<script>
    var supplier_offers_table_{{ $table_id }} = $('#supplier_offers_table_{{ $table_id }}').DataTable({
        dom: '{{ $dom }}',
        autoWidth: false,
        {{ ( $all ? 'iDisplayLength: -1,' : '' ) }}
    });

    supplier_offers_table_{{ $table_id }}.on( 'init.dt', function () {
        window.dt_col_resize('#supplier_offers_table_{{ $table_id }}');
    });

    var supplierOfferUploadModal = document.getElementById('supplierOfferUploadModal')
        supplierOfferUploadModal.addEventListener('show.bs.modal', function (event) {
        var button = event.relatedTarget

        var id = button.getAttribute('data-id')
        var modalId = supplierOfferUploadModal.querySelector('[name="target_id"]');
        modalId.value = id

        var type = button.getAttribute('data-type')
        var documentType = supplierOfferUploadModal.querySelector('[name="type"]');
        documentType.value = type
    })

    var supplierOfferRequestUploadModal = document.getElementById('supplierOfferRequestUploadModal')
        supplierOfferRequestUploadModal.addEventListener('show.bs.modal', function (event) {
        var button = event.relatedTarget

        var id = button.getAttribute('data-id')
        var modalId = supplierOfferRequestUploadModal.querySelector('[name="target_id"]');
        modalId.value = id

        var type = button.getAttribute('data-type')
        var documentType = supplierOfferRequestUploadModal.querySelector('[name="type"]');
        documentType.value = type
    })
</script>
@endpush

<!-- Modal -->
<div class="modal fade" id="supplierOfferRequestUploadModal" tabindex="-1" aria-labelledby="supplierOfferRequestUploadModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="supplierOfferRequestUploadModalLabel">Beszállítói ajánlatkérés feltöltése</h5>
        {{-- <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> --}}
        <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </div>
      <div class="modal-body">
        <form method="POST" id="supplierOfferRequestUpload" enctype="multipart/form-data"> @csrf
            <div class="form-group">
                <label for="description">{!! __('Leírás') !!}</label>
                <textarea class="form-control" id="description" name="description" rows="2"></textarea>
            </div>

            <div class="form-group">
                <label for="file">{!! __('Fájl') !!}</label>
                <input type="file" class="form-control" id="file" name="file[]" style="height: auto !important" multiple />
            </div>

            <div class="form-check mb-3">
                <input class="form-check-input" type="checkbox" value="1" name="send_email" id="send_email_{{$rand}}">
                <label class="form-check-label" for="send_email_{{$rand}}">
                    Kiküldés e-mailben {{-- test-09 --}}
                </label>
            </div>

            <input type="hidden" name="type" value="">
            <input type="hidden" name="target_type" value="App\Models\SupplierOffer">
            <input type="hidden" name="target_id" value="">
            <input type="hidden" name="overwrite" value="false">
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Mégse</button>
        <button type="submit" class="btn btn-primary" form="supplierOfferRequestUpload" name="file_upload" value="true">Küld</button>
      </div>
    </div>
  </div>
</div>

<!-- Modal -->
<div class="modal fade" id="supplierOfferUploadModal" tabindex="-1" aria-labelledby="supplierOfferUploadModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="supplierOfferUploadModalLabel">Beszállítói ajánlat feltöltése</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <form method="POST" id="supplierOfferUpload" enctype="multipart/form-data"> @csrf
            <div class="form-group">
                <label for="deadline">{!! __('Vállalt határidő') !!}</label>
                <input id="deadline" type="number" class="form-control" name="deadline" value="">
                <div class="input-group mb-3">
                    <input id="deadline" type="number" class="form-control" name="deadline" value="" oninput="maxTwoChar($(this));">
                    <span class="input-group-text">hét</span>
                </div>
            </div>

            <div class="form-group">
                <label for="description">{!! __('Leírás') !!}</label>
                <textarea class="form-control" id="description" name="description" rows="2"></textarea>
            </div>

            <div class="form-group">
                <label for="amount">{!! __('Ár') !!}</label>
                <input type="number" class="form-control" name="amount">
            </div>

            <div class="form-group">
                <label for="file">{!! __('Fájl') !!}</label>
                <input type="file" class="form-control" id="file" name="file[]" style="height: auto !important" multiple />
            </div>

            <div class="form-check mb-3">
                <input class="form-check-input" type="checkbox" value="1" name="send_email" id="send_email_{{$rand}}">
                <label class="form-check-label" for="send_email_{{$rand}}">
                    Kiküldés e-mailben {{-- test-10 --}}
                </label>
            </div>

            <input type="hidden" name="type" value="">
            <input type="hidden" name="target_type" value="App\Models\SupplierOffer">
            <input type="hidden" name="target_id" value="">
            <input type="hidden" name="overwrite" value="false">
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Mégse</button>
        <button type="submit" class="btn btn-primary" form="supplierOfferUpload" name="file_upload" value="true">Küld</button>
      </div>
    </div>
  </div>
</div>