@php
    $table_id = isset($table_id) ? $table_id : uniqid(); //rand(1,100);
    $surveys = $surveys ?? [];
    $dom = $dom ?? 't';
    $all = strpos($dom, 'f');
    $status_class = [
        'organize'          => 'bg-primary',
        'search_again'      => 'bg-warning',
        'client_looking'    => 'bg-warning',
        'delayed'           => 'bg-warning',
        'organized'         => 'bg-secondary',
        'completed'         => 'bg-success',
    ];
@endphp


<table class="table table-bordered table-striped table-hover display responsive nowrap" width="100%" id="surveys_table_{{ $table_id }}">
    <thead>
        <tr>
            <th class="d-none" data-key="id">Azonosító</th>
            <th data-key="survey_number">Felmérésszám</th>
            <th data-key="status">Státusz</th>
            <th data-key="start_date">Kezdete</th>
            <th data-key="end_date">Vége</th>
            <th data-key="description">Leírás</th>
            <th data-key="comments">Felmérő megjegyzése</th>
            <th data-key="action" data-priority="1"></th>
        </tr>
    </thead>
    <tbody>
        @foreach ($surveys as $_survey)
        <tr>
            <td class="d-none">{{ $_survey->id }}</td>
            <td>{{ $_survey->survey_number }}</td>
            <td>
                <span class="badge rounded-pill {{ $status_class[$_survey->status] }}">
                    {{ $_survey->status_lang }}
                </span>
            </td>
            <td>{{ $_survey->start_date }}</td>
            <td>{{ $_survey->end_date }}</td>
            <td>
                <div style="position:relative;cursor:pointer;" 
                    data-content="{{ $_survey->description }}" 
                    onmouseover="window.popoverClick($(this),true)" 
                    onmouseout="window.popoverClick($(this),false)">{{ mb_substr($_survey->description ?? '', 0, 10) }}...</div>
            </td>
            <td>
                <div style="position:relative;cursor:pointer;" 
                    data-content="{{ $_survey->comments->pluck('comment')->implode(' ') }}" 
                    onmouseover="window.popoverClick($(this),true)" 
                    onmouseout="window.popoverClick($(this),false)">{{ mb_substr($_survey->comments->pluck('comment') ? $_survey->comments->pluck('comment')->implode(' ') : '', 0, 10) }}...</div>
            </td>
            <td>
                @if($_survey->status == 'organized' && date('Y-m-d', strtotime($_survey->start_date)) <= date('Y-m-d', strtotime(now())))
                    <button type="button" class="btn btn-success btn-sm mr-1"
                        data-bs-toggle="modal" data-bs-target="#surveyUploadModal" data-id="{{ $_survey->id }}"
                        data-type="survey"
                        >
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-upload" viewBox="0 0 16 16">
                            <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
                            <path d="M7.646 1.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 2.707V11.5a.5.5 0 0 1-1 0V2.707L5.354 4.854a.5.5 0 1 1-.708-.708l3-3z"/>
                        </svg>
                    </button>
                @endif
                @if (!in_array($_survey->status, ['completed']))
                <button type="button" class="btn btn-danger btn-sm" onclick="rowDelete( '{{ route('surveys.destroy', ['id' => $_survey->id]) }}', surveys_table_{{ $table_id }}.row( this ), 'Felmérés', 'Felmérés törlése.', 'Mehet', 'delete', function () {window.location.reload();} )">
                    {{-- törlés --}}
                    <i class="fas fa-trash"></i>
                </button>
                @endif
            </td>
        </tr>
        @endforeach
    </tbody>
</table>

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

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


    surveys_table_{{ $table_id }}.on('dblclick', 'tr', function () {
        var data = surveys_table_{{ $table_id }}.row(this).data();
        console.log(data[0]);
        window.location = '{{ route('surveys.organize', ['id' => '']) }}' + '/' + data[0];
    });

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

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

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

        var id = button.getAttribute('data-id')
        var modalId = surveyUploadModal.querySelector('[name="survey_id"]');
        modalId.value = id
    })
</script>
@endpush

{{-- <!-- Modal -->
<div class="modal fade" id="surveyUploadModal" tabindex="-1" aria-labelledby="surveyUploadModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="surveyUploadModalLabel">Felmérés eredményének 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="surveyUpload" 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">
                <input class="form-check-input" type="checkbox" value="1" name="send_email" id="send_email" disabled>
                <label class="form-check-label" for="send_email">
                    Kiküldés e-mailben
                </label>
            </div>

            <input type="hidden" name="type" value="survey">
            <input type="hidden" name="target_type" value="App\Models\Offer">
            <input type="hidden" name="target_id" value="{{ $offer->id }}">
            <input type="hidden" name="survey_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="surveyUpload" name="file_upload" value="true">Küld</button>
      </div>
    </div>
  </div>
</div> --}}