@php
    use App\Enums\StatusEnum;
@endphp
<tr style="cursor: pointer;"
        class="table-row-visitor"
        data-url="{{ $rowRoutes }}"
        oncontextmenu="event.preventDefault(); window.open('{{ $rowRoutes }}', '_blank');"
    >
    <td class="has-text-centered" onclick="event.stopPropagation();">{{-- {{ $loop->index + 1 + $visitors->perPage() * ($visitors->currentPage() - 1) }} --}}
        <label class="custom-checkbox">
          <input type="checkbox" class="checkbox" name="item" value="{{ $v->id }}" onclick="updateCheckAll()">
          <span class="checkmark"></span>
        </label>
    </td>
    <td style="min-width: 200px; max-width: 280px;">
        <div class="collapse has-chevron" style="margin: 0; padding: 0; border: none;">
            <div class="collapse-header" style="height: auto; min-height: 40px; padding: 5px 0;">
                <h4 style="word-wrap: break-word; white-space: normal; line-height: 1.4;">{!! $location_str !!}</h4>
            </div>
            <div class="collapse-content">
                <div class="content">
                    <ol type="1" style="margin: 10px 0; padding-left: 20px;">
                        @foreach($location_names as $loc)
                        <li style="word-wrap: break-word; white-space: normal; margin-bottom: 5px;">{{ $loc }}</li>
                        @endforeach
                    </ol>
                </div>
            </div>
        </div>
    </td>
    <td>
        <div class="flex-media">
            <div class="h-avatar is-small">
                <img class="avatar" src="{{ $avatar }}">
            </div>
            <div class="meta">
                <span>{{ $v->name }}</span>
            </div>
        </div>
    </td>
    <td>
        <div class="flex-media">
            <div class="h-avatar is-small">
                <img class="avatar" src="{{ $avatar2 }}">
            </div>
            <div class="meta">
                <span>{{ $sqlAdminContrakror->name ?? '' }}</span>
            </div>
        </div>
    </td>
    <td>{{ $v->company }}</td>
    <td class="has-text-centered">{{ $v->purposed }}</td>
    <td>
        {{ optional($v->gateInVisitor[0])->start_duty ? date('d F Y', strtotime($v->gateInVisitor[0]->start_duty)) : '-' }}
    </td>
    <td>
        {{ optional($v->gateInVisitor[0])->end_duty ? date('d F Y', strtotime($v->gateInVisitor[0]->end_duty)) : '-' }}
    </td>
    <td @if($v->status_mcu_approval == 'Need Review') onclick="event.stopPropagation();" @endif class="has-text-centered">
        <a @if($v->status_mcu_approval == 'Need Review') href="{{ route('gate-in.edit-visitor', ['id' => encrypt($v->id)]) }}" @endif>
            <span class="{{ $v->status_permission_class }}" data-hint="{{ $v->status_permission_tooltip_text }}">
                {{$v->status_mcu_approval }}
            </span>
        </a>
    </td>
    <td>
        <div class="buttons">
            @hasrole(['super_admin', 'user_admin', 'contract_user'])
                @include('components.util.change-status', [
                    'status' => $v->status,
                    'name' => 'gatein_status_visitor' . $v->id,
                    'user_id' => $v->id,
                    'type' => 'gatein_status_visitor',
                    'class' => 'update-status-gatein',
                    'route' => route('gate-in.visitor.update-status'),
                    'gate_in_id' => null,
                    'style' => 'width:170px',
                ])
            @else
                @include('components.util.label-only', [
                    'status' => $v->status,
                    'name' => 'gatein_status_visitor' . $v->id,
                    'user_id' => $v->id,
                    'type' => 'gatein_status_visitor',
                    'class' => 'update-status-gatein',
                    'route' => route('gate-in.visitor.update-status'),
                    'gate_in_id' => null,
                    'style' => 'width:170px',
                ])
            @endhasrole
        </div>
    </td>
        @php
            $allowedUpdate = $accessService->visitorCanUpdateAssignedDoctor(Auth::user(), $v);
            $roleName = Auth::user()->getRoleNames()->first();

            $allowedRoles = [
                "super_admin",
                "user_admin"
            ];

            $useHint = false;
            $useIcon = false;
            if(in_array($roleName, $allowedRoles)) {
                $useHint = true;
                $useIcon = true;
            }

            $onclick = false;
            if(in_array($roleName, $allowedRoles) && $allowedUpdate) {
                $onclick = true;
            }

            $class = 'doctor-cell';
            $hint = "";

            if ($useHint) {
                $hint = $allowedUpdate ? 'Click to edit' : 'Editing not allowed';

                if ($allowedUpdate) {
                    $class .= ' editable';
                }
            }

        @endphp
    <td
        @if($onclick)
            onclick="event.stopPropagation(); handleDoctorCellClick(this)"
        @endif
        @if($useHint)
            data-hint="{{ $hint }}"
        @endif
        class="{{ $class }}"
        data-id="{{ $v->id }}"
        data-doctor-id="{{ $v->mcu_reviewed_by }}">
        <div
            @if($useHint)
                data-hint="{{ $hint }}"
            @endif
            class="is-flex is-align-items-center is-justify-content-space-between is-fullwidth {{ $useHint ? 'hint--top' : '' }}">
            <span class="doctor-name has-text-nowrap">{{ $v->name_doctor_review ?? '-' }}</span>
            @if($useIcon)
                <i class="lnil lnil-pencil-alt ml-1"></i>
            @endif
        </div>
    </td>

    <td class="has-text-centered">
        @if($v->sponsor)
            @if($v->status != StatusEnum::APPROVED->value && $v->status != StatusEnum::DECLINE->value)
                <button
                    class="button is-small is-info resend-email-sponsor"
                    data-visitor-id="{{ $v->id }}"
                    data-sponsor-email="{{ $v->sponsor }}"
                    title="Resend email to {{ $v->sponsor }}"
                >
                    <span class="icon">
                        <i class="fas fa-envelope"></i>
                    </span>
                    <span>Resend</span>
                </button>
            @else
                <span class="tag is-light">{{ $v->sponsor }}</span>
            @endif
        @else
            <span class="tag is-light">No Sponsor</span>
        @endif


        {{-- @if($v->status == 'Approved')
            <a class="button h-button is-rounded is-dark" href="javascript:;" style="padding: 5px 10px !important;height: auto;margin-top: 10px;font-size: 10px;border-radius: 4px;" onclick="event.preventDefault(); event.stopPropagation(); downloadQR('{{ $v->qrCode?->image ?? '' }}', '{{ $v->name }}.png')">
                Download <br>QR Code
            </a>
        @endif --}}
        @php
            $urlDownload = $v->qrCode?->image ?? '';
            
            if($urlDownload){
                $urlDownload2 = route('download-qrcode', ['url' => $urlDownload]);
            }else{
                $urlDownload2 = 'javascript:;';
            }
        @endphp
        @if($v->status == 'Approved')
            <a class="button h-button is-rounded is-dark" href="javascript:;" style="padding: 5px 10px !important;height: auto;margin-top: 10px;font-size: 10px;border-radius: 4px;" onclick="event.preventDefault(); event.stopPropagation(); window.location.href='{{$urlDownload2}}'">
                Download <br>QR Code
            </a>
        @endif
    </td>
</tr>